Načo nezabudnúť pri mobilnej verzii webu
Ak máte stránku od ktorej požadujete, aby bola pohodlná pre návštevníkov z mobilných zariadení rovnako ako pre návštevníkov z webového prehliadača počítača, máte v podstate dve možnosti:
- responzívny dizajn
- mobilnú verziu
Pri responzívnom dizajne sa webstránka upraví tak, aby bolo vhodná pre akékoľvek zariadenie a URL adresa podstránky zostáva rovnaká. Zo SEO hľadiska je teda jasné, že nevyžaduje žiadne špeciálne nastavenia.
Toto sa však líši ak vytvoríte špeciálnu verziu pre mobilné zariadenia. Typické m.vasadomena.sk. Server rozozná typ zariadenia návštevníka a presmeruje ho na verziu, ktorá je pre neho určená. V tomto prípade máte s veľkou pravdepodobnosťou podobný (ak nie rovnaký) obsah na dvoch URL adresách – www. verzia a m. verzia podstránky.
Ako sa teda vyhnúť problémom s duplicitami? Riešením je rel=canonical (v kombinácii s rel=alternate), ktorý bol predstavený ešte v roku 2009 a podporujú ho všetky významné vyhľadávače súčasnosti.
Napríklad ak by náš blog nebol responzívny a jeho mobilná verzia by mala adresu m.visibility.sk/blog, do sekcie <head> jej html kódu by sme vložili nasledovný kód:
[html gutter=“false“]
<link rel="canonical" href="https://visibility.sk/blog">
[/html]
Do klasickej desktopovej verzie stránky by sme následne pridali rel=alternate:
[html gutter=“false“]
<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.visibility.sk/blog">
[/html]
Veľmi zaujímavý je tu parameter media pomocou ktorého vieme vyhľadávaču odovzdať informáciu, pri akom rozlíšení obrazovky návštevníka prichádza k presmerovaniu. Vyhľadávač potom môže pre takýchto návštevníkov vo výsledkoch vyhľadávania zobraziť priamo mobilnú verziu.
Tieto značky je taktiež potrebné premietnuť do mapy stránok (sitemap.xml), kde k bežnému zápisu pridáme ešte rel=alternate aj s media parametrom. V našom príklade by položka v sitemape vyzerala nasledovne:
[xml gutter=“false“ highlight=“3″]
<url>
<loc>https://visibility.sk/blog</loc>
<xhtml:link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.visibility.sk/blog" />;
</url>
[/xml]
Ako ste mohli vidieť, nie je to zložité, jedná sa však o častú a zbytočnú chybu, ktorá následne spôsobuje komplikácie s duplicitou obsahu.