Skip to content

possible optimisation of images#46

Open
nwztest wants to merge 1 commit into
mainfrom
optimise-images
Open

possible optimisation of images#46
nwztest wants to merge 1 commit into
mainfrom
optimise-images

Conversation

@nwztest

@nwztest nwztest commented Jan 26, 2025

Copy link
Copy Markdown
Contributor

changed height and width to 300 in the card, but when i zoom in, some images with higher res remain high res.

fixes #45

@nwztest

nwztest commented Jan 26, 2025

Copy link
Copy Markdown
Contributor Author

highkey think i'm underthinking this problem

@netlify

netlify Bot commented Jan 26, 2025

Copy link
Copy Markdown

Deploy Preview for courageous-hotteok-f7dfd1 ready!

Name Link
🔨 Latest commit 37053de
🔍 Latest deploy log https://app.netlify.com/sites/courageous-hotteok-f7dfd1/deploys/6795c96a70cda400087b501d
😎 Deploy Preview https://deploy-preview-46--courageous-hotteok-f7dfd1.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@nwztest nwztest requested a review from icepcp January 26, 2025 05:40
@icepcp

icepcp commented Jan 26, 2025

Copy link
Copy Markdown
Member

am currently away and will get back to you on this within the week

@icepcp icepcp left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a good start but however it is not sufficient

Images are reported as not properly sized in pagespeed: https://pagespeed.web.dev/analysis/https-deploy-preview-46--courageous-hotteok-f7dfd1-netlify-app-team/69gw2a4wxw?form_factor=desktop
This means that we should look into dynamically resizing said images so they'll be optimized for any kinds of screen
and i just realized i never did the alt text properly haha, if yall can fix that too that wld be great (e.g. a photo of {name})

Can look at these for optimization: https://docs.astro.build/en/guides/images/#create-responsive-images-with-the-picture--component

https://developer.chrome.com/docs/lighthouse/performance/uses-responsive-images/?utm_source=lighthouse&utm_medium=lr

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

have optimized images for the website

2 participants