At imgix, we believe that delivering high-quality, optimized images should be as easy as possible. That’s why we work hard to provide useful developer-oriented tools on top of our image processing APIs. Today, we’re excited to announce the latest addition to our suite of SDKs: vue-imgix. This library makes it far easier for Vue developers to quickly get up and running with imgix, and to access some important new image optimizations.

Read the rest ➤

Responsive images are a critical component of the modern website, but they can also be time-consuming for frontend developers to deploy and manage. Historically developers have had to create multiple sizes of each image to account for different device resolutions. Fortunately, the srcset attribute alleviates that need by directing the browser to identify the best image size based on available options.

The srcset attribute is one of the best tools for optimizing a site’s images—and by extension, its performance. In this post, we’ll discuss how imgix simplifies use of the srcset attribute and walk you through our latest srcset capability: automatic generation for all of our Core Libraries.

Read the rest ➤

Using image transparency on your website provides cleaner integration between images and the background color or style of your website. Assets like logos, icons, and custom-made graphics benefit most from having a transparent background, because they can be positioned almost anywhere on the webpage without disrupting the design. However, one downside to image transparency is the exact reason it’s also a valuable technique: it’s not always easy to tell when an image has transparency applied.

In this article we discuss how to easily showcase image transparency using our new transparency parameter.

Read the rest ➤

Introduction

At imgix, we believe that the data surrounding your images is almost as important as the images themselves, which is why we’re working hard to provide more useful data within the Analytics Dashboard. Today we’re announcing new Analytics functionality for our premium customers as well as some major improvements to the functionality of the Analytics Dashboard overall.

Audience Analytics for Premium Customers

For many customers there are significant business insights within the data that their images generate. Audience Analytics is designed to help those customers understand not only what types of devices and browsers are being used to view their images, but also to understand where the traffic to their images is coming from. The initial dimensions that Audience Analytics breaks down traffic along include:

• Device: PC, smart phone, crawler, etc.
• Operating system: Mac OS X, Windows, etc.
• Browser: Chrome, Safari, Firefox, etc.
• Referrer: The top-level domain of the referrers

Read the rest ➤

Introduction

This article is about a solution we found using imgix to dynamically update the color of any product in an HTML<img> element without using SVGs or any CSS.

CarTrawler is a B2B travel technology company based in Dublin, Ireland. We specialize in car rentals and ground transportation services and help bring car rental solutions to nearly one billion passengers annually.

Recently we undertook a project to overhaul the car images library that we use to display car rental search results. We wanted to have consistent, high-resolution images that we could resize and optimize on the fly to deliver the best results for our customers over multiple different touch points.

CarTrawler technology allows our partners to display car rentals from up to 2,000 separate car rental providers. We deliver hundreds of vehicles within seconds to any device to give our customers the best and broadest choice of car rentals possible.

Read the rest ➤

DatoCMS is an API-first headless CMS, which means that all of the CMS functionality we offer is programmable through our API. As with any CMS, images are a big part of the content that we handle for our users. While images are a spectacular way of improving conversions, enhancing the user experience, and engaging visitors, they also pose a real engineering and design challenge.

As new devices boast retina displays and higher resolutions, designers are eager to leverage these resolutions to provide beautiful vibrant graphics. But, that comes at a cost: asset size and potentially site performance. To get a sense of the growth, average page weight has increased by 34-55% in the last 3 years, of which 70% is due to heavier images. If you’re on a fiber connection, downloading 1.7MB of data for a single web page might not slow you down much, and it gives you a richer experience. But if you’re on a cellular connection, you would probably prefer a lower quality image to a painfully slow page.

Read the rest ➤