Appendix B. Implementing Responsive Images
If our workflow is to be truly mobile friendly, we need a good responsive image technique. In this exercise, we'll implement one of the current leading techniques to improve both the performance and the design of the portfolio carousel implemented in Chapter 2, Bootstrappin' Your Portfolio.
Considering our portfolio carousel
If you recall from Chapter 2, Bootstrappin' Your Portfolio, the carousel images are crafted to fill a full-width layout. The images are 1,600 pixels wide and weigh in between 135 to 189 KB. To send these same images to phones and small non-retina tablets is overkill. In an age of mobile-first responsive design, it's irresponsible.
Furthermore, if you stop and look at the design on a ...
Get Bootstrap Site Blueprints now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
