Sizing up responsive images: Make a plan before you Drupal
Marc Drummond
Fun fact: the web is powered by cat photos.
But hark, far too many cat photos are larger than they need to be!
How can I view as many cat photos as possible on my phone, so I can see every detail of each cute kitty, without them taking forever to download? Then, when I get home, those gorgeous cats absolutely must look fabulous on my large-screen high-resolution monitor, too.
When there’s a problem that involves cats, you can bet that Drupal is ready to help!
Drupal 8 has built-in responsive images support based off of Drupal 7’s contributed Picture and Breakpoint modules. Understanding how to use those modules without first making a plan could easily lead to a cat-tastrophe!
So we’ll start not by reviewing every detail of the responsive images specification or every option you’ll need on Drupal’s configuration screen, but instead by studying cats. We’ll look at how our cat photos fit into our site’s layout. Once we understand that, we can plan how to create multiple versions of a cat photo. Then we can provide different size options based on the browser width and resolution. Best of all, we’ll get Drupal to take care of that tedious work so we can spend more time with cats.
Don’t worry! No cats will be harmed or cloned in this process! Even though cloning cats would create a more purr-fect world.
http://2015.tcdrupal.org/session/sizing-responsive-images-make-plan-you-drupal
Fun fact: the web is powered by cat photos.
But hark, far too many cat photos are larger than they need to be!
How can I view as many cat photos as possible on my phone, so I can see every detail of each cute kitty, without them taking forever to download? Then, when I get home, those gorgeous cats absolutely must look fabulous on my large-screen high-resolution monitor, too.
When there’s a problem that involves cats, you can bet that Drupal is ready to help!
Drupal 8 has built-in responsive images support based off of Drupal 7’s contributed Picture and Breakpoint modules. Understanding how to use those modules without first making a plan could easily lead to a cat-tastrophe!
So we’ll start not by reviewing every detail of the responsive images specification or every option you’ll need on Drupal’s configuration screen, but instead by studying cats. We’ll look at how our cat photos fit into our site’s layout. Once we understand that, we can plan how to create multiple versions of a cat photo. Then we can provide different size options based on the browser width and resolution. Best of all, we’ll get Drupal to take care of that tedious work so we can spend more time with cats.
Don’t worry! No cats will be harmed or cloned in this process! Even though cloning cats would create a more purr-fect world.
http://2015.tcdrupal.org/session/sizing-responsive-images-make-plan-you-drupal