Přestože se počet webů bez mobilní optimalizace zmenšuje, stále existují některé, které jsou určeny pouze pro stolní počítače. Předchozí webová služba „mobilizátoru“společnosti Google byla bohužel ukončena. Duchovním nástupcem služby je Google Weblight, navržený spíše pro optimalizaci pomalého připojení než pro revizi webů pro mobilní prohlížení. Kromě služeb Google existuje řada postupů a nástrojů, které je třeba vzít v úvahu při vývoji webu s ohledem na mobilní zařízení.
Kroky
Část 1 ze 2: Experimentování s Google Weblight
Krok 1. Analyzujte, jak Weblight funguje
Weblight je algoritmus vytvořený společností Google, který uživatelům poskytuje rychlejší a lehčí načítání stránek ve špatných síťových podmínkách. To znamená, že Weblight nemá žádné uživatelské rozhraní a funguje na backendu. Stránky jsou zbaveny svých složitějších prvků a poskytují svlečený, lehký zážitek, spíše než ten, který je výslovně optimalizován pro mobilní platformu.
Krok 2. Otestujte změny webu pomocí Weblight
Na svém mobilním zařízení jednoduše připojte úplnou adresu URL svého webu na konec adresy weblight (např. Pokud je váš web „mywebsite.com“, zadejte https://googleweblight.com/?lite_url=https://mywebsite.com). Stránka načte její zjednodušenou, ale funkční verzi. S odstraněnými prvky se některé stránky mohou na obrazovkách mobilních zařízení zobrazovat mnohem lépe.
Krok 3. Rozpoznat omezení
Mějte na paměti, že se nejedná o explicitní nástroj pro převod určený pro interakci uživatele. Zatímco ruční zadávání webových stránek lze použít v malém množství, Weblight je navržen pro rychlost, nikoli pro použitelnost.
Část 2 ze 2: Navrhování pro mobilní kompatibilitu
Krok 1. Mějte na paměti omezení mobilních zařízení
Mobilní zařízení sdílejí několik aspektů, které je odlišují od jejich protějšků pro stolní počítače. Tyto základní funkce by měly být hlavními aspekty při vytváření webu pro mobilní spotřebu.
- Malé obrazovky a svislost: Přestože se rozlišení obrazovky na mobilních zařízeních neustále zlepšuje, velikost a tvar zůstává problémem pro design stránek. Navrhování webu do rozložení do jednoho sloupce je nejlepší pro telefony (tablety mohou často používat webové stránky pro počítače bez větších problémů).
- Dotyková rozhraní: Prvky stránky by měly být umístěny s ohledem na velikost prstu. Prvky, které používají přejetí myší, by měly být minimalizovány nebo přepracovány pro dotykové ovládání (např. Rozbalovací nabídky).
- Rychlost dat: Jednou z velkých výhod mobilních zařízení je použití mimo dosah wifi, ale datová připojení jsou obvykle pomalejší a méně spolehlivá. Uživatelská rozhraní (UI) by měla zůstat jednoduchá a obsah by měl být viditelný a přístupný. Příliš mnoho nepořádku zkracuje dobu načítání a ztěžuje navigaci.
Krok 2. Použijte službu Content Management System (CMS)
Pro ty, kteří vyvíjejí s menším počtem zdrojů, je použití služby CMS, jako je Wordpress nebo Squarespace, skvělými možnostmi levného a uživatelsky přívětivého mobilního designu. Motivy využívající responzivní webový design poskytnou nejjednodušší šablonu pro mobilní web.
Responzivní webový design je teorie webového designu, která propaguje používání tekutých designových prvků, které umožňují plynulé přechody mezi designem a použitelností napříč platformami
Krok 3. Otestujte obrazovky mobilních zařízení pomocí softwaru pro stolní počítače
Existuje řada bezplatných webových aplikací, které vám umožňují emulovat mobilní zařízení a testovat estetiku a funkčnost webových stránek. Použití těchto nástrojů je stejně snadné jako výběr požadovaného testovacího zařízení a poté vstup na cílovou webovou stránku k náhledu. Většina bude obsahovat nástroje pro proměnné, jako je orientace obrazovky, hustota pixelů nebo dokonce výběr prohlížeče. Několik populárních příkladů je:
- Emulátor režimu zařízení Chrome
- mobilephoneemulator.com
- screenfly (podmnožina quirktools)
- mobiletest.me (placené členství)
