This project explored basics properties of CSS Grid and how it allows responsive layouts.
Also took into account how the use of images affect the page's performance and explored tools to detect and solve issues with the images.
- Properties
- grid-template-columns
- grid-template-rows
- justify-content
- gap
- grid-column
- grid-row
- Special Functions and Keywords
- repeat()
- minmax
- fr
- auto-fit
- Gimp used to
- Scale the image to the needed dimensions.
- Reduce the image size.
- imageoptim used to
- Compress the image taking into account factors like
- Quality
- Format
- DPI mode
- Color quality
- Compress the image taking into account factors like
- Lighthouse
- Used to check the overall quality of the webpage
- Performance
- Accesibility
- SEO
- Best practices
- Used to check the overall quality of the webpage
- RespImageLint
- Used to detect images's issues.