w3c / w3c-website

W3C Website feedback and bug reports
https://www.w3.org/
242 stars 81 forks source link

Optimize images on homepage #288

Open acme opened 1 year ago

acme commented 1 year ago

Describe the issue

The homepage is 362 KB of images. It would load faster if these were optimized.

For example:

To reproduce Visit https://beta.w3.org/

Expected behavior Fewer bytes needed to display the same content.

Screenshots https://www.webpagetest.org/result/230310_AiDc7Y_8R8/3/breakdown/

image

Additional context

ilyasbloch123 commented 1 year ago

Remove Image Metadata: Image files often contain metadata such as camera information, date, and location. Removing this metadata reduces the file size. There are various tools available online and software like Adobe Photoshop or GIMP that can help you remove metadata before uploading images to your website.

Use Modern WebP or AVIF Format: WebP and AVIF are modern image formats that offer high compression rates without significant loss of quality. Converting your images to WebP or AVIF format can drastically reduce file sizes. You can use tools like Adobe Photoshop, GIMP, or online converters to convert your existing images to WebP or AVIF format.

Decrease SVG Numerical Accuracy: SVG files can sometimes contain highly accurate numerical values, which can be reduced to decrease file size. For example, a value like 19.0336398 can be rounded to 19.03. You can use a text editor or an SVG optimizer tool to manually adjust these numerical values in your SVG files. To reproduce https://allbrandprice.com/