Bruce Hyslop

Implementing Responsive Images

Date: This event took place live on February 25 2015

Presented by: Bruce Hyslop

Duration: Approximately 60 minutes.

Cost: Free

Questions? Please send email to


The key missing ingredient in responsive web design has been a native way for browsers to deliver images tailored to a user's device. Consequently, sites often have delivered large images to all browsers, making pages load slowly (on mobile devices especially) and eating into mobile user's data plan quotas. It has limited artistic control of our sites across devices as well.

Years in the making, a solution is upon us now in the form of HTML's new srcset and sizes attributes and picture element. During this webcast, you'll learn:

  • When and how to use each of these new features
  • The status of their browser support
  • Options for browsers that don't support them

About Bruce Hyslop

Bruce Hyslop began developing for the Web in 1997 and focuses on front-end technical architecture, development, usability, accessibility, and advocating best practices. He is an independent developer and consultant to agencies, start-ups, and other companies.

Bruce is the lead author of HTML and CSS: Visual QuickStart Guide, Eighth Edition and HTML5 and CSS3: Visual QuickStart Guide, Seventh Edition, and the sole author of The HTML Pocket Guide, all for Peachpit Press. He also has taught front-end courses at UCLA (undergrad) and UCLA Extension, and occasionally speaks on matters regarding front-end development.

Prior to going independent, he spent a decade working for digital agencies. He was the senior director of the Interface Engineering Group (IEG) at Schematic (now POSSIBLE), where he oversaw company-wide efforts to define and implement best practices regarding HTML, CSS, JavaScript, and accessibility. Additionally, he oversaw front-end teams or was a developer for more than 150 projects, including those for ABC, BBC, Disney, Logitech, Microsoft, NBC Universal, Nokia, Target, Toyota, and Yahoo!, among others.