5 documents tagged with “Images”
Images.
AVIF Images: Up to 40% Data Savings Compared to WebP
The AVIF format offers even better compression than WebP. Let’s explore when it makes sense to use it and how to implement a fallback for older browsers.
CLS: How to Maintain Element Heights (Images, JS Components, Iframes…)
Learn why and how to ensure dimensions for elements like <img>, <iframe>, or JavaScript components that are asynchronously inserted into the page, at the HTML or CSS level.
Image Optimization: When Milliseconds Decide Between Kilobytes and Pixels
Even you, mere mortals, can tame your images and make them work for you, not against you. Just use WebP or AVIF, compress well, and don’t forget about lazy loading.
Lazy Loading Images: A Detailed Guide to Improving LCP
We recommend lazy loading images and other elements as one of the fundamental and highly effective methods for optimizing page load speed. Conservatively defer loading all images outside the first viewport. Be cautious when applying lazy loading to images that are the LCP element, as this can actually worsen speed.
WebP Images: How to Save Precious Kilobytes
The speed of a website often hinges on seconds. The WebP image format can be your secret weapon to save kilobytes and edge closer to optimal performance.