Jste si jisti, že je vaše stránka dostatečně responzivní?

Na jakém zařízení právě čtete tento blog? Na počítači, tabletu nebo mobilu? Není ničím neobvyklým, že lidé, kteří jsou online využívají tato mobilní zařízení každým dnem častěji. Je v podstatě jedno, jestli na tomto zařízení čtete článek na blogu, nakupujete přes e-shop nebo díváte poslední část oblíbeného seriálu. Důležité je, aby vaše stránka byla responzivní. Jak je na tom ta vaše?
V následujícím článku se dozvíte všechny potřebné odpovědi. A pokud náhodou ne, klidně se ptejte v komentářích.

Pojďme na to postupně. Co znamená zmíněné slovo „responzivní“?
Responzivní design je takový design, při kterém se vaše stránka dokáže bez problémů přizpůsobit šířce jakékoli obrazovky. Tato schopnost vzniká využitím CSS. Má-li vaše stránka responzivní design, v praxi to bude znamenat, že stránka zobrazí 96% své šířky bez ohledu na to, na jakém zařízení si ji budete prohlížet a jaká je velikost této stránky. Takže, pokud si budete prohlížet stránku na mobilu a tabletu, automaticky se uspořádá tak, aby byla plně čitelná na obou zařízeních. To samé bude platit i na druhé straně, pokud využijete k zobrazení například velkou LCD televizi.

Naštěstí, většina WordPress témat již responzivní je. Takže při vybírání tématu berte v úvahu i tento aspekt a vybírejte si z těch, které jsou responzivní. Pokud se zamilujete do tématu, které responzivní není, pokud jste pokročilejší uživatel WordPress , programátor, z neresponzivního tématu dokážete tím správným použitím kódu vytvořit téma responzivní .
Pokud nevíte, nechcete, necítíte se na programování, stáhněte se modul WPTouch Mobile .

Responzivní téma má pár aspektů pro které ho právě takto označujeme:

• Váš obsah budou moci lidé jednoduše prohlížet na jakémkoli zařízení.
• Navigační menu se bude přizpůsobovat uživateli podle toho, jak se na stránce bude pohybovat.
• Při změně velikosti obrazovky se v prohlížeči stejně zobrazí veškerý obsah, který chceme, aby byl viděn a nic z něj nezůstane skryto.
• Formuláře na stránce budou také přizpůsobeny tak, aby byly snadno vyplnitelné na každém zařízení.
• Vaše snímky, stejně jako ostatní obsah budou také přizpůsobeny velikosti obrazovky. (Nicméně, již při jejich vkládání na stránku se ujistěte, že nejsou větší, než je třeba)
• Na hraničních bodech, kde se mění uspořádání prvků na stránce, se také vše zobrazí a nic nezůstane skryto.
• Responzivní design platí pro všechny typy obsahu na webu, a to nejen pro stránky nebo příspěvky.

V souvislosti s responzivním tématem jste již možná slyšeli o mobilním tématu. Ta se velmi často využívala pár let dozadu. Kromě klasické webové verze jste ještě nedávno potřebovali i mobilní verzi, případně mobilní aplikaci. Toto je dnes již (většinou) minulostí a díky responzivnímu designu získáte 3 in 1 a navíc ušetříte nemalé náklady.

Dnes se responzivní téma upřednostňuje i proto, že je u něj větší předpoklad, že stránky budou bez problémů pracovat na nových zařízeních iv budoucnosti. Nevýhodou mobilního tématu oproti responzivnímu je i to, že se při něm rozhraní mění jen na velmi specifické šířce obrazovky.

Mobilní témata nebo i moduly mají několik vlastností, které nejsou příliš pozitivní pro UX (User Experience): Vztahují se pouze na konkrétní stránky nebo na konkrétní typ obsahu na nich. Stává se to méně běžným jevem, ale ještě dnes existují stránky, které mobilní verze blokuje. To znamená, že návštěvníci, kteří si vaši stránku prohlížejí, se k jejímu obsahu nedostanou. A vzhledem k tomu, že více než polovina z prohlížení webových stránek se provádí pomocí mobilu, se vám tento jev určitě nebude líbit. Ano, většina témat už je sice responzivních, ale i mezi nimi se najdou značné rozdíly. Vyplatí se proto vědět, co vlastně hledáte.

Najděte opravdu dobrou responzivní téma. Pokud už si vás nějaké téma získalo, vyzkoušejte si ho na více šířkách obrazovek. Otevřete svou stránku v prohlížeči počítače s aktivovaným tématem a velikost prohlížeče ručně měňte. Pozorujte, co se děje. Vidíte na stránce všechny prvky? Vešly se do okna prohlížeče, přestože jste okno zmenšili? Nyní otevřete svou stránku s tématem na mobilním zařízení. Pokud je to možné, použijte obrazovky různé velikosti. Zkontrolujte, zda na obrazovce vidíte všechny prvky a nic vám nezmizelo.

Navíc, od Dubna 2015 Google penalizuje webové stránky, které nemají responzivní design a posouvá je ve vyhledávání na nižší pozice. Důvod je jednoduchý. Chce poskytovat uživatelům co nejlepší služby. To, zda je váš web responzivní si můžete prohlédnout například i ve vašem Google Analytics účtu v sekci Publikum> Mobilní zařízení> Přehled.

Mám pocit, že responzivní design je dnes označován spíše jako trend. Mnozí tak předpokadají, že dříve či později odejde. Responzivní design je ale víc, než jen trend. Je to způsob myšlení.

Responzivní design by měl zajistit to, aby se nenarušil dojem ze stránky a abyste se na ní mohli pohybovat na jakémkoli zařízení plynule a efektivně. S responzivním designem souvisí i rychlost načítání stránky . Ta by měla být v ideálním případě něco kolem 2 vteřin. Tyto dva atributy dnes hrají významnou roli při tom, jestli návštěvník na naší stránce setrvá a zároveň co nejrychleji najde co hledá. Vhodným rozmístěním zobrazovaných prvků může responzivní design pomoci zrychlit načíst stránku io pár desítek vteřin.