up

Filtered By Tag: images

Content Detection: A wretched hive of scum and villainy

TwitterLinkedInGoogle+FacebookShare

A few days ago, I wrote about how the BBC was serving a BMP image as a JPEG. Several people have asked me why would this even work at all? The file extension and the MIME Type both implied it was a JPEG, but the file wasn’t a JPEG. How could the browser even render [...]

Read More

From Performance Issue to Bug to 3 New Features

“It has to be a bug” I thought. “This makes absolutely no sense!” We were about to go live with a major new product, and I had just found what looked like a show-stopping bug. But it wasn’t a bug. In fact, it was something so odd and cool, I ended up creating 3 new [...]

Read More

Visualizing image optimizations with hex editors and strings

I’m a big fan of image optimizations, and have written several posts about it. Images dominate the web in terms of both byte size and request count. Luckily, they are super easy to optimize with free and/or open source tools. For lossless image optimization, you can expect to consistently reduce the size of your image [...]

Read More

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