image improvements #519
image improvements #519
Conversation
There was a problem hiding this comment.
Pull request overview
This pull request adds explicit width and height attributes to images across the landing page and implements responsive image loading using srcset for critical hero images to improve Lighthouse performance scores.
- Added explicit width and height attributes to prevent layout shift
- Implemented responsive images with srcset for hero banner and logo
- Added CSS rules to maintain proper image aspect ratios with
height: auto
Reviewed changes
Copilot reviewed 7 out of 14 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
app/views/landing/sections/_previously_hosted.html.erb |
Added width/height dimensions to all event card images and stat badges |
app/views/landing/sections/_inspiration.html.erb |
Added width/height to project author profile pictures and screenshots |
app/views/landing/sections/_how_this_works.html.erb |
Added width/height to step images (syntax errors present) |
app/views/landing/sections/_hero.html.erb |
Implemented srcset for responsive loading of hero banner and logo images |
app/views/landing/sections/_footer.html.erb |
Added width/height to footer image |
app/views/landing/projects/_project_idea_generator.html.erb |
Added width/height to bakery background image |
app/assets/stylesheets/landing.scss |
Added height: auto rules to ensure images scale proportionally |
| Binary image files | Added multiple responsive image variants for hero banner and logo |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
Hold off on the image additions for now! I'm adding #522 to generate this stuff automatically! |
|
ok, i'll keep the explicit image size setting tho! |
|
@PythonAtSea by adding the images in the commit & then adding a new commit to delete them the data is now in the repo for all time. Please remove the images from the earlier commit– don't just add a commit to remove them. I'm asking you to upload a single png that's the "source file" and then we can generate the other sizes to keep the repo size small. |
|
ok gimme a second to mess with git |
|
@maxwofford right now replacing the .avif files with PNGs will break a bunch of images, do you want to do that in #522? |
2 participants
@3kh0 here's some more lighthouse stuff!