Responzivní design e-shopu

Co je to responzivní design

Obvykle stačí jen či dva pohledy kolem sebe, aby bylo hned jasné, že smartphony a tablety do jisté míry nahradily počítače. Jde o trend, který jen tak nevymizí. Skrze chytré telefony dnes naprosto běžně procházíme web a stále častěji dokonce i nakupujeme. Některé odhady říkají, že skrze mobilní zařízení dnes web navštěvuje až polovina uživatelů. Záleží samozřejmě na charakteru konkrétních stránek. Minimálně to ovšem bude 20 až 30 procent. To je obrovská masa potenciálních zákazníků, které velmi pravděpodobně odradí, pokud se jim vaše internetové stránky zobrazí na malém displeji telefonu ve webové verzi. 

Právě proto se před 10 lety začal rozmáhat takzvaný responzivní web, který se dokáže inteligentně přizpůsobit velikosti displeje. Výraz “responsive web design” poprvé použil v květnu roku 2010 americký programátor Ethan Marcotte. Web optimalizovaný pro mobilní zařízení se začal velmi rychle stávat standardem

responzivita

Obzvláště důležitý je responzivní design pro provozovatele malých lokálních podniků. Konkrétně například obchodů, kaváren nebo restaurací. Lidé tyto podniky velmi často hledají během chůze na ulici a samozřejmě skrze mobilní telefon. Dobře optimalizované webové stránky zásadně zvyšují šanci, že uživatel, například turista, podnik s hezkým webem najde a zjistí z něj všechny potřebné informace, podnik nakonec skutečně navštíví. Responzivní zobrazení je dnes navíc jedním z faktorů, který rozhoduje o tom, jak vaši stránku budou zobrazovat internetové vyhledávače.

Mobilní nakupování je trend

Stále častěji se ovšem přes mobilní zařízení odehrávají také internetové nákupy. Zde už to nemusí být nutně smartphone, ale i tablet. Mohlo by se zdát, že tablet má již dost velkou obrazovku k tomu, aby mohl pohodlně zobrazit webové stránky v plném rozsahu. Do úvahy ale musíme vzít jiný poměr stran, a to zvláště, pokud tablet používáme vertikálně, a také dotykové prostředí. Pokud jsou stránky dobře optimalizované a na tabletu se dobře procházejí, opět se zvyšuje šance, že zde uživatel skutečně nakoupí.

Kontrola dobře fungujícího responzivního zobrazení je zkrátka jednou z důležitých věcí, které je potřeba zkontrolovat ještě před spuštěním ostré verze webu.

Tak trochu předchůdcem responzivního designu byla takzvaná mobilní verze webu. Ještě dnes mají některé weby někde vpravo nahoře tlačítko pro přepnutí na mobilní verzi. V tomto případě nemůžeme hovořit o responzivním designu. Jde spíše o paralelní web, který běží na subdoméně. Typicky m.domena.cz. Responzivní zobrazení je oproti tomu takový design webu, který se flexibilně přizpůsobuje velikosti displeje. Například velikost obrázku není definována v pixelech, ale v procentech, díky čemuž se přizpůsobí rozlišení dané obrazovky. Jednotlivé části stránek jsou seskupené do bloků, přičemž i rozmístění těchto bloků se optimalizuje podle rozlišení obrazovky. 

Upgates řeší i problém fyzické optimalizace HTML kódu a skriptů responzivního webu pro nejmenší mobilní přístroje. U těch se předpokládá využití pomalejšího připojení k internetu. Nechceme přece, aby se do mobilu stahovaly obrázky, které jsou zmenšené pouze rozměrově, nikoliv velikostně (kB). Zbytečné části kódu lze pomocí podmínek pro mobilní zařízení zcela odstranit. Takže komunikace se serverem a velikost stahovaných souborů na sníží na nezbytné minimum.

Další článek
Proč je blog jedním z pilířů úspěšného e-shopu?