Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Design for loading

June 20, 2014

Design for loading

Presentation by @htmlboy and at WebVisions Barcelona, on June 2014.


June 20, 2014

More Decks by Swwweet

Other Decks in Design


  1. The average webpage was 
 1.46MB in June 2013. 

    Mostly images. Source: httparchive.org
  2. The average webpage in 
 June 2014 is 1.78MB. 

    Mostly images. Source: httparchive.org
  3. 74% of mobile users won’t wait
 longer than 5 seconds

 for a page to load. Source: bit.ly/5secondsmobile
  4. “1. Optimize an existing feature or asset.
 2. Remove an

    existing feature or asset.
 3. Don’t add the new feature or asset.” – Steve Souders –
  5. How much time does a van 
 need to hit

    the water when 
 falling from a bridge?
  6. “We don't have any 
 non-JavaScript users…
 No, all your

    users are non-JS 
 while they're downloading your JS.” – Jake Archibald –
  7. <div class=container> <header> <!- -Logo and headings- -> </header> <nav>

    <!- -Navigation links- -> </nav> <section class=content> <!- -Err… content- -> </section> </div>
  8. Consider a lazy load on the 
 first visit, and

    display only 
 cached webfonts.