Na vytváření speciálních stránek pro mobilní telefony se už rezignovalo. Důvodem je, že jednak se jednotlivé obrazovky mobilních telefonu natolik liší, že by bylo potřeba vytvořit více variant, a také mobilní telefony nejsou jediné zařízení, které potřebují zvláštní vzhled. Máme tu tablety, jejich menší provedení, herní konzole a nově i televize. V dnešní době je tak základem responsivní design.
Statická velikost je minulostí pro mobilní telefony
Dříve jsme si stránku nakreslili na papír a pak se rozhodli, kolik pixelů bude mít jednotlivé části. Například hlavní obsah byl široký 800 px a sloupec 280 px. To je dnes už minulostí. Místo toho se používají relativní velikosti, které omezíme jen pro maximální šířku. Maximální šířku opravdu nepodceňujte, televize s podporou 4K mají opravdu hodně prostoru.
Breakpoints
Breakpoinst jsou body zlomu, kdy buď máme dostatek prostoru, abychom na stránku dostaly třeba tři sloupce vedle sebe anebo zobrazíme jen dva. Jedná se o běžně využívanou techniku a při návrhu stránky je nutné s tímto počítat. Důležitější je zde použitelnost a pohodlí uživatele, než prostor. Někdy je nutné něco roztáhnout, jindy přidat prostor. Většinou jeden breakpoint nestačí a chce počítat alespoň s mobilem, tabletem a desktopem. Jednotlivé prvky nemusíme jen přeskládávat, ale lze využít i jejich skrytí do menu a znovuobjevení po kliknutí na menu. Vyhněte se ale jakýmkoliv funkcím, které vyžadují najetí myši. Mobilní zařízení totiž takovouto funkci neumí.
Pozor na fonty
Současným trendem je používat webfonty. Vypadají dobře a často jsou i univerzálním řešením. Problém je, že se musí stahovat. Uvědomte si, že ačkoliv naši operátoři deklarují pokrytí celého území, tak ne všude mají rychlý internet. Dokonce jsou místa, kde lidé doslova loví signál mácháním mobilu nad hlavou. Takže čím méně se toho stahuje tím lépe. Pro mobilní zařízení se vyplatí používat systémové fonty. Obdobně si dávejte pozor i na optimalizaci grafiky.
Nezapomínejte na vektorovou grafiku
Některé části stránky jako je třeba navigace nemusí vypadat po zvětšení zrovna dobře. Návštěvníci s mobilním zařízením jsou zvyklí si některé části zvětšovat. Zkuste si někdy zvětšit třeba 5x nějakou část navigace, rozhodně nemusí vypadat ideálně. Na druhou stranu toto vše může vyřešit vektorová grafika. Obrázky nechce PNG, JPG a GIF. Všechno co bude nutné zvětšovat a pro navigaci volte vektorovou grafiku, tedy SVG. Ovšem pozor na starší prohlížeče.
