I’ve run into a lot of varied challenges while building websites and apps over the last two decades. Every project I’ve tackled has presented unique problems, but one consistent issue has been figuring out the best way to deal with images. Every part of the image workflow is difficult; Image files are bulky, and there are lots of formats to deal with. This results in a lot of time spent processing images, and a lot of storage space required for derivatives.
imgix’s dynamic image workflow abstracts those complexities. A traditional image flow might look something like this:
A user uploads an image. For this example, let’s say it’s a profile photo.
A server running ImageMagick or a similar program creates derivative versions of the uploaded image. For something like a profile photo that’s used in many contexts throughout a site or app, the number of derivatives for each upload can be quite high. I’ve seen derivative counts in the dozens before!
The original image and generated derivatives are uploaded from the image server to a permanent storage location, e.g. Amazon S3.
With imgix, the process is inverted. Instead of generating all derivatives up front, they’re requested and generated on the fly. Each derivative can be created easily by changing the appended parameters in the image URL. This allows developers a lot of additional flexibility, letting them solve some long-standing problems in new ways.
When it comes to e-commerce, study after study has shown that compelling imagery gets more clicks, leads to longer engagement and drives more sales. Pictures sell. It's no longer up for debate.
But despite the importance the e-commerce industry puts on showcasing products with beautiful images, significantly less thought is given to how those images affect web performance. In the rush to optimize how their websites look, many e-commerce professionals ignore small tweaks that could make a big difference to how they load.
This, we think, is a mistake. The simple fact is that page load speed has a huge influence on a host of other behaviors, and image performance is one of the biggest contributors to perceived load speeds. By avoiding a few common errors, e-commerce professionals can get the most out of their imagery.
Here are the most common image mistakes we see the e-commerce industry making.
One area where we get a lot of questions is around purging images. Although purging is a familiar concept to anyone who has previously worked with Content Delivery Networks, or indeed any distributed system that needs to sync data between nodes, the concept is not the most intuitive, and every purge system functions differently. New users sometimes have an incomplete understanding of the purge process, and that can lead to confusion when the system performs differently than expected. For that reason, we thought some clarity around how image purges work in imgix would prove helpful.
One of imgix’s core values is giving our customers flexibility in their image storage. We believe you shouldn’t have to move your images onto another storage system to take advantage of our imaging infrastructure, which is why we offer multiple ways to connect to them where they already live.
Our existing Amazon S3, Web Folder, and Web Proxy solutions cover a wide swath of our customers’ needs, and we’ve now added support for the Google Cloud Storage™ service as well, a much-requested option.
The imgix team just came back from Los Angeles, where we attended and sponsored a booth at NRF’s Shop.org conference, focused on e-commerce with this year’s theme: “This Is Digital”.
In line with the theme, current and near-future technologies were the focus at the conference. It was hard to pass a session or booth without hearing about the wonders of machine learning and what it can do with your mountain of customer data, or seeing the now-cliche scene of someone in a VR headset, mouth agape, wandering a digital version of a store.
And there are really incredible things happening tech-wise that will alter the face of e-commerce and retail in general. Disney shared how they’re leveraging customer data to create custom experiences online for customers that increase engagement and hopefully drive conversions. Instead of static websites that are the same for every visitor, you might encounter one of the many iterations of the Disney website based on your browsing history, purchasing decisions, etc.
Note: New in our series of guest posts, Unsplash cofounder Luke Chesser describes how they use imgix to run their popular photography community. (Reposted from their blog with permission)
Outsourcing our image transformation and delivery was probably the most controversial and important technical decision we’ve ever made.
As many developers know, there are few 3rd-party services that you don’t quickly come to regret.
Creating the right abstraction for a service is incredibly hard because simplicity and flexibility are usually at odds with each other. What is easy to setup on day one becomes extremely difficult to control for all the use cases you need on day 365.
In the case of Unsplash, photos are kind of our thing, so finding a service that would meet all of our needs should have been challenging, if not impossible.
imgix is a lightning-quick image delivery and processing service that performs image transformations (like resizing, effects, cropping, and more) on demand via an incredibly simple URL-based API.
In the 3 plus years of Unsplash using imgix, imgix is one of the only technologies that has scaled with us through thousands of product iterations, multiple platforms, and thousands of 3rd-party API applications while remaining incredibly simple and incredibly powerful.
While imgix does a great job of explaining all of their obvious benefits like limitless transformations in realtime, single master file storage, and rock solid reliability, I want to show some real-world examples of where imgix has saved us countless engineering hours and surprised our team with world-class features above and beyond what we ever expected.
