Jak přesměrovat mobilní uživatele na váš web
už jste někdy zkusili zadat adresu URL m.facebook.com na ploše? Zkuste to, a uvidíte, že web vypadá divně na velké obrazovce.
podobně zkuste otevřít náhodný místní web v mobilu. Můžete narazit na některé weby, které nejsou optimalizovány pro mobilní zařízení, a proto Vás na první pohled vyhodí. Takové stránky mají tendenci ztrácet své mobilní publikum vůči svým konkurentům.
responzivní webdesign
v dnešní době vám všechny dobré platformy CMS umožňují vytvářet webové stránky pomocí responzivního designu, který se přizpůsobuje v závislosti na velikosti obrazovky.
je důležité zkontrolovat, jak se vaše webové stránky zobrazují na různých zařízeních – to může znamenat rozdíl mezi udržením návštěvníků na vašem webu a jejich ztrátou, nikdy se nevrátí.
je důležité také zmínit, že od doby, kdy Google přešel na první indexování v mobilu, je mobilní verze vašeho webu pro Google to, co se počítá, což znamená, že je nepravděpodobné, že bude při vyhledávání dobře fungovat, pokud způsobí, že návštěvníci budou mít špatný uživatelský dojem.
mobilní webové stránky
i když je stále více neobvyklé, některé podniky stále dávají přednost samostatnému webu pro mobilní uživatele. To přichází se spoustou potenciálních problémů, kterým lze snadno zabránit.
zkontrolujte, zda je váš web vhodný pro mobilní zařízení
můžete zkontrolovat, zda byl váš web správně nastaven pro mobilní zařízení spuštěním bezplatné recenze WooRank.
při sjíždění po samostatné trase mobilního webu je třeba se postarat o dvě důležité věci, aby bylo zajištěno skvělé prohlížení mobilních uživatelů:
- Vytvořte mobilní web, který poskytuje skvělý uživatelský zážitek
- Přesměrujte svůj web pro mobilní uživatele
samozřejmě, pokud máte mobilní web vytvořený pomocí nástrojů pro citlivý webový design, nemusíte se obávat přesměrování návštěvníků mobilních zařízení.
přesměrování vašeho mobilního webu
pokud vytvoříte samostatný mobilní web, ale nenakonfigurujete jej tak, aby správně přesměrovával své mobilní uživatele, veškerý čas a úsilí vynaložené na vytvoření mobilního webu by se ztratilo.
proto dnes budeme diskutovat o různých způsobech, jak můžete přesměrovat mobilní uživatele na svůj mobilní web. Přesměrování jsou použitelná pouze v případě, že máte samostatný mobilní web.
Jak mohu přesměrovat na mobilní web?
Nyní, když se chystáte naučit, jak přesměrovat své mobilní uživatele na svůj mobilní web, vysvětlíme, jak přesměrování funguje.
k dispozici je stolní prohlížeč pro uživatele stolních počítačů a mobilní prohlížeče pro uživatele mobilních telefonů. Oba tyto typy prohlížečů odesílají data ve formě „user-agent“ na webový server, kde sídlí vaše webové stránky. Tento „user-agent“ obsahuje informace, které informují webový server o typu zařízení, ve kterém je prohlížeč otevřen. Tyto informace zahrnují název prohlížeče, verzi a další informace o vašem operačním systému.
zkuste například do smartphonu zadat následující adresu URL – detectmobilebrowser.com. informace, které vidíte, jsou poněkud podobné informacím odeslaným na váš webový server ze všech mobilních zařízení, ze kterých je váš web přístupný.
kromě metody detekce „user-agent“ existuje ještě jeden faktor, který pomáhá detekovat mobilní uživatele. Tímto faktorem je rozlišení obrazovky. U moderních zařízení jsou však rozlišení obrazovky vyšší pro ještě menší obrazovky smartphonů. Faktor user-agent je proto nejběžnější metodou používanou k identifikaci mobilních uživatelů.
Nyní pojďme k podnikání a promluvme si o různých metodách, kterými můžete pro své mobilní uživatele použít přesměrování na svůj web.
- metoda pluginu
- metoda JavaScriptu
- metoda PHP
- The .htaccess metoda
- nová metoda CSS @media
metoda pluginu
pokud používáte platformu pro správu obsahu (CMS), jako je WordPress nebo Joomla, máte štěstí. Mají připravené pluginy, které pomáhají přesměrovat mobilní uživatele na váš mobilní web.
některé z těchto pluginů pro mobilní přesměrování specifických pro CMS jsou následující:
pro WordPress-Simple Mobile URL Redirect, WordPress Mobile Pack
pro Joomla-Simple Mobile Detection
pro Magento-URL přesměrování
pro Drupal-Simple Mobile Redirect, Mobile JS Redirect
pokud je váš web vytvořen v jakémkoli jiném CMS, zkuste Google Hledat plugin, který pomáhá s mobilními přesměrováními pro daný CMS.
metoda JavaScript
pomocí kódu JavaScript můžete přesměrovat své mobilní návštěvníky na svůj mobilní web. Tento JS kód může detekovat velikost obrazovky nebo user-agent.
kód JS, který používá velikost obrazovky, naleznete v následujícím článku: jak přesměrovat svůj web na jeho mobilní verzi.
JS kód, který používá user-agent – tento kód v následujícím artice: přesměrování mobilních zařízení.
obě tyto sady kódů můžete použít na svůj web. Obě tyto metody však mají své nevýhody.
v metodě velikosti obrazovky definujete rozlišení obrazovky, ale v dnešní době máme menší obrazovky kapesních zařízení s vyšším rozlišením. To může skončit nesprávnou detekcí mobilních uživatelů.
v metodě user-agent je těžké sledovat každý nový a nadcházející user-agent a přidávat je do kódu JS. Existuje mnoho uživatelských agentů a to se neustále mění s rozvojovými technologiemi. Podívejte se například na tento rozsáhlý seznam uživatelských agentů.
a největší nevýhoda ze všech je pro uživatele, kteří nemají na svých telefonech nainstalován JavaScript. Ačkoli, většina telefonů je vybavena JavaScriptem, někteří se rozhodnou jej deaktivovat. Některé staré modely Blackberry nepodporují JavaScript. K překonání těchto překážek můžete použít přesměrování na straně serveru pro weby kódované v PHP nebo ASP.
metoda PHP
pokud je váš web kódován v PHP, můžete tuto metodu použít k přesměrování mobilních uživatelů. Výhodou použití této metody je, že nejste omezeni na prohlížeče, které běží na JavaScriptu. Budete však muset uvést více uživatelských agentů.
aby tento skript fungoval, musí být vaše rozšíření stránky .php a váš hostingový účet musí podporovat PHP. Přidejte následující kód do sekce
vašeho webu.
<?php $iphone = strpos($_SERVER,"iPhone"); $android = strpos($_SERVER,"Android"); $palmpre = strpos($_SERVER,"webOS"); $berry = strpos($_SERVER,"BlackBerry"); $ipod = strpos($_SERVER,"iPod"); if ($iphone || $android || $palmpre || $ipod || $berry == true) { echo "](https://s3.amazonaws.com/woocms.woorank.com/2020/05/poor-mobile-optimization.png"; } ?>tento kód najdete v následujícím článku: Simple PHP Mobile Website Redirect Code.
nahraďte http://m.site.com adresou URL vašeho mobilního webu.
Le .htaccess metoda
další alternativní způsob přesměrování mobilního uživatele na váš mobilní web, založený na typu MIME, který prohlížeč podporuje, je .metoda htaccess. Pokud například typ prohlížeče podporuje typ MIME, který zahrnuje WML (Wireless Markup Language), prohlížeč je z mobilního zařízení.
můžete umístit kód doporučený v tomto článku s názvem přesměrování na mobilní web s.htaccess.
ale než vložíte tento kód, ujistěte se, že zálohujete stávající .soubor htaccess. Instalace .htaccess kód nesprávně může způsobit problémy ve vašem webu. Pokud si nejste jisti, jak to udělat sami, požádejte o pomoc webového vývojáře.
nahraďte http://m.example.com adresou URL vašeho mobilního webu.
nová metoda CSS @media
CSS má vestavěnou metodu pro detekci mobilních prohlížečů. Poté zobrazí styly CSS na základě velikosti okna prohlížeče. K tomu nepotřebujete samostatný mobilní web. Na jedné webové stránce potřebujete dva styly, první pro typ média“ obrazovka „(pro stolní monitory) a druhý pro typ média“ ruční “ (pro chytré telefony).
Chcete-li implementovat tuto metodu, musíte do značky
dokumentu HTML vložit následující sadu kódů.
<br /> /* Smartphones (portrait and landscape) ----------- */<br /> @media only screen<br /> and (min-device-width : 320px)<br /> and (max-device-width : 480px)<br /> /* Styles */<br />tento kód a mnoho dalších variant najdete na této stránce s názvem dotazy médií pro standardní zařízení.
existuje mnoho nevýhod použití této metody. Vyžaduje přidání obrovské sady kódu CSS na web. Stále existují některá zařízení, která nepodporují „ruční“ typy médií a místo toho vykreslují stránky s nastavením zobrazení „obrazovky“.
Existuje tedy mnoho způsobů, jak přesměrovat mobilní uživatele na váš mobilní web, jak je uvedeno výše. Můžete umístit více skriptů na hlavní části vašeho webu, řekněme například skript, který detekuje velikost obrazovky, stejně jako uživatelské agenty.
ale vaše práce není hotová, dokud nebudete mít mobilní přesměrování, která fungují dobře i pro roboty vyhledávačů. Zejména v případě Google existují některé konfigurace,které musíte udělat, aby rozlišovaly mezi adresou URL plochy a mobilní adresou URL.
pro více informací si přečtěte blog Google webmastercentral o změnách v žebříčku výsledků vyhledávání smartphonů a informace o technikách přesměrování podporovaných společností Google.
na svůj mobilní web musíte přidat kanonickou adresu URL, aby společnost Google pochopila vztah mezi vaší mobilní adresou URL a adresou URL plochy.
s cílem pomoci Googlebot zjistit umístění mobilních stránek vašeho webu, Google doporučuje webové stránky musí:
přidat rel=“alternativní“ tag na ploše stránky, která ukazuje na odpovídající mobilní URL.
přidejte na mobilní stránku značku rel= „canonical“, která ukazuje na odpovídající adresu URL plochy.
to umožňuje prohledávačům Google porozumět vztahu mezi dvěma adresami URL-desktop a mobile.
jakmile na svůj web umístíte správná přesměrování pro své mobilní uživatele, je čas vyzkoušet, zda přesměrování fungují dobře pro různá zařízení. Testování ručně na jakémkoli dostupném zařízení smartphonu je jedním ze způsobů, jak to udělat. Tyto mobilní emulátory však můžete také použít k otestování správného vykreslení vašeho mobilního webu na různých mobilních zařízeních.
nezapomeňte, že správné používání mobilních přesměrování je kritickým krokem k zajištění toho, aby váš mobilní web byl přátelský k vyhledávačům. Pokud váš web není přesměrován dobře pro vaše mobilní uživatele, můžete také ztratit mnoho cenných podniků. Proto, jak pro SEO, tak pro pozitivní změny v míře konverze, musíte okamžitě podniknout kroky, aby vaše webové stránky byly přesměrovány pro vaše mobilní uživatele pomocí jedné z výše uvedených metod.
tento blogový příspěvek byl aktualizován dne 15. ledna 2020