You are here

Front-End Techniques for Performance and RWD

Speaker(s): 
Description: 

Responsive web design (RWD) is now a necessity, A growing number of users access our sites on smaller screens and on limited connections. Performance has become absolutely critical because the speed at which you can deliver your content is statistically tied to conversion and even SEO.

This session will go through some of the modules and techniques I have used to keep sites looking great while loading fast on nearly any device. We will walk through their setup and implementation on sites actually live in the wild.

  • D7 Picture Module: This backport of upcoming D8 functionality beautifully handles serving different images based on device and capabilities using the new picture standard that will become a part of HTML5.
  • SVGs and SVG Embed Module: Reliably inline lean and retina friendly graphics into your editable content html.
  • Icon API + Fontello: Only need to use 4 icons from a bloated icon font? Not a problem! Selectively load only the icons you want. You can even include your own custom vector icons as well.

Additionally as time allows there are some additional topics I can hit on if requested by those attending this session:

  • Image optimization techniques
  • LESS CSS strategies to prevent CSS bloat
  • Taming extra markup in views
  • Handling browser/platform differences with Conditionizr
  • Anything related to front-end on the sites shown during this session :)

 

Presentation Recording: https://connect.asu.edu/p9og0760xxy/

Stay Connected Post Camp!