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

The Power Of Simplicity

The Power Of Simplicity

We're working on increasingly complex websites. There's a temptation to match this growth with increasingly complex solutions. But there's a real value in keeping things simple ... or at least starting things simple. If you can build a solid robust foundation, there's a good chance that your work will be future-friendly.


Jeremy Keith

October 25, 2013

More Decks by Jeremy Keith

Other Decks in Technology


  1. None
  2. None
  3. None
  4. None
  5. the power simplicity of

  6. tools power

  7. git sass less grunt yeoman

  8. jQuery boilerplate modernizr bootstrap

  9. Stop soling problems you don’t yet have. —Rachel Andrew

  10. Polyfills are a tax. —Alex Russell

  11. the web “platform”

  12. web flash native

  13. It’s hard not to be disappointed by HTML if you’ve

    developed for iOS, Windows, or other mature platforms as I have. —Joe Hewitt What the web is and is not
  14. scroll tap swipe drag

  15. find buy publish share

  16. e control which designers know in the print medium, and

    oen desire in the web medium, is simply a function of the limitation of the printed page. We should embrace the fact that the web doesn’t have the same constraints, and design for this flexibility. —John Allsopp A Dao of Web Design
  17. web android iOS

  18. CSS JavaScript HTML web

  19. My loe for responsive centers around the idea that my

    website will meet you wherever you are—om mobile to full-blown desktop and anywhere in between. —Trent Walton
  20. None
  21. None
  22. None
  23. None
  24. None
  25. e web is responsive on its own—by default. It’s us

    that’s been breaking it all these years by placing content in fixed-width containers. —Andy Hume
  26. CSS JavaScript HTML

  27. HTML

  28. input type="number" input type="search" input type="email" input type="url"

  29. input type="number"

  30. input type="number" inputmode="numeric"

  31. input type="number" pattern="[0-9]"

  32. CSS JavaScript HTML

  33. CSS

  34. selector { property: value; }

  35. CSS JavaScript HTML

  36. JavaScript

  37. None
  38. None
  39. None
  40. None
  41. None
  42. Every user is a non-Javascript user while a page is

    loading. —Scott Jehl
  43. <a href="javascript:void(0)"> Download Chrome </a>

  44. Progressive enhancement is more about dealing with technology failing than

    technology not being supported. —Andy Hume
  45. <a href="javascript:..."> <a href="#" onclick="...">

  46. <a href="javascript:void(0)"> <span class="li_icon"></span> </a>

  47. <span class="link"> Create a new list </span>

  48. None
  49. be conservative in what you send; be liberal in what

    you accept.
  50. ember angular backbone

  51. “web app”

  52. None
  53. CSS JavaScript HTML

  54. progressive enhancement

  55. do websites need to look exactly the same in every

  56. do websites need to look exactly the same in every

    browser . com
  57. None
  58. None
  59. ere is a difference between support and optimization. —Brad Frost

  60. the power simplicity of

  61. a pattern simplicity of

  62. None
  63. None
  64. cutting the mustard if (document.querySelector && window.addEventListener) { // enhance!

  65. aggressive enhancement

  66. futurefriend.ly