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

The good, the bad, and the squishy

28a7165396905ffabc4d1f45609efc39?s=47 Steve Barnett
September 19, 2014
Technology
1
490

The good, the bad, and the squishy

A talk about thinking and designing squishy, covering Progressive Enhancement, Responsive Web Design, and deliverables that can help.

28a7165396905ffabc4d1f45609efc39?s=128

Steve Barnett

September 19, 2014
Tweet

More Decks by Steve Barnett

See All by Steve Barnett
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
7
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
7
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
15
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
22
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
1
74
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
54
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
88
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
57
28a7165396905ffabc4d1f45609efc39?s=48 stevebarnett
0
37

Other Decks in Technology

See All in Technology
164a161443835d8479c19d33241cab2a?s=48 smokeymonkey
0
440
96ae3b7224ad653bdcc80059fa10fd8a?s=48 kata_junn
1
110
46839cf590a549efe13547c17a6b2fde?s=48 isaoshimizu
2
180
140494d272a4d89883a94fdfdb29dea2?s=48 oracle4engineer
PRO
0
9.3k
7634917a0679d61341cb5cf40dbc7766?s=48 yokawasa
0
250
2f710cd36766586d2b6210f2a2be2b97?s=48 0918nobita
0
200
8625dbdd61cc3f8c55da6ee323b5e4ce?s=48 twingob
1
180
15d05906370266398f014184d86d17c5?s=48 cyber_unfold
0
460
110cd4dcaed019b3bd9809e541afdeb6?s=48 okuramasafumi
2
560
195f71c8183f8d27da66aa0618f293b6?s=48 task4233
16
12k
79dcb04101764d7bf66f898dd446838e?s=48 tsukubachallenge
0
230
2559c50bf24b65eaba52fd7c75260c93?s=48 olgamaciaszek
1
150

Featured

See All Featured
5ce91fa49a613cbc3e20d5f96856473f?s=48 edds
56
9.6k
B3ace07412a5178ea778e7eec161fc0a?s=48 jcasabona
10
730
61857dafbd287b3027c4dcea9008ad3c?s=48 carmenhchung
43
2k
Af6a12710770ad9a7cfd08c97efd40d3?s=48 pedronauck
654
120k
Dad095ea7038f89f760419ce475d5d14?s=48 michaelherold
227
8.9k
E4f5d494ebdc9e7cce1aecf3ce3e8bc1?s=48 shpigford
372
43k
E837d2996f52008ace055a08fbfff992?s=48 frogandcode
129
20k
24fc194843a71f10949be18d5a692682?s=48 gr2m
86
11k
2f5463832ccb768ccb4a1ca3607c27ef?s=48 jacobian
260
20k
828ace851b606e1206900f26459f55ad?s=48 speakerdeck
PRO
0
290
433acaea1012b25d97ae66da9b998dad?s=48 malarkey
122
16k
Aebc2d07a50011e2a30d38435fde564a?s=48 jrom
119
7.4k

Transcript

  1. The good, the bad, and the squishy Steve Barnett

  2. naga.co.za/squishy @maxbarners Front-end developer at Praekelt

  3. BED — FED — Des

  4. Squishy

  5. What we'll cover Progressive Enhancement Responsive Web Design Deliverables

  6. Progressive Enhancement

  7. None

  8. Progressive Enhancement

  9. None
  10. None
  11. None
  12. None

  13. HTML

  14. CSS HTML

  15. JS CSS HTML

  16. JS fails CSS HTML

  17. None

  18. Levels of Optimisation Cutting the mustard

  19. Access regardless of Device, Connection, Disability

  20. Squishy

  21. Responsive Web Design

  22. @RWD

  23. Not about resizing your browser

  24. None

  25. Mobile First

  26. * First (* = All The Things)

  27. Squishy

  28. Deliverables

  29. Mockup

  30. Style Tiles

  31. Front-end Style Guide

  32. None
  33. None

  34. Style-Guide Driven Development

  35. Squishy

  36. What we've covered Progressive Enhancement Responsive Web Design Deliverables

  37. Thanks! Questions?  Steve Barnett naga.co.za/squishy @maxbarners

  38. It depends ¯\_()_/¯

  39. 4 flickr.com/photos/brad_frost/ 7387759388 4 flickr.com/photos/p_valdivieso/ 11825680466 4 flickr.com/photos/w4nd3rl0st/ 6676987847 4

    behance.net/gallery/Cinemagraphs- Escalators/12202611 4 flickr.com/photos/psd/2731067095/ 4 flaticon.com