Selv om antallet nettsteder uten mobiloptimalisering er redusert, er det fortsatt noen som er designet kun for datamaskiner. Dessverre er Googles tidligere "mobilizer" -tjeneste avviklet. Tjenestens åndelige etterfølger er Google Weblight, designet for optimalisering for treg tilkobling i stedet for å revidere nettsteder for mobilvisning. Utover Googles tjeneste er det en rekke praksiser og verktøy som du bør vurdere når du utvikler et nettsted med tanke på mobil.
Trinn
Del 1 av 2: Eksperimentering med Google Weblight
Trinn 1. Analyser hvordan Weblight fungerer
Weblight er en algoritme opprettet av Google for å gi brukerne raskere og lettere sidelaster når de er i dårlige nettverksforhold. Dette betyr at Weblight ikke har noe brukergrensesnitt og fungerer på backend. Sider er fratatt sine mer komplekse elementer, noe som gir en lett, lett opplevelse i stedet for en eksplisitt optimalisert for mobilplattformen.
Trinn 2. Test nettstedendringer med Weblight
På din mobile enhet legger du bare til hele webadressen til slutten av weblight -adressen (f.eks. Hvis nettstedet ditt er "mywebsite.com", skriver du inn https://googleweblight.com/?lite_url=https://mywebsite.com). Siden vil laste inn en forenklet, men funksjonell versjon av seg selv. Med de fjernede elementene kan enkelte nettsteder se mye bedre ut på skjermer på mobilenheter.
Trinn 3. Innse begrensningene
Husk at dette ikke er et eksplisitt konverteringsverktøy designet for brukerinteraksjon. Mens manuell bruk av nettstedet kan brukes i klemme, er Weblight designet for hastighet, ikke brukervennlighet.
Del 2 av 2: Design for mobil kompatibilitet
Trinn 1. Husk begrensninger på mobilenheten
Mobilenheter deler noen få aspekter som skiller dem fra sine stasjonære kolleger. Disse kjernefunksjonene bør være hovedhensynene når du oppretter et nettsted for mobilt forbruk.
- Små skjermer og vertikalitet: Selv om skjermoppløsninger på mobile enheter stadig forbedres, er størrelsen og formfaktoren fortsatt et problem for nettstedets design. Å designe et nettsted i en enkelt kolonneoppsett er best for telefoner (nettbrett kan ofte bruke skrivebordssider uten for mye problem).
- Berøringsgrensesnitt: Sideelementer bør plasseres med størrelsen på en finger i tankene. Elementer som bruker musoverføring bør minimeres eller redesignes for berøring (f.eks. Rullegardinmenyer).
- Datahastigheter: En av de store fordelene med mobile enheter er bruk utenfor wifi -området, men datatilkoblinger er vanligvis tregere og mindre pålitelige. Brukergrensesnitt (UI) bør forbli enkelt, og innholdet skal være synlig og tilgjengelig. For mye rot vil legge ned lastetider og gjøre navigasjonen vanskelig.
Trinn 2. Bruk en Content Management System (CMS) -tjeneste
For de som utvikler med færre ressurser, er bruk av en CMS-tjeneste som Wordpress eller Squarespace et godt alternativ for rimelig, brukervennlig mobildesign. Temaer som bruker responsivt webdesign, gir den enkleste malen for et mobilnettsted.
Responsive webdesign er en teori om webdesign som fremmer bruk av flytende designelementer for å tillate jevne overganger av design og brukervennlighet på tvers av plattformer
Trinn 3. Test skjermen på mobilenheten ved hjelp av stasjonær programvare
Det finnes en rekke gratis webapplikasjoner som lar deg etterligne mobile enheter for å teste nettstedets estetikk og funksjonalitet. Å bruke disse verktøyene er like enkelt som å velge ønsket testenhet, og deretter gå inn på målnettstedet for å forhåndsvise. De fleste vil inneholde verktøy for variabler som skjermorientering, pixeltetthet eller til og med nettleservalg. Noen få populære eksempler er:
- Emulator for Chrome -enhetsmodus
- mobilephoneemulator.com
- screenfly (et delsett av quirktools)
- mobiletest.me (betalt medlemskap)
