Jak na mobilní verzi webu?

[.:M@rt!n:.]

Ahoj,
budu psát bakalářku na téma Optimalizace webu pro mobilní zařízení, a tak bych se chtěl zeptat, jestli nevíte o nějakém dobrém zdroji, kde bych mohl zjistit, jak vůbec normální web převést na mobilní? Nějaká ta teorie asi nebude problém, ale nemůžu nikde najít, jak převést ten web? Jaké jsou možnosti a postupy atd. ?

Díky za každou radu

[Reklama]

[Ltb]

"Web" je široký pojem, ale co se týče třebas diskuzních fór (phpBB, SMF, vBulletin), je tu skvělý nástroj Tapatalk. Možná se ti někde podaří najít nějaké schéma, jak Tapatalk pracuje, budeš tak moci použít...

[.:M@rt!n:.]

Konkrétně se bude jednat asi o jednoduchý web, na kterém dané možnosti ukáži a porovnám.. Čili to vidím na nějaké své portfolio, které později vytvořím.

[CZechBoY]

podle mýho je mobilní verze jen osekaná verze desktopový
málo obrázků, málo textu, jen samí odkazy

[mistr moskva]

Obecně s nějakými příklady asi takto:

http://www.fg.cz/cs/prectete-si/clanky/113.shtml

http://programujte.com/clanek/201201250 ... ebdesignu/

Pak není k zahození tuším pomocník CSS "volání na média", kdy se dá určit jaké styly se mají nahrát při konkrétním rolišení - tedy odlišné styly pro monitory stolních a přenosných počítačů, odlišné pro netbooky a odlišné pro mobilní telefony - tady se dají osekat ty obrázky, ale taky třeba pozicování a atd. atd.

takhle bych si to představoval já, ale žel nemám praktické zkušenosti

[CZechBoY]

přes css nejde zjistit jaký je rozlišení, to je ten hlavní problém... musí se použít javascript

[mistr moskva]

v knize HTML5 a CSS3 pro webové designerý se píše následující:

@media handheld and (max-width: 380px) { sem přijdou styly }

Ve výše uvedeném příkladu se zaměřujeme na na všechna přenosná zařízení, jejichž maximální zobrazovací šířka nepřesahuje 380 pixelů.

nebo taky

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { sem přijdou styly }

Tedy nejsme si jistý jakou to má podporu u starších zařízení, ale u novějších typů by to snad mělo fungovat. Osobně jsem to nezkoušel, je to jen citace z knihy. :)

[CZechBoY]

mm: to je zajímavý, ale IE to bude podporovat až ve verzi 999

[mistr moskva]

CzechBoy: Jak je to s tou podporou u IE nevím, ale vždycky se dá udělat podmínkový komentář, který bude obsahovat vlastní styly pro jiné prohlížeče - všiml jsem si, že v případě IE se to využívá poměrně často.

Každopádně k výše uvedenému postupu byla poznámka, ve které figuroval iPhone 4 - takže bych se domníval, že je v případě tohoto tazatelova dotazu tento postup použitelný.

Chce to programovat a zkoušet přístupnost na co největším počtu zařízení (mobily, tablety) a ladit a ladit :)