1. Webový = Responzivní

2. Responzivní = reagující rychle a jednoznačně

3. Responzivní web?
Pružně reagující na své prostředí.
Například…
— zobrazující zařízení
(rozlišení obrazovky, vybavení, …)
— preference uživatele
(velikost písma, …)

4. Responzivnost je
vlastnost webu.
Odjakživa.

5. 1993
První
web
Tim Bernes-Lee
http://semanticweb.com/new-video-interview-with-sir-tim-berners-lee_b30809

6. 1993
Responzivní

7. 1996
Responzivní

8. 1996 Design webu
Typografie Barva
Dekorace Layout

9. 1996
Skoro responzivní

10. 1996
Skoro responzivní

11. 2000
Neresponzivní

12. Weby postupně přirozenou
responzivnost ztrácely.
Prací webařů přicházely o
— odolnost vůči novým zařízením
— tiskové verze
— uživatelské zvětšení písma
—…

13. 2000
První kritika:
A Dao Of
Webdesign
John Allsopp
http://www.flickr.com/photos/stephaniehobson/4692361839/

14. 2000
„Webdesignéři si
myslí, že vše musí mít
pod kontrolou. Web
není print.”
John Allsopp
http://www.flickr.com/photos/stephaniehobson/4692361839/

15. Zapomeňte na pixelperfect
body {
font-size: 11px;
}
body {
font-size: 1.2em;
}

16. 2007
Neresponzivní

17. 2007 Design webu
Typografie Barva
Dekorace Layout

18. 2007
Steve Jobs
http://pinoytutorial.com/techtorial/steve-jobs-the-movie-imminent-release-date-hinted-for-sony/

19. 2009
Mobile
First
Luke Wroblewski

21. 2010
iPad
Steve Jobs
http://thewritersguidetoepublishing.com/indies-the-brass-ring-and-steve-jobs/steve-jobs-ipad-1

23. 2010
Responzivní
webdesign
Ethan Marcotte
http://www.flickr.com/photos/drewm/5736754615/in/faves-rachelandrew/

24. Responzivní webdesign je
další pokus o návrat k
základním principům webu.
Tentokrát vynucený nástupem
mobilních zařízení.

25. Responzivní má
ale mnoho variant…

26. 2012
Responzivní

27. 2012
Responzivní

28. 2012
Responzivní

29. 2012 Design webu
Typografie Barva
Dekorace Layout

30. Díky za pozornost!
Školení + konzultace: vzhurudolu.cz/martin
Novinky: twitter.com/machal