Skip to main content
CSS-Tricks
  • Articles
  • Videos
  • Almanac
  • Newsletter
  • Guides
  • DigitalOcean
  • DO Community
Search

Articles Tagged
images

41 Articles
{
,

}
Direct link to the article Inline Image Previews with Sharp, BlurHash, and Lambda Functions
image strategies images

Inline Image Previews with Sharp, BlurHash, and Lambda Functions

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 …

Avatar of Adam Rackis
Adam Rackis on May 19, 2022 (Updated on May 20, 2022)
Direct link to the article Useful Tools for Creating AVIF Images
av1 avif images

Useful Tools for Creating AVIF Images

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 …

Avatar of Sunkanmi Fafowora
Sunkanmi Fafowora on May 9, 2022 (Updated on May 10, 2022)
Direct link to the article The Search For a Fixed Background Effect With Inline Images
background-attachment background-image fixed position images

The Search For a Fixed Background Effect With Inline Images

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 …

Avatar of Alex Lazar
Alex Lazar on Jan 6, 2022 (Updated on Jan 9, 2022)
Direct link to the article A Look at the Cloudinary WordPress Plugin
cloudinary image optimization images WordPress

A Look at the Cloudinary WordPress Plugin

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:

  • It takes over your media handling. Images
…
❥ Sponsored (Written by Chris Coyier)
Direct link to the article Frameworks Helping Image Usage
image optimization images performance

Frameworks Helping Image Usage

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 …

Avatar of Chris Coyier
Chris Coyier on Sep 9, 2021
Direct link to the article Your Image Is Probably Not Decorative
accessibility alt text images

Your Image Is Probably Not Decorative

Direct Link

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

…
Avatar of Chris Coyier
Shared by Chris Coyier on Jul 20, 2021
Direct link to the article Images are hard.
images

Images are hard.

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 …

Avatar of Chris Coyier
Chris Coyier on Jul 19, 2021 (Updated on Jul 22, 2021)
Direct link to the article The Humble `img` Element And Core Web Vitals
images performance

The Humble `img` Element And Core Web Vitals

Direct Link

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

…
Avatar of Chris Coyier
Shared by Chris Coyier on May 17, 2021
Direct link to the article Maximally optimizing image loading for the web in 2021
image optimization images performance

Maximally optimizing image loading for the web in 2021

Direct Link

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.

…
Avatar of Chris Coyier
Shared by Chris Coyier on Feb 16, 2021 (Updated on Feb 18, 2021)
Direct link to the article Add Beautiful Images with the Unsplash API
images

Add Beautiful Images with the Unsplash API

Perhaps you know Unsplash? I’d wager it’s the most popular stock photography site out there for two big reasons:

  1. Every photo on there is pretty darn nice
  2. Every photo is entirely free even for commercial use. You don’t have
…
❥ Sponsored
Direct link to the article Do This to Improve Image Loading on Your Website
aspect ratio images performance

Do This to Improve Image Loading on Your Website

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 …

Avatar of Robin Rendle
Robin Rendle on Feb 19, 2020
  • 1
  • 2
  • 3
  • ...
  • 4
  • Older

CSS-Tricks is powered by DigitalOcean.

Keep up to date on web dev

with our hand-crafted newsletter

DigitalOcean
  • DigitalOcean
  • DigitalOcean Community
  • About DigitalOcean
  • Legal
  • Free Credit Offer
CSS-Tricks
  • Email
  • Guest Writing
  • Book
  • Advertising
Follow
  • Twitter
  • Instagram
  • YouTube
  • CodePen
  • iTunes
  • RSS
Back to Top