Chapter 6. The Surprisingly Complex World of Images on the Web
The world today doesn’t make sense, so why should I paint pictures that do?
— Pablo Picasso
More than 20 years after Mark Andreesen first proposed the
img element, the image remains the most direct route from the designer’s imagination to the user’s screen. Sure, with CSS we have many powerful tools to execute designs, but nothing in our arsenal can compare to the power of art, illustration, and photography in regards to telling a story on the Web. The Web is just a new front for the display of the power of the image. The power of painting and visual art can be seen in the throngs of people that visit the great museums of the world on any given day (Figure 6-1) and the Web taps into the same power.
With this innate power, the continued growth of the size of desktop displays, the increasing quality of displays across form factors, and a design trend toward large, evocative images have all conspired to push the image formats and markup tools we have now to their breaking point.
Add in the vagaries of mobile bandwidth, and all of a sudden, the landscape for images on the Web is more complicated than it’s ever been. It’s still the best way to tell a story, but trying to thread the needle between the best possible performance (serving the smallest possible image over the fastest connection) while also pleasing the owners of high-density displays (which require much larger image sizes) has been an ongoing issue for several years. ...