Download - Neohýbejte svůj web na mobil, začněte znovu
![Page 1: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/1.jpg)
By @soundake
Dayilweb SK, 14. 11. 2012
Neohýbejte svůj web na mobil,začněte znovu
![Page 2: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/2.jpg)
http://www.sxc.hu/photo/1394368
Dnes bych vám chtěl říct o tom, proč se věnovat návrhu pro mobilní zařízení, proč začít od začátku a jaké benefity to bude mít pro vás a pro váš byznys.
![Page 3: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/3.jpg)
Chtěl bych, abyste si z dnešního večera odnesli tři věci:
![Page 4: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/4.jpg)
http://www.sxc.hu/photo/1368746http://www.sxc.hu/photo/1368747
S mobilní verzí začněte znovu, od začátku.
![Page 5: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/5.jpg)
“You are great lover!”
Návrh pro mobilní zařízení dokáže zlepšit uživatelskou zkušenost i na velkém webu.
![Page 6: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/6.jpg)
http://www.flickr.com/photos/94588149@N00/4758676577/
Návrh pro mobilní zařízení vám dokáže ušetřit či dokonce vydělat i nějaké peníze.
![Page 7: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/7.jpg)
Předpokládám, že nemá cenu se ptát, zda tu někdo z vás má webovou stránku. Ale kolik z vás jí má přizpůsobenou mobilním zařízením?
![Page 8: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/8.jpg)
Já začnu lehkou statistikou.
![Page 9: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/9.jpg)
1 038 000 000chytrých telefonů
http://www.comscore.com/Insights/Press_Releases/2012/11/comScore_Reports_September_2012_U.S._Mobile_Subscriber_Market_Share
Pět let po uvedení iPhonu a Androidu je na celém světě již přes 1 miliardu (1,038) chytrých telefonů, což je oproti loňskému roku nárůst o 46 procent.
![Page 10: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/10.jpg)
http://www.asymco.com/2012/11/05/the-late-smartphone-adopter-paradox/
0 %
25 %
50 %
75 %
100 %
Prosinec 09 Červen 20120 Únor 2011 Říjen 2011 Říjen 2012
Non-Smartphone Users
Smartphone Users
US Smartphone Penetration
Jen v US již počet používaných smartphonů překročil 50 % hranici na společném trhu všech mobilních telefonů.
![Page 11: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/11.jpg)
Jen pro porovnání.
![Page 12: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/12.jpg)
371 tisícNa světě se každý den narodí 371 tisíc dětí.
![Page 13: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/13.jpg)
300 tisíc 700 tisíc371 tisícBěhem toho se aktivuje 300 tisíc iOS zařízení
![Page 14: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/14.jpg)
300 tisíc 1,5 milionua 1,5 milionu zařízení s Androidem.
![Page 15: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/15.jpg)
2 000 000prodáno každý den
https://www.idc.com/getdoc.jsp?containerId=prUS23771812
Dohromady včetně Windows Phone, Symbianem a Blackberry to dělá 2 miliony zařízeních prodaných každý den.
![Page 16: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/16.jpg)
22 %Velká
Británie
A ještě jedna věc. Možná trochu šokující. Ve Velké Británii 22% uživatelů internetu nikdy nepoužilo běžný počítač. V US je to kolem 40 %. V asii a v africe dokonce 50% a více.
![Page 17: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/17.jpg)
22 %Velká
Británie
40 %USA
A ještě jedna věc. Možná trochu šokující. Ve Velké Británii 22% uživatelů internetu nikdy nepoužilo běžný počítač. V US je to kolem 40 %. V asii a v africe dokonce 50% a více.
![Page 18: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/18.jpg)
22 %Velká
Británie
40 %< 50 %USAAfrika
Asie
A ještě jedna věc. Možná trochu šokující. Ve Velké Británii 22% uživatelů internetu nikdy nepoužilo běžný počítač. V US je to kolem 40 %. V asii a v africe dokonce 50% a více.
![Page 19: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/19.jpg)
Pojďme na to. Máte web. Každý z vás má jistě nějakou webovou stránku. Za těch několik let co jí máte pěkně narostla.
![Page 20: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/20.jpg)
Máte web. Každý z vás má jistě nějakou webovou stránku. Za těch několik let co jí máte pěkně narostla.
![Page 21: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/21.jpg)
A teď jste se ode mě dozvěděli, že spousta uživatelů si jí nejspíš bude chtít prohlížet na nějakém tabletu či nedejbože chytrém telefonu. Co teď s tím?
![Page 22: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/22.jpg)
Zaprvé. Necháte svůj web tak jak je, neboť ty telefony si to nějak přeberou.
![Page 23: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/23.jpg)
Příkladem budiž sme.sk, kde zatím zřejmě mobilní verzi považují za zbytečnou a mobily zdá se ignorují úplně.
![Page 24: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/24.jpg)
Druhým příkladem může být například apple.com, kde sice také nemají nějakou variantu pro chytré telefony, ale na druhou stranu celý jejich web je přizpůsoben tak, aby se i na malých obrazovkách dobře používal.
![Page 25: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/25.jpg)
http://www.sxc.hu/photo/513359
Druhá varianta. Uděláte speciální mobilní verzi, kde necháte veškerý obsah, jen to trochu namačkáte, aby se to vešlo.
![Page 26: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/26.jpg)
Zase jeden příklad ze slovenska - zoznam.sk, kde mají speciální mobilní šablonu, která de facto obsahuje vše co velký web.
![Page 27: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/27.jpg)
Ze zahraničí ukážu web Národního divadla v Praze, kde jsme použili tzv. responsivní design.
![Page 28: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/28.jpg)
![Page 29: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/29.jpg)
![Page 30: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/30.jpg)
![Page 31: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/31.jpg)
A pak je tu třetí varianta. Ta trochu těžší. Zkusíte se zamyslet a uděláte svůj mobilní web zgruntu znovu.
Zkusme si říct, proč bychom to měli dělat znovu. Důvodů je samozřejmě více, ale povězme si o dvou:
![Page 32: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/32.jpg)
http://www.flickr.com/photos/8269775@N05/4341633116/
Prostor.
![Page 33: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/33.jpg)
15”13”
551 cm² 693 cm²
Nejprodávanější monitory dneska jsou monitory o úhlopříčce 13 a 15 palců. Je to prostě proto, že notebooků už se dnes prodává více než desktopů. Displej na mém 13palcovém MacBooku má plochu zhruba 600cm2.
![Page 34: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/34.jpg)
3,5” 47 cm²
Ovšem můj iPhone má plochu displeje pouze 47 cm2.
![Page 35: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/35.jpg)
7 %To je pouhých 7% plochy obrazovky.
![Page 36: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/36.jpg)
Na smartfounu tedy budete řešit jednoduchý problém - moc věcí a málo prostoru.
![Page 37: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/37.jpg)
Flickr znáte? Služba pro sdílení fotek.
![Page 38: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/38.jpg)
Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
![Page 39: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/39.jpg)
Mají tam těch položek 5.
![Page 40: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/40.jpg)
Malý prostor je úžasné omezení pro každého designera, protože malý prostor vás donutí zjednodušovat, donutí vás skutečně zapřemýšlet nad tím co prioritu má a co prioritu nemá. Sednout si, přemýšlet, škrtat, zjednodušovat.
![Page 41: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/41.jpg)
http://www.flickr.com/photos/19743256@N00/2224073271/
Zaměřit se na problém!
![Page 42: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/42.jpg)
Antoine de Saint-Exupery
Antoine de Saint-Exupery řekl jednu geniální větu: "Dokonalosti je dosaženo, nikoliv když již nelze nic víc přidat, ale když není již možné nic odebrat."
![Page 43: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/43.jpg)
Vydělává peníze
Podívejme se na to z pohledu byznysu. Vy se díky tomu, že se při návrhu soustředíte na to podstatné, soustředíte tedy na to co, vám vlastně vydělává peníze. Ta služba, kterou nabízíte, produkt, který prodáváte, to je to co lidí vlastně u vás chtějí. A můžete v klidu zapomenout na balast kolem. Nevyhazujte peníze za něco, co nikdo moc neocení.
![Page 44: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/44.jpg)
Zkusme zajít ještě o kousíček dál. Na velký desktopový web.
![Page 45: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/45.jpg)
Statefarm je americká pojišťovna.
![Page 46: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/46.jpg)
Ještě v loňském roce vypadal jejich web nějak takto. Velký banner s bílým nečitelným textem, usměvavý pán, hromada divných obdélníků, v menu mraky věcí.
![Page 47: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/47.jpg)
Menu
Box 1 Box 2 Box 3
Promo
Tab 1
Tab 2
Tab 3
Tab 4
Tab 5
V SYMBIU toto šablonu nazýváme jako promo a tři boxy.
![Page 48: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/48.jpg)
Pak udělali mobilní verzi. Na prvním místě - založení pojištění. Jádro jejich bysnysu. V druhém sledu nalezení agenta a hlášení škod.Pomoc v nouzi a pak nabídka dalších pojištění. 5 věcí! Tj. nejčastější věci, které u nich uživatelé řeší.
![Page 49: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/49.jpg)
A tuhle zkušenost oni aplikovali i na web. Na první místě sjednání po jištění, hned vedle kontakt a hlášení pojistné události. Pod tím nabídka dalších pojištění. Stejný pattern
![Page 50: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/50.jpg)
Jeffrey Zeldman
Spíše perlička. Webový designer Jeffrey Zeldman zašel při návrhu svého nového webu ještě o krok dál. Vlastně zůstal v kroku prvním.
Jeffrey Zeldman - A List Apart - Designing with Web Standards
![Page 51: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/51.jpg)
Udělal svůj web Mobile Only. Taky způsob :)
![Page 52: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/52.jpg)
1:1
![Page 53: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/53.jpg)
http://www.flickr.com/photos/73491156@N00/380316678/
Důvod druhý - rychlost
![Page 54: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/54.jpg)
Druhou věcí, se kterou se musíte na mobilu vypořádat je, krom malé obrazovky, že jsou to zařízení pomalá. Mají pomalejší připojení k Internetu, mají pomalejší vykreslování stránek (né každý má rychlý smartfon za 15 000 Kč, 600 Euro), mají pomalejší vykreslování Javascriptu atd. Tudíž, aby byla vaše webová stránka na mobilu použitelná, tak musí být v prvé řadě rychlá. Stránka se musí rychle načíst, musí se rychle vykreslit, všechny prvky, které na ní jsou musí na uživatele reagovat bleskově.
![Page 55: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/55.jpg)
Miller, R. B. (1968). Response time in man-computer conversational transactions. Proc. AFIPS Fall Joint Computer Conference Vol. 33, 267-277
Protože použitelnost velmi souvisí s rychlostí, což už je známo přes 40 let.R.B.Miller - 1968 - Response time in man-computer conversational transactions
![Page 56: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/56.jpg)
Speed is best featurehttp://pacepirate.tumblr.com/post/23988387164
Dá se říct, že rychlost je ta nejlepší funkce, kterou svým uživatelům můžete dopřát. A jakmile dokážete optimalizovat vaší stránku na mobilním zařízení, představte si, jak úžasně rychlá bude na uživatelově notebooku či stolním počítači.
![Page 57: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/57.jpg)
http://www.flickr.com/photos/72296542@N00/382441387/
Vaši uživatelé budou jednoduše nadšeni. A o to tu jde, ne?
![Page 58: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/58.jpg)
“Mobile experiences fill the gaps while we wait. Nobody wants to wait while we wait.” - Mike Krieger, Co-founder
Lidé velmi často používají mobilní zařízení, když čekají a nikdo nechce čekat, když čeká.
![Page 59: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/59.jpg)
http://www.flickr.com/photos/12836528@N00/6575053747/
A zase to má vliv i na byznys.
![Page 60: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/60.jpg)
Sources: slideshare.net/stubbornella/designing-fast-websites-presentation & slideshare.net/markstanton/speed-matters
10% nejrychlejších uživatelů zůstává na stránkách o 50% déle než 10% uživatelů pomalých.
100ms zpoždění při vypisování výsledků vygeneruje ročně 1% ztrátu. Což je zhruba 200 milionů dolarů ročně.
400ms zpoždění výsledků sníží o 5-9% celkový provoz na stránkách.
500ms zpoždění snižuje provoz ve vyhledávači o 20%.
1s zpoždění výsledků snižuje příjem o 4%.
Studie za studií potvrzují, že nedostatečná rychlost vašeho webu vás může připravit o slušné příjmy. Amazon - 100ms zpoždění při vypisování výsledků vygeneruje ročně 1% ztrátu. Což je zhruba 200 milionů dolarů ročně.Yahoo - 400ms zpoždění výsledků sníží o 5-9% celkový provoz na stránkáchGoogle - 500ms zpoždění snižuje provoz ve vyhledávači o 20%.Bing - 1s zpoždění výsledků snižuje příjem o 4%AOL 10% nejrychlejších uživatelů zůstává na stránkách o 50% déle než 10% uživatelů pomalých.
![Page 61: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/61.jpg)
http://www.flickr.com/photos/92921037@N00/5532840143/
Když navrhujete weby pro mobilní zařízení, tak se musíte vyrovnat se dvěma velkými problémy.
![Page 62: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/62.jpg)
Moment vlastně se třemi. Jsem na jeden hezký důvod zapomněl.
![Page 63: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/63.jpg)
Kde uživatelé nejčastěji používají mobil pro přístup k internetu? Kdy navštíví právě ty vaše webové stránky?
![Page 64: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/64.jpg)
Většinou je to v tramvaji, v autobuse či v autě. Tedy když lidé jedou z práce či do práce.
![Page 65: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/65.jpg)
http://www.sxc.hu/photo/701461
Dalším případem může být situace, kdy člověk někde čeká - na zastávce tramvaje, ve frontě na poště, v čekárně u doktora či na pražské magistrále :) To jsou případy, kdy návštěvníci vašich potřebují specifické informace.
![Page 66: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/66.jpg)
http://img7.rajce.idnes.cz/d0701/5/5006/5006399_09658305445135137543d2c6bcdeab1a/images/nuselsky-most_stavka_09.jpg
Dalším případem může být situace, kdy člověk někde čeká - na zastávce tramvaje, ve frontě na poště, v čekárně u doktora či na pražské magistrále :) To jsou případy, kdy návštěvníci vašich stránek potřebují specifické informace.
![Page 67: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/67.jpg)
Thing different!
Tudíž, při návrhu webové stránky či aplikace musíte přemýšlet nejen o tom, jaké zařízení váš návštěvník používá, ale také kde ho používá, za jaké situace. Co právě dělá. Protože né vždy ho zajímají vaše tiskové zprávy, né vždy ho zajímá jaké ocenění jste dostali ve webové soutěži, né vždy ho zajímá hromada flashových bannerů a navíc málokdy je to člověk z vaší vlastní firmy.
![Page 68: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/68.jpg)
http://www.flickr.com/photos/92921037@N00/5532840143/
Když navrhujete weby pro mobilní zařízení, tak se musíte vyrovnat se třemi problémy: malá obrazovka, pomalé načítání stránek a místo. Jsou to dva problémy a zároveň skvělé příležitosti, jak vytvořit příjemnou a svižnou prezentaci či službu.
![Page 69: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/69.jpg)
Když navrhujete weby pro mobilní zařízení, tak se musíte vyrovnat se třemi problémy: malá obrazovka, pomalé načítání stránek a místo. Jsou to dva problémy a zároveň skvělé příležitosti, jak vytvořit příjemnou a svižnou prezentaci či službu.
![Page 70: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/70.jpg)
http://www.flickr.com/photos/92921037@N00/5532840143/
Zapamatujte si tedy, že:
![Page 71: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/71.jpg)
“Yes, I am...”
Návrh pro mobilní zařízení dokáže zlepšit uživatelskou zkušenost i na velkém webu.Máte méně funkcí, které jsou ale zatraceně rychlé a vymazlené.
![Page 72: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/72.jpg)
http://www.flickr.com/photos/94588149@N00/4758676577/
Návrh pro mobilní zařízení vám dokáže ušetřit či dokonce vydělat i nějaké peníze.Zaměříte se na to, co vám peníze vydělává a kde jenom utrácíte.
![Page 73: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/73.jpg)
http://www.flickr.com/photos/44083360@N00/6157683097/
Občas jsou omezení super.Máte prostě méně věcí, o které se musíte starat. A naopak je může vyladit k dokonalosti.
![Page 74: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/74.jpg)
http://www.flickr.com/photos/95572727@N00/4317572931/
Až zítra ráno přijdete do práce můžete zkusit následující:
![Page 75: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/75.jpg)
Představte si svůj web na mobilu
1
Koukněte se na váš web a představte si ho na mobilu.
![Page 76: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/76.jpg)
Optimalizujte
2
Začněte ho optimalizovat. Ať hlediska funkcí, tak z hlediska rychlosti.
![Page 77: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/77.jpg)
Poznejte kontext
3
Zamyslete se nad tím, kdo a v jaké chvíli přistupuje na váš mobilní web.
![Page 78: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/78.jpg)
To je vše.
Díky
![Page 79: Neohýbejte svůj web na mobil, začněte znovu](https://reader031.vdocuments.pub/reader031/viewer/2022020217/549576b6b4795916258b4605/html5/thumbnails/79.jpg)
@soundake
http://soundake.cz/
http://symbio.cz/