Filtered By Tag: images

How Fast Is… FIFA’s World Cup Website?


Our regular video series How Fast Is…? examines real world websites and details the cause of their performances issues as well as what should be done to solve them. After all, the best way to learn about front-end web performance is to see what other people are doing right and doing wrong. In this edition [...]

Read More

Achieving Better Image Optimization with Lossy Techniques

According to the HTTP Archive, images are the dominant form of content on the web today. They account for the largest number of requests when loading a webpage as well as the most amount of data that is transferred to the client. This is a continuing trend. Clearly learning how to properly optimize images is [...]

Read More

How Do Google’s Animated Doodles Work?

Sunday was Earth Day. As with many holidays or anniversaries, Google celebrated Earth Day with an animated doodle. This is certainly not the first animated doodle that Google has done. Since I have been speaking so much about images recently, I thought it would be interesting to see how Google creates small and fast animations. [...]

Read More

Unsuitable Image Formats for Websites

As I mentioned in our How Fast Is … USPS.com video and blog post yesterday, I discovered a few TIFF files on the US Postal Service’s website. I thought a follow up post about images suitable for use on the web was in order. According to the awesome HTTP Archive, the most common image formats [...]

Read More

Instagram and Optimizing Favicons

Something interesting and cool happened with photo sharing service Instagram in the last week. No, I’m not talking about Facebook buying them for $1,000,000,000.00. I’m referring to Instagram co-founder Mike Krieger, and the talk he gave at AirBNB entitled "Scaling Instagram." In his presentation, Mike discusses the technical hurdles faced by going from 0 to [...]

Read More

Poor Choices are Ruining the Web

A recent article by John Naughton has sparked a debate inside the web design and web development community. Are designers, with their image heavy designs, ruining the web? The answer is yes, but its not why you think. It’s not because designers use big images or even that they use a lot of images. It’s [...]

Read More

Optimizing Gradients

Gradient backgrounds are a common visual element on modern websites. And while you can use browser specific CSS extensions to directly create gradient backgrounds with pure CSS the much more common method is to use an image. Traditionally, when a web designer wants to create a gradient to a webpage, they use a program like [...]

Read More

Choosing PNG8 Candidate Images

Have you heard about PNG8 yet? No? Well, PNG8 is a PNG image that is used an indexed palette of 256 colors instead of a true color PNG which can support several million different colors. There has already been a number of excellent articles and blog posts written about PNG8. These articles have discussed things [...]

Read More

Top PNG Optimizers Don’t Use zlib

Oleg Kikin has an interesting chart comparing the performance multiple different PNG optimizing tools. The tools tested are: PNGOut AdvanceCOMP OptiPNG PunyPNG Smush.it PNGCrush PNG Recompressor RIOT Go take a look at the PNG comparison chart. I can wait. So what do these results mean? Well I believe it shows how far image optimization has [...]

Read More