Prečo je responzívny dizajn jedným z najdôležitejších prvkov na webe? 2. časť

Prečo je responzívny dizajn jedným z najdôležitejších prvkov na webe? 2. časť

V predchádzajúcom blogu sme si predstavili pojem responzívny dizajn a priblížili sme si jeho základné vlastnosti. V aktuálnom pokračovaní článku si viac povieme o jeho dopadoch na SEO. Predstavíme si alternatívne spôsoby optimalizácie pre mobilné zariadenia a spomenieme aj niekoľko slov aj o responzívnom dizajne a CMS BUXUS.

1. Dopady na SEO

Mať responzívny web je dôležité aj z pohľadu SEO - optimalizácie pre vyhľadávače (termín pochádzajúci z anglického Search Engine Optimization). Google pri indexovaní stránky významným spôsobom zohľadňuje index použiteľnosti webu na mobilných zariadeniach, čo si možno kedykoľvek jednoducho otestovať. Google zároveň uprednostňuje webové stránky, ktoré sú príjemnejšie na používanie pre používateľa. V prípade, že vyhľadávame určitý výraz na mobilnom zariadení, tak preferuje weby, ktoré sú čo najviac optimalizované pre mobily alebo tablety.

 

2. Adaptívny dizajn

V praxi sa vyskytujú alternatívne spôsoby optimalizácie webovej stránky. Jednu z takýchto alternatív predstavuje aj adaptívny dizajn. Tento spôsob využíva najmä Javascript, ktorý pri detekcii mobilného zariadenia alebo menšieho rozlíšenia poprehadzuje a prispôsobí jednotlivé prvky takým spôsobom, aby boli zobrazené ideálne pre ten-ktorý displej. Adaptívny dizajn však nie je však vhodné používať ako samostatné riešenie. Hlavným dôvodom je, že webová stránka sa najprv zobrazí v desktopovej verzii. Až po načítaní Javascripov sa potom jednotlivé prvky poprehadzujú a web sa prispôsobí pre menšie obrazovky. Adaptívny dizajn však možno použiť ako doplnkový prístup k responzívnemu webu, a to najmä pri riešení niektorých prípadov, kedy sa nemožno vyhnúť použitia Javascriptu.  

Kombináciu responzívneho webu a adaptívneho dizajnu používame v ui42 najčastejšie. Použitie adaptívneho dizajnu nemá negatívny vplyv na SEO stránky.

3. Mobilný web

V minulosti nebol responzívny dizajn bežným štandardom. Webové stránky tak využívali mobilnú verziu webu. Táto sa nachádza na samostatnej URL adrese ako napríklad: m.nieco.sk. Výhodou tohto spôsobu implementácie je, že HTML a CSS sú pre štandardné a mobilné zobrazenia úplne oddelené. De facto sú potom jednoduchšie pre celkovú implementáciu. Prehliadač vždy sťahuje len kód určený pre dané zobrazenie, zatiaľ čo pri responzívnom dizajne sťahuje celý kód.  

 

Negatívom tohto riešenia je však náročnejšia udržateľnosť kódu. V prípade, že sa niečo zmení na desktopovej verzii, je nevyhnutné vykonať rovnakú zmenu aj na mobilnej verzii. Rozhodnutie o tom, ktorá verzia stránky sa používateľovi zobrazí, sa realizuje na serveri a nie na používanom zariadení. Môže sa pritom stať, že detekcia mobilného zariadenia nezafunguje správne.

Za najväčšiu nevýhodu tohto riešenia považujem negatívny vplyv na SEO. Každá webová stránka má dve URL adresy (jednu určenú pre mobilné a jednu pre štandardné zobrazenie). Rovnako negatívny vplyv má na rýchlosť stránky. Ak príde používateľ z mobilného zariadenia na štandardnú verziu stránky, je potrebné ešte dodatočné presmerovanie.

 

4. Responzívny dizajn v ui42 a podpora zo strany BUXUSu

Všetky webové stránky, ktoré vytvárame v ui42, sú štandardne plne responzívne. Samotné základné šablóny v CMS BUXUS sú postavené na Bootstrape a teda sú tiež responzívne. Nikdy pritom nezabúdame ani na rýchlosť webu. BUXUS dokáže automaticky meniť veľkosť obrázkov tak, aby sa zbytočne nenaťahovali príliš veľké obrázky. Načítavanie Javascriptov riešime najčastejšie pomocou requirejs, takže použitie Javascriptov ako súčasť adaptívneho dizajnu webové stránky nespomaľuje.

Prekážkou responzívneho webu však nie je ani prípad, kedy nepoužívame náš CMS BUXUS. Jedným zo skvelých prípadov takejto práce je vysoko responzívny dizajn a frontend realizovaný pre netradičnú švajčiarsku cestovnú kanceláriu Risskov-Bilferie.

Zhrnutie – prečo investovať do responzívneho dizajnu:

  • Výrazne zlepšuje použiteľnosť webu pre návštevníkov na mobilných zariadeniach.
  • Znižuje sa bounce rate - z neresponzívnej stránky ľudia odchádzajú skôr ako z responzívnej.
  • Zvyšujú sa konverzie pri e-shopoch.
  • Zvyšuje sa rýchlosť webu.
  • Zlepšuje sa SEO - Google zohľadňuje vyššiu rýchlosť načítavania webovej stránky aj celkovo lepší používateľský zážitok.
  • Ponúka možnosť získať viac vracajúcich sa / lojálnych návštevníkov.


Ak vás téma zaujala, neváhajte nás kontaktovať. Radi vám poradíme.

Prečítajte si tiež

Konzultácia zadarmo

S čím by ste potrebovali pomôcť?

Vyberte všetky možnosti, ktoré sa vás týkajú

Potrebujete ešte s niečím pomôcť?

Vyberte si ďalšiu oblasť

Zanechajte nám na vás kontakt

Formulár bol úspešne odoslaný.