We continue our ImageCon 2018 Speaker Series with Amy Cheng, a web developer for New York Magazine, a site with more than 11 million monthly unique visitors. We’re so pleased to have Amy join the speaker line-up on April 12 and can’t wait for her presentation, “Drawing a Circle Three Ways: Generating Graphics for the Web.” In the following post, Amy shares her thoughts on what key graphics trends are next and what’s changed most over the last few years.
Knowledge is power. And if you allow your users to upload images, you also probably want to better understand what their images contain. Whether a photo is of a building, people, animals, celebrities, or a product, image processing and analysis can assist in further comprehension. The benefits of this knowledge can go beyond "merely" categorizing your content and making your image library searchable: drawing insights from user generated content can be very useful! What better way to learn more about your users than to analyze the images they upload and find out what they care about and then have the ability to display relevant content to them according to their interests or even match them with other users that share similar interests.
Allowing your users to upload their own images to your website can increase user engagement, retention and monetization. However, allowing your users to upload any image they want to, may lead to some of your users uploading inappropriate images to your application. These images may offend other users or even cause your site to violate standards or regulations.
One of the main optimization challenges for website and mobile developers is how to display sufficiently high quality images to their visitors while minimizing the image file size. A smaller image file size can lead to faster load times, reduced bandwidth costs and an improved user experience. The problem is that reducing the file size too much may lead to a lower image quality and could harm visitor satisfaction. Delivering an optimized image with just the right balance between size and quality can be quite tricky.
I'll start by giving it to you straight:
As part of the recent "auto–everything" launch, we introduced two new transformation parameters –
w_auto, which pair the
Width Client Hints with Cloudinary’s existing image resizing and delivery infrastructure, in order to serve up simple, automatic responsive images.
One of the most important things to know about compressing image files is that a smaller file size comes at the cost of a lower image quality. How much lower, and whether low enough to make a difference visually, depends on the image. Compression can be very effective at reducing the size of the image, and besides lowering the costs of storage space and bandwidth, a reduced image size goes a long way to retaining your users’ attention with faster, smaller downloads.
The Rolling Stones claim, “You can’t always get what you want”.
And when your application needs to crop hundreds or thousands of images to specific sizes within a strictly defined UI design, that frustrating Rolling Stones phrase may be ringing in your ears.
But maybe it doesn’t have to.
Every image is unique and every one of your website visitors is different. In a perfect world, we'd like to adapt each image individually to be "just right" for every user. With "just right" being perfectly cropped, using responsive dimensions, correct encoding settings and optimal quality with the best image format.
As a developer, you want to allow your users to download multiple files in a single click. An easy way to download multiple files and share them is to generate a ZIP file. When images are involved, you may also want to normalize the original images before including them in the ZIP file, by scaling them down to the same maximum resolution or converting them to the same format.