Responsive images - Progressive Web App Training

Responsive images - Progressive Web App Training

Channel:
Chrome for Developers
Subscribers:
791,000
Published on ● Video Link: https://www.youtube.com/watch?v=6U97U4EfUuk


Duration: 7:51
6,048 views
182

Images give the web life and colour.

But on average, images consume by far the most bytes on most web pages.

This video provides a simple overview of how to efficiently deliver beautiful images to different devices and display sizes.

Full playlist:
https://www.youtube.com/playlist?list=PLNYkxOF6rcIB2xHBZ7opgc2Mv009X87Hh



Other Videos By Chrome for Developers


2019-09-03Chrome 77 - What’s New in DevTools
2019-08-27Push Notifications - HTTP 203
2019-08-14Is postMessage slow? - HTTP 203
2019-08-09Load your page faster: remove unused code
2019-08-07BigQuery Demo - The State of the Web
2019-08-01Scope in JavaScript - HTTP 203
2019-07-30New in Chrome 76: Better install experiences for PWAs, dark mode, and more!
2019-07-25Reduce image size: use the correct format — PNG or JPEG
2019-07-15Implementing the Web Payments API - Progressive Web App Training
2019-07-15Responsive design - Progressive Web App Training
2019-07-15Responsive images - Progressive Web App Training
2019-07-15IndexedDB - Progressive Web App Training
2019-07-14Chrome 76 - What’s New in DevTools
2019-07-12Reduce image size: optimize image compression
2019-07-03BigQuery - The State of the Web
2019-06-27Reduce image size: use media queries for background images
2019-06-25Handling updates offline-first - HTTP 203
2019-06-20Faster Web Navigation with Predictive Prefetching
2019-06-19Web as a building block for emerging technologies
2019-06-18Web Components: The Secret Ingredient Helping Power The Web
2019-06-17Easier payments for Progressive Web Apps - Progressive Web App Training


Tags:
Chrome
Developers
Google
Google Developers
Progressive Web Apps
PWA
web platform
web
web applications
web apps
progressive web applications
mobile web
mobile web applications
web development
course
responsive design
responsive images
srcset
sizes attribute
picture tag
CSS Grid
CSS Flex
flexbox