Även om antalet webbplatser utan mobiloptimering minskar, finns det fortfarande några som är avsedda endast för stationära datorer. Tyvärr har Googles tidigare mobiliseringswebbtjänst avbrutits. Tjänstens andliga efterträdare är Google Weblight, utformad kring optimering för långsamma anslutningar snarare än att revidera webbplatser för mobilvisning. Utöver Googles tjänst finns det ett antal metoder och verktyg som bör beaktas när man utvecklar en webbplats med mobil i åtanke.
Steg
Del 1 av 2: Experimentera med Google Weblight
Steg 1. Analysera hur Weblight fungerar
Weblight är en algoritm som skapats av Google för att ge användare snabbare och lättare sidbelastning vid dåliga nätverksförhållanden. Det betyder att Weblight inte har något användargränssnitt och fungerar på backend. Sidor är avskalade från sina mer komplexa element, vilket ger en avskalad, lätt upplevelse, snarare än en uttryckligen optimerad för mobilplattformen.
Steg 2. Testa webbplatsändringar med Weblight
På din mobila enhet lägger du helt enkelt till hela webbplatsens URL till slutet av weblight -adressen (t.ex. om din webbplats är "mywebsite.com" anger du https://googleweblight.com/?lite_url=https://mywebsite.com). Sidan laddar en förenklad men funktionell version av sig själv. Med de borttagna elementen kan vissa webbplatser se mycket bättre ut på skärmar för mobila enheter.
Steg 3. Känn igen begränsningarna
Tänk på att detta inte är ett uttryckligt konverteringsverktyg avsett för användarinteraktion. Medan manuell inmatning av webbplatsen kan användas i en nypa, är Weblight utformad för snabbhet, inte användbarhet.
Del 2 av 2: Design för mobil kompatibilitet
Steg 1. Tänk på begränsningar för mobila enheter
Mobila enheter delar några aspekter som skiljer dem från sina stationära motsvarigheter. Dessa kärnfunktioner bör vara de viktigaste övervägandena när du skapar en webbplats för mobil konsumtion.
- Små skärmar och vertikalitet: Även om skärmupplösningar på mobila enheter ständigt förbättras, är storleken och formfaktorn fortfarande ett problem för webbdesign. Att designa en webbplats i en enda kolumnlayout är bäst för telefoner (surfplattor kan ofta använda stationära webbplatser utan alltför stora problem).
- Pekgränssnitt: Sidelement bör placeras med ett fingerstorlek i åtanke. Element som använder muspekaren bör minimeras eller omdesignas för beröring (t.ex. rullgardinsmenyer).
- Datahastigheter: En av de stora fördelarna med mobila enheter är användning utanför wifi -område, men dataanslutningar är vanligtvis långsammare och mindre tillförlitliga. Användargränssnitt (UI) bör förbli enkla och innehållet ska vara synligt och tillgängligt. För mycket röror kommer att tappa ned laddningstiderna och försvåra navigationen.
Steg 2. Använd en Content Management System (CMS) -tjänst
För dem som utvecklar med färre resurser är att använda en CMS-tjänst som Wordpress eller Squarespace ett bra alternativ för billiga, användarvänliga mobildesign. Teman som använder responsiv webbdesign ger den enklaste mallen för en mobilsajt.
Responsiv webbdesign är en teori om webbdesign som främjar användningen av flytande designelement för att möjliggöra smidiga övergångar av design och användbarhet över plattformar
Steg 3. Testa skärmar för mobila enheter med hjälp av skrivbordsprogram
Det finns ett antal gratis webbapplikationer som låter dig emulera mobila enheter för att testa webbplatsens estetik och funktionalitet. Att använda dessa verktyg är lika enkelt som att välja önskad testenhet och sedan gå in på målwebbplatsen för att förhandsgranska. De flesta kommer att innehålla verktyg för variabler som skärmorientering, pixeltäthet eller till och med val av webbläsare. Några populära exempel är:
- Chrome -enhetslägesemulator
- mobilephoneemulator.com
- screenfly (en delmängd av quirktools)
- mobiletest.me (betalt medlemskap)
