Don’t you hate it when you load a website or web app, some content displays and then some images load — causing content to shift around? That’s called content reflow and can lead to an incredibly annoying user experience for …
AVIF (AV1 Image File Format) is a modern image file format specification for storing images that offer a much more significant file reduction when compared to other formats like JPG, JPEG, PNG, and WebP. Version 1.0.0 of the AVIF specification …
I was working on a client project a few days ago and wanted to create a certain effect on an <img>. See, background images can do the effect I was looking for somewhat easily with background-attachment: fixed;. With …
Cloudinary (the media hosting and optimization service) has a brand new version (v3) of its WordPress plugin that has really nailed it. First, a high-level look at the biggest things this plugin does:
I recently blogged about how images are hard and it ended up being a big ol’ checklist of things that you could/should think about and implement when placing images on websites.
I think it’s encouraging to see frameworks — these …
Eric doesn’t mince words, especially in the title, but also in the conclusion:
…In modern web design and development, displaying an image is a highly intentional act. Alternate descriptions allow us to explain the content of the image, and in
Putting images on websites is incredibly simple, yes? Actually, yes, it is. You use <img> and link it to a valid source in the src attribute and you’re done. Except that there are (counts fingers) 927 things you could (and …
Addy Osmani on images in HTML:
…The humble
<img>element has gained some superpowers over the years. Given how central it is to image optimization on the web, let’s catch up on what it can do and how it can
Malte Ubl’s list for:
…8 image loading optimization techniques to minimize both the bandwidth used for loading images on the web and the CPU usage for image display.
Perhaps you know Unsplash? I’d wager it’s the most popular stock photography site out there for two big reasons:
In the video embedded below, Jen Simmons explains how to improve image loading by using width and height attributes. The issue is that there’s a lot of jank when an image is first loaded because an img will naturally have …
