26/12/2016
Vložil: Jakub
949
Sdílet: Facebook

Responzivní design webových stránek

Co to vlastně znamená responzivní webdesign?

V dřívějších dobách (není to tak dávní) museli webdesigneři a kodéři mít přehled o rozlišeních používaných na počítačích. Většina uživatelů měla monitor umožňující zobrazení v rozlišení 1024x768px. Někteří (hloupější či slepí) uživatelé používali rozlišení 800x600px, nicméně většina kodérů toto rozlišení ignorovala.

Webdesign se tehdy řešil tak, že se počítalo s pevnou šířkou obsahové části webu na 960px a zbytek se nechal pro určitou vůli a pro scrollbar po pravé straně monitoru. V případě, že měl člověk monitor s větším rozlišením, obsah zůstal jednoduše zarovnaný na střed. Pokud měl člověk rozlišení menší, byl zobrazen velmi nepříjemný horizontální scrollbar, kterým bylo třeba posunout pro zobrazení další části obsahu.

Většina kodérů se snažila tomuto zobrazení vyhýbat. V případě, že by byl pouze jeden obsahový sloupec, bylo by to relativně snadné, nicméně v této době (a u některých webů, zvláště u e-shopů to platí dodnes) se užívalo postranního menu, či postranní obsahový sloupec a někdy dokonce i dva.

Jistá responzivita byla velmi chtěná už od začátku

Již v těchto počátcích se kodéři snažili mít weby v jistém smyslu responzivní. Nebylo to v takové podobě jaké to známe dnes. Nepoužívaly se chytré telefony a tablety, nebylo třeba různým způsobem omezovat či zalamovat obsah, nicméně každý chtěl mít web pokud možno přes celou šířku okna prohlížeče. V momentě, kdy bylo rozložení dvousloupcové (např. levé navigační menu a vpravo širší obsah), bylo to ještě relativně snadno realizovatelné. Ve chvíli kdy byly sloupce tři, vznikal již velký problém. Jeden čas se dokonce třísloupcovému rozložení obsahu, kdy nebyla šířka pevně definována říkalo "Zlatý grál", jelikož bylo opravdu velmi složité toho dosáhnout. Velkým viníkem této věci byl zejména prohlížeč Internet Explorer, který si v té době opravdu doslovně dělal absolutně co chtěl a téměř úplně ignoroval normy W3C. Internet Explorer, ani Internet Edge jsou stále známy různými odchylkami ve způsobu zobrazování, výpočtech a interpretaci různých věcí. Většina kodérů věřila, že se vznikem nového prohlížeče Internet Edge, který stojí na webkitu problémy odezní, ale Microsoft nám opět ukázal, že dokáže zvrtat i velmi jednoduchý úkol jako je interpretace HTML z již vytvořeného a funkčního interpreteru.

Z jakého důvodu je dnes responzivita důležitá?

Žijeme v pokrokové době. Většina z nás dnes vlastní chytrý telefon a tablet. Tato zařízení jsou mimo jiné určená právě ke snadnému přístupu k internetu, který je velmi důležitým komunikačním kanálem, ale zároveň i největší médium současné doby. Spousta uživatelů těchto zařízení si např. zkracuje dlouhou cestu do práce hromadnou dopravou brouzdáním po e-shopech a výběrem zboží, které by si rádi pořídili apod.

V případě, že máte v dnešní době neresponzivní web, odsuzujete své návštěvníky k zoomování webu a k posuvu po stránce všemi směry (ne jen nahoru a dolů). Prohlížení webu se pak stává pro návštěvníky velmi nepříjemné a často potom weby právě z tohoto důvodu opouští. Pokud máte e-shop, nebude složité najít e-shop, který by poskytoval stejné nebo podobné produkty, ale bude responzivní. Navíc zde platí to, že pokud si návštěvník "zamiluje" nějaký web na mobilu, pravděpodobně se na něj vrátí i na počítači a na ten neresponzivní, který ho naštval při posledním prohlížení rychle zapomene.

Dalším velkým důvodem proč mít responzivní web je největší světový vyhledávač - Google. Google bot mimo jiné hodnotí, zda je web správně responzivní (primárně zkoumá jestli nejsou odkazy po načtení příliš malé, nejsou příliš blízko u sebe, zda je text čitelný a jestliže obsah nepřetéká šířku stránky) a podle toho vás může dokonce vyřadit z indexování, minimálně při vyhledávání na mobilních zařízeních. To už je myslím opravdu velký důvod k tomu mít webové stránky responzivní.

Responzivní stránka a responzivní webdesign je rozdíl

Možná si říkáte, že by mohl nějaký programátor váš web jednoduše zresponzivnit. S tím za námi v minulosti chodilo hodně klientů. Není to však tak jednoduché. Váš web může být psaný naprosto mimo normy, či nějakým chaotickým způsobem, což dělá z tohoto úkonu věc finančně náročnější, než je kompletní tvorba nového webu.

Druhá věc je samotný design. Náš design vždy počítá s tím, že web bude responzivní. Z tohoto důvodu je třeba držet se spousty různých pravidel, jako jsou čistý design, prostor mezi jednotlivými elementy webu, způsob použití fotografií a v neposlední řadě sémantika webu, která je důležitá nejen pro správné UX webu, ale též pro SEO. Starší webové stránky psané ještě v HTML4 nejsou z dnešního hlediska sémantiky úplně špatně. HTML5 přináší do webů tzv. sémantické tagy (primárně jsou to section a article), které mají každý vlastní nadpis h1 stejně jako celá webová stránka a indexovací robot je umí procházet odděleně. Pomáhají v orientaci skrze web nejen indexovacím robotům, ale i různým zařízením a aplikacím pro nevidomé.

ZPĚT

David Rubek - sídlo - Žižkova 346, 273 09 Kladno -Švermov, IČO: 616 39 133, Zapsán u: Magistrát města Kladna / odbor obecní živnostenský úřad. Kladno 272 52, Starosty Pavla 44

Tento web k poskytování služeb, zabezpečení Vašich dat a anlýze návštěvnosti používá soubory cookies. Jeho používáním s tím souhlasíte. Rozumím