Skip to main content
CSS is fun and cool and I like it.
Link

“the closest thing web standards have to a golden rule”

Link

How do you figure?

Article

Using Artificial Intelligence to Generate Alt Text on Images

Web developers and content editors alike often forget or ignore one of the most important parts of making a website accessible and SEO performant: image alt​ text. You know, that seemingly small image attribute that describes an image:

​​​<img src="/cute/sloth/image.jpg" alt="A brown baby sloth staring straight into the camera with a tongue sticking out." >

📷 Credit: Huffington Post

If you regularly publish content on the web, then you know it can be tedious trying to come up with descriptive … Read article

Link

An Almost Ideal React Image Component

Link

Extinct & Endangered

Article

The Contrast Swap Technique: Improved Image Performance with CSS Filters

With CSS filter effects and blend modes, we can now leverage various techniques for styling images directly in the browser. However, creating aesthetic theming isn't all that filter effects are good for. You can use filters to indicate hover state, hide passwords, and now—for web performance.

While playing with profiling performance wins of using blend modes for duotone image effects (I'll write up an article on this soon), I discovered something even more exciting. A major image optimization win! … Read article

Article

Lazy Loading Gravatars in WordPress

Most WordPress themes show user Gravatars in the comment threads. It's a way of showing an image with the user, as associated by the email address used. It's a nice touch, and almost an expected design pattern these days.

Every one of those gravatars is an individual HTTP request though, like any other image. A comment thread with 50 comments means 50 HTTP requests, and they aren't always particularly tiny files. Yeesh.

Let's lazy load them.… Read article

Article

Develop Locally, Use Images from Production

Working on your website locally means having the files that make your website tick right there on your computer. It's common those files live in a version control repository. You work on them, and push them up to the repo when you are ready. Other people work too, and you pull their changes back down.

What might not be in that repo, are images files from the CMS. WordPress is a classic example of this. When you upload an image … Read article

Article

Using WebP Images

We've all been there before: You're browsing a website that has a ton of huge images of delicious food, or maybe that new gadget you've been eyeballing. These images tug at your senses, and for content authors, they're essential in moving people to do things.

Except that these images are downright huge. Like really huge. On a doddering mobile connection, you can even see these images unfurl before you like a descending window shade. You're suddenly reminded of the bad … Read article

icon-link icon-logo-star icon-search icon-star