This is the presentation originally presented by Chris Morrow, Senior UI Developer / Creative Director, at the DevNexus 2015 conference. The presentation includes UI dev tools; Yeoman, Grunt, and Bower. Foundation 5 is then presented along with resource links and testing tools for responsive web design.

1. Responsive Web Design
using ZURB Foundation 5
byChrisMorrow

2. hat is R s onsi b sign
R s onsi sign ros and Cons
Fra wor s
own oad tu o Foundation
U oo s
Using Foundation 5

3. W
R W D
R is r ating a w bsit that dyna i a y hang s a a
r s onds to a i w ort si s d i ori ntations and
d i r so utions
than Mar ott thr t n ts o R ar a uid grid
ib dia and dia u ri s

4. R
R s onsi s da ti sMobi s

5. D
i uida si o htt www i uida si o

6. R
os
n it to aintain
Fri nd y
ow rCosttoBui dandMaintain
ons
Mor Co Cod
Bad r or an
Bad r o an a s orth ost art

7. s R s
h ri
R R ar h ri
F Front h ri

8. D R
da ti b sign
da ti b i ry
R R s onsi b sign
ituationa b sign
F ns rt w roa h r

9. RWD

10. RWD Causes Poor Performance
" Because the images on a responsive site are just
visually scaled down and not re-sized, smartphones and
tablets can notice a lag in loading speeds, especially
when being used on a mobile network "

11. h n o ar d to aintaining a s rat obi
sit r s onsi sit s an b ua or ow r in ost
"Responsive Design is pensive"

12. d au t Bootstra sty s
" ll responsive websites
look the same"

13. " nyone who embraces
Responsive Web Design is stupid"

15. R
" riends don t let friends design in p "

16. R W R R R
o o oose e o
ow any ha us d a ra wor or ibrary
ry it or yours a an in or d d ision with
irsthand now dg
Und rstand how it wor s not ust what it do s
a it a art br a it th n i it tog th r in your
way

17. R W R W W

18. D

19. htt y o anio htt y o anio

20. Grunt run o a s r r
Grunt auto ation
Grunt i r oad
Yeoman start r ro ts
Bower d nd n y anag nt

21. R W R
hi h on to hoos
Foundation s Bootstra s ton s M s u by
s ur C s ub s Co u na s oast s rid s
rid yst s ridi u o us
Choos what you i b st
n y us what you n d

23. RWD D
ow to tu ZF5
h rid
R s onsi ag s M dia
M dia u ri s
B o rid
Custo i ing ttings

24. W
htt oundation urb o d o down oad ht
own oad C
Manua C own oad
Us as Runn r RU U

25. R D
Rows and Co u ns
C nt ring
sting
rd ring
Custo i ing th rid

26. R D
ag s
i tur Fi
id o
o nt r hang

27. D D R
width bas ont si M
s a
diu
arg 5
arg
arg

28. D
Und rstanding th tu
ttings
Co on nts
Ma t our wn

29. R
Chro i u ation in d too s
Fir o R s onsi i w
i i u ator Ma on y
dob dg ns t
htt s r ati adob o rodu ts ins t
host ab a on y htt ana o o ghost ab
Brows r ta htt www brows rsta o

30. R R
oo s
od htt s nod s org
o an htt y o an io
runt htt grunt s o
Bow r htt bow r io
b Re e
Foundation htt oundation urb o
it h n in htt oundation urb o do s o on nts it h n sin ht
Bui dingB o s od sa s htt urb o bui ding b o s

31. R