I just had my responsive images epiphany and I’m writing it all down before I forget everything. This is what I know…
This wraps up things. By the time reading this (and re-read some previous articles), finally can understand a little bit about this Responsive Images thing.
Source: The anatomy of responsive images – JakeArchibald.com
Use responsive images now! Chen Hui Jing introduces us to the new selection types and shows us how we can make them work for us.
Another reference from A List Apart. This one explains
sizes better. Especially about the
'w' descriptor (and other descriptor such as
'x') used in
Source: Using Responsive Images (Now) · An A List Apart Article
When we design responsively, our content elegantly and efficiently flows into any device. All of our content, that is, except images. For years, we’ve catered to users with the highest-resolution screens by sending giant images to everyone. No longer. Eric Portis takes us through the new picture element and other attributes to let us mark up multiple, alternate sources. Find out how to use responsive images now: send the best image for each context, cut down on page weight, and speed up performance.
The article that referenced by most when it comes about Responsive Images. It’s probably a complete reference. But WordPress not use all of the features. Especially
Can’t get thorough explanation about
sizes (which the ones used in WordPress), so need another ones.
Source: Responsive Images in Practice · An A List Apart Article
Microsoft’s Saurabh Kirtani explains how to build responsive images on the web with srcset
A better understanding of
srcset. But still not really understand about
sizes. Go to next article.
Source: How to Build Responsive Images with srcset