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

Designing for Everyone

Paul Robert Lloyd
November 10, 2012

Designing for Everyone

With the help of Doctor Who and the Avengers, discover how we can embrace the unpredictable nature of the web.

Paul Robert Lloyd

November 10, 2012

More Decks by Paul Robert Lloyd

Other Decks in Design


  1. “ scientificamerican.com/article.cfm?id=long-live-the-web The web’s primary design principle is universality… it

    should be accessible from any kind of hardware that can connect to the Internet: stationary or mobile, small screen or large. Long Live the Web: A Call for Continued Open Standards and Neutrality — Tim Berners-Lee
  2. 5 July 2012 @marcoarment If you’re a web designer, you

    really, really need to get a Retina MacBook Pro so you can see how bad your site looks on it and fix it. twitter.com/marcoarment/status/220968507117015040
  3. 6 July 2012 @anna_debenham If you’re a web designer, you

    really, really need to get a cheap Dell monitor so you can see how bad your site looks on it and fix it. twitter.com/anna_debenham/status/221277339517067265
  4. Our front page makes 7 requests in total, at approximately

    21kb. Everyone gets this initial payload… “ Cutting the mustard blog.responsivenews.co.uk/post/18948466399/cutting-the-mustard
  5. …a block of JavaScript checks the capabilities of the browser

    before deciding whether to kick start the enhanced experience. “ Cutting the mustard blog.responsivenews.co.uk/post/18948466399/cutting-the-mustard
  6. <picture width="500" height="500"> <source media="(min-width: 45em)" src="large.jpg"> <source media="(min-width: 18em)"

    src="med.jpg"> <source src="small.jpg"> <img src="small.jpg" alt=""> <p>Accessible text</p> </picture> The picture element: An HTML extension for adaptive images picture.responsiveimages.org
  7. •Issue exists at the file format/browser level •Art direction concerns

    style, not content •Image size is relative to container, not display •Symptom of print-inspired design Picture problems:
  8. “ jasonsantamaria.com/articles/baseline-grids-on-the-web Baselines grids can be too rigid for the

    inherently flexible nature of the web. Just because something works at one size doesn’t mean the same ratio will be appropriate at larger or smaller sizes. Baseline Grids on the Web — Jason Santa Maria
  9. “ speakerdeck.com/espylaub/pagination-on-the-internet-and-why-its-weird The meaning of page numbers changes over time.

    Which defies the whole point of a URL. Pagination on the Internet and why it’s weird — Alex Feyerke