Selected Session

Responsive Images under control

Speaker(s)
Cristina Chumillas (ckrina)
Level of expertise
Beginner
Session Type
Regular (45 min)
Track(s)
Site Building
Frontend & Design
Day
Friday
Time Slot
-
Room
Parsenn

Optimizing images can drastically decrease the page load time because on average 60% of a website’s page weight is made up of them. The number and diversity of devices accessing the web continue to grow so Responsive Web Design has changed how the web is built. And that includes images too, because the aim is to deliver the highest quality image supported and nothing more. So today we have new standard elements and attributes to work with images widely supported by browsers (and polyfills for the rest) and Drupal has incorporated them.

In Drupal 8 the Responsive Image module is in core and is prepared to solve a wide range of needs. And, as usually happens in Drupal, there are several contributed modules that help us to improve the basic needs or to solve the special ones.

I’ll start this session with a quick introduction about the different existing solutions for responsive images to be sure we are all in the same page. I’ll explain the difference between viewport sizing and art direction and how we are supposed to work with Drupal for each one, including demos. I’ll share some tips and contrib modules that can make the developer or the final user live easier. I’ll also explain how lazy loading works and what solutions do we have in Drupal.

When you leave this session you’ll have an idea about the options offered for Drupal and enough knowledge to choose the correct one for your project.