Using srcset for responsive images Google Developers English English (auto-generated)

Using srcset for responsive imagesYouTube↗ IA↗(long shot)
Science & Technology 21K views 136 likes 10 dislikes 25 Sep 2014

Google for Developers 2.7M subscribers United States YouTube↗

Click to Play Video

Are you serving the right image to your user's device?

are you serving the right image to your users device with the source set

With the srcset attribute, you can specify a different image

attribute you can specify a different

file for 1x and 2x displays.

image file for 1x and 2x displays the

The srcset attribute takes a comma separated list

source set attribute takes a

of image declarations, which consists

comma-separated list of image declarations which consists of a URL

of a URL string followed by an image resolution-- for example,

string followed by an image resolution

for example 1x or 2x the image

The image resolution information is also

resolution information is also used to

used to scale the image so that it always

scale the image so that it always

appears at the right size.

appears at the right size when you use

When you use srcset, don't forget

source set don't forget to specify a

to specify a fallback image with the src attribute

fallback image with the source attribute

so that older browsers always get an image.

so that older browsers always get an

Start using srcset today.

image start using source set today

Similar videos:

The picture element for art direction
Google for Developers
14.6K views 141 likes 2 dislikes 25 Sep 2014100% match

Building sites for the multi-device web
Google for Developers
35.7K views 138 likes 4 dislikes 25 Jun 201460% match

DevBytes: Web Components - HTML Imports
Google for Developers
21.2K views 152 likes 9 dislikes 17 Dec 201457% match

Polymer: Creating responsive UIs
Google for Developers
42.9K views 323 likes 14 dislikes 25 Jun 201432% match

The Setup: Creating new apps using Google APIs
Google for Developers
123.3K views 796 likes 30 dislikes 13 Nov 201431% match

The ServiceWorker: The network layer is yours to own
Google for Developers
67.4K views 1.5K likes 18 dislikes 25 Jun 201430% match

Polymer: Interacting with Google Services using nothing but HTML
Google for Developers
64K views 665 likes 7 dislikes 17 Jun 201430% match

DesignBytes: Material Design in the Google I/O App
Google for Developers
139.8K views 1.2K likes 21 dislikes 05 Aug 201430% match

Easy Maps Apps in Java and Python
Google for Developers
30.5K views 238 likes 8 dislikes 07 Jan 201529% match

Silky smooth Web Animations
Google for Developers
36.7K views 450 likes 6 dislikes 18 Jun 201429% match

Listing your files in Google Drive
Google for Developers
40.2K views 125 likes 20 dislikes 13 Nov 201429% match

Android Performance Patterns: Why 60fps?
Google for Developers
52.5K views 562 likes 22 dislikes 06 Jan 201527% match

Android Work
Google for Developers
38.5K views 141 likes 6 dislikes 25 Jun 201427% match

Introduction to Android Studio
Google for Developers
133.7K views 1K likes 16 dislikes 23 Feb 201527% match

An Introduction to Android Wear
Google for Developers
251.3K views 1.3K likes 86 dislikes 18 Jun 201426% match

DevBytes: Chrome DevTools Device Mode
Google for Developers
73.4K views 340 likes 26 dislikes 10 Oct 201426% match

Accessing Google APIs: Common code walkthrough
Google for Developers
45.9K views 188 likes 14 dislikes 13 Nov 201426% match

Google Cast: Introduction to the SDK
Google for Developers
47K views 141 likes 7 dislikes 10 Dec 201426% match

Using the Android Job Scheduler
Google for Developers
43.1K views 300 likes 57 dislikes 25 Jun 201426% match

DevBytes: Android L Developer Preview
Google for Developers
46.3K views 801 likes 13 dislikes 18 Jul 201426% match

Google Developers Channel - Trailer
Google for Developers
181.5K views 116 likes 21 dislikes 03 Sep 201526% match

DevBytes - Your App, At Scale with Google App Engine
Google for Developers
103.5K views 237 likes 4 dislikes 24 Mar 201426% match

An Introduction to Brillo, the OS for IoT
Google for Developers
64.4K views 215 likes 4 dislikes 27 Oct 201525% match

AdWords API DevBytes Episode 1: Why Use the AdWords API?
Google for Developers
61K views 138 likes 10 dislikes 22 Sep 201525% match

DevBytes: Intro to Google Maps Data Layer
Google for Developers
81.1K views 179 likes 7 dislikes 18 Mar 201425% match

Android Performance Patterns: Rendering Performance 101
Google for Developers
65.2K views 490 likes 6 dislikes 06 Jan 201525% match

Getting Your PageSpeed Score Up
Google for Developers
95.2K views 1K likes 30 dislikes 25 Jun 201425% match

Getting started with Firebase and Android - Firecasts #1
Google for Developers
113.8K views 1.1K likes 19 dislikes 16 Feb 201624% match

The new Gmail API
Google for Developers
119.7K views 434 likes 11 dislikes 25 Jun 201424% match

DesignBytes: Paper and Ink: The Materials that Matter
Google for Developers
67.2K views 644 likes 16 dislikes 12 Sep 201424% match

Settings Privacy About Contact Donate