Odborníci již roky říkají, že návštěvnost mobilních zařízení návštěvníky webových stránek dramaticky roste. Z tohoto důvodu mnoho společností chytře začalo přijímat mobilní strategii pro svou online přítomnost a vytvářelo prostředí, které je vhodné pro telefon a další mobilní zařízení.
Jakmile jste strávili čas učením se, jak na to design webových stránek pro mobilní telefonya při implementaci své strategie budete také chtít zajistit, aby si návštěvníci vašeho webu mohli tyto návrhy prohlédnout. Existuje mnoho způsobů, jak toho dosáhnout, a některé fungují lépe než jiné. Zde je pohled na metodu, kterou můžete použít k implementaci mobilní podpory na svých webových stránkách - spolu s doporučením na konci, jaký je nejlepší způsob, jak toho dosáhnout, na dnešním webu.
Poskytněte odkaz na jinou verzi webu
Toto je zdaleka nejjednodušší metoda pro zacházení s uživateli mobilních telefonů. Místo toho, abyste se obávali, zda mohou nebo nemohou vidět vaše stránky, jednoduše vložte odkaz někde v horní části stránky, který ukazuje na samostatnou mobilní verzi vašeho webu. Čtenáři si pak mohou sami vybrat, zda chtějí vidět mobilní verzi, nebo pokračovat v „normální“ verzi.
Výhodou tohoto řešení je, že se snadno implementuje. Vyžaduje, abyste vytvořili optimalizovanou verzi pro mobilní zařízení a poté přidali odkaz někde v horní části normálních stránek webu.
Nevýhody jsou:
- Pro mobilní uživatele musíte udržovat samostatnou verzi webu. Jak se váš web zvětšuje, můžete zapomenout udržovat druhou verzi a vaše weby by mohly vypadnout ze synchronizace.
- Vytváříte také třetí verzi pro tablety? A co čtvrtá verze pro nositelná zařízení? Tento koncept verzí specifických pro zařízení se může velmi rychle vymknout kontrole.
- V horní části stránky musíte umístit ošklivý odkaz, který ne-mobilní čtenáři uvidí (a případně na něj kliknou).
Nakonec je tento přístup zastaralý a je nepravděpodobné, že bude součástí moderní mobilní strategie. Někdy se používá jako oprava mezery, zatímco se vyvíjí lepší řešení, ale v tomto okamžiku je to opravdu krátkodobá náplast.
Použijte JavaScript
Ve variantě výše uvedeného přístupu používají někteří vývojáři nějaký typ detekce prohlížeče skript pro zjištění, zda je zákazník na mobilním zařízení, a poté jej přesměrovat na tento samostatný mobil stránky. Problém s prohlížeč detekce a mobilních zařízení je, že existují tisíce mobilních zařízení. Pokusit se je všechny detekovat pomocí jednoho JavaScriptu by mohlo proměnit všechny vaše stránky v noční můru stahování - a stále podléháte mnoha stejným nevýhodám jako výše uvedený přístup.
Použijte ruční CSS @media
Ruční příkaz CSS @media se zdá být ideálním způsobem zobrazení CSS styly jen pro kapesní zařízení - jako jsou mobilní telefony. To se jeví jako ideální řešení pro zobrazování stránek pro mobilní zařízení. Napíšete jednu webovou stránku a poté vytvoříte dvě šablony stylů. První pro typ obrazovky „obrazovky“ upravuje styl vaší stránky pro monitory a počítačové obrazovky. Druhý pro „kapesní“ styl vaší stránky pro malá zařízení, jako jsou tyto mobilní telefony. Zní to jednoduše, ale v praxi to opravdu nefunguje.
Největší výhodou této metody je, že nemusíte udržovat dvě verze svého webu. Jen udržujete jeden a styl definuje, jak by to mělo vypadat - což se vlastně blíží konečnému řešení, které chceme.
Problém s touto metodou spočívá v tom, že mnoho telefonů nepodporuje typ média - místo toho zobrazuje své stránky s typem média na obrazovce. A mnoho starších mobilních telefonů a kapesních počítačů CSS vůbec nepodporuje. Nakonec je tato metoda nespolehlivá, a proto se k poskytování mobilních verzí webových stránek používá jen zřídka.
K detekci User-Agent použijte PHP, JSP, ASP
Toto je mnohem lepší způsob, jak přesměrovat mobilní uživatele na a mobilní verze webu, protože se nespoléhá na skriptovací jazyk nebo CSS, které mobilní zařízení nepoužívá. Místo toho používá jazyk na straně serveru (PHP, ASP, JSP, ColdFusion atd.), Aby se podíval na agenta uživatele a poté změnil HTTP požadavek ukazovat na mobilní stránku, pokud jde o mobilní zařízení.
Jednoduchý kód PHP, který by to udělal, by vypadal takto:
Problém je v tom, že existuje spousta dalších potenciálních uživatelských agentů, které mobilní zařízení používají. Tento skript zachytí a přesměruje mnoho z nich, ale ne všechny. A neustále se přidávají další.
Navíc, stejně jako u ostatních výše uvedených řešení, budete i nadále muset udržovat samostatný mobilní web pro tyto čtenáře! Tato nevýhoda nutnosti spravovat dva (nebo více!) Webů je dostatečným důvodem k hledání lepšího řešení.
Použijte WURFL
Pokud jste stále odhodláni přesměrovat své mobilní uživatele na samostatný web, pak WURFL (Wireless Universal Resource File) je dobré řešení. Jedná se o soubor XML (a nyní soubor DB) a různé knihovny DBI, které obsahují nejen aktuální data bezdrátových uživatelských agentů, ale také které funkce a funkce tyto uživatelské agenty podporují.
Chcete-li použít WURFL, stáhněte si konfigurační soubor XML a poté vyberte svůj jazyk a implementujte API na svůj web. Existují nástroje pro používání WURFL s Java, PHP, Perl, Ruby, Python, Net, XSLTa C ++.
Výhodou používání WURFL je, že existuje spousta lidí, kteří neustále aktualizují a přidávají do konfiguračního souboru. Takže i když je soubor, který používáte, zastaralý téměř před dokončením stahování, je pravděpodobné, že pokud ano stáhněte si jej přibližně jednou za měsíc, budete mít všechny mobilní prohlížeče, které vaši čtenáři obvykle používají, bez jakýchkoli problémy. Nevýhodou je samozřejmě to, že to musíte neustále stahovat a aktualizovat - to vše, abyste mohli uživatele přesměrovat na druhý web a nevýhody, které vytváří.
Nejlepším řešením je responzivní design
Pokud tedy údržba různých webů pro různá zařízení není odpovědí, co je to? Reagovat na web.
Responzivní design je místo, kde pomocí mediálních dotazů CSS definujete styly pro zařízení různých šířek. Responzivní design vám umožňuje vytvořit jednu webovou stránku pro mobilní i nemobilní uživatele. Pak se nemusíte starat o to, jaký obsah se má zobrazit na mobilním webu, nebo si pamatovat přenos nejnovějších změn na váš mobilní web. Navíc, jakmile máte napsaný CSS, nemusíte stahovat nic nového.
Responzivní design nemusí fungovat dokonale na extrémně starých zařízeních a prohlížečích (většina z nich je dnes velmi malá a neměla by vám dělat velké starosti), ale proto, že je aditivum (přidávání stylů do obsahu, nikoli odebírání obsahu), tito čtenáři budou i nadále moci číst vaše webové stránky, prostě to nebude vypadat ideálně na jejich starém zařízení nebo prohlížeč.