Det er ingen overraskelse at en nylig rapport fra FNs byrå, The International Telecoms Union , spådde at det vil være flere mobile abonnementer på planeten enn folk i de neste 9 månedene. "Smartphone Revolution" er mest definitivt på oss, og som sådan har mobilnettdesign eksplodert de siste årene.

Dette har medført at webutviklere har fått tak i mobilnettdesign, hvis de ønsker å konkurrere og fremtidssikre deres virksomhet. Med dette i tankene har jeg kommet opp med noen topptips for å gi utviklere et utgangspunkt, med noen ting å huske på før du fortsetter.

Tenk på teknologi med rask bevegelse

En rask titt på hvor langt mobilenheter har kommet siden innføringen av iPad, vil bekrefte at mobilteknologi er en rask og stadig skiftende industri, og derfor er det lurt å vurdere hvordan du kan fremtidssikre design.

Dette betyr at det er viktig å holde tritt med de nyeste trenderne hvis du på en eller annen måte skal sikre at nettstedet vil være levedyktig om noen år. Responsiv design er selvfølgelig all den raseri i øyeblikket, og det er sannsynlig at dette vil være en del av planen din.

Selv om det er trygt å anta at de fleste av de besøkende vil ha smarttelefoner, er det verdt å vurdere at ikke alle vil, og så må du kanskje jobbe med dette i designet. Det er verdt å undersøke målgruppen i planleggingsstadiene, slik at du får tak i de vanlige enhetene som brukes, samt brukeradferd.

Snakker om brukeradferd ...

Mobilnettbesøke trenger ikke nødvendigvis tilgang til nettsteder på farten, og dette er noe å huske på. Ofte gjøres mobil surfing mens du venter; på toget, i bilen eller på sofaen hjemme.

Dette betyr at stripping ned designet slik at det er for forenklet kan være kontraproduktivt. Hvis du har et bare-bein-nettsted med ingenting mye i form av innhold, kan dette være off-putting til publikum fordi nettstedet ditt ikke gir noe mye av reell bruk og kan betraktes som noe mer enn en overdimensjonert bannerannonse.

Mobilt i disse dager brukes så mye som, om ikke mer enn, skrivebordet for nettlesing, så vær oppmerksom på dette under designprosessen og sørg for at nettstedet ditt er enkelt å bruke, men likevel innholdsrik.

Optimalisering av mobilnettstedet ditt

Optimalisering av mobile nettsteder er også viktig, spesielt for destinasjonssider, da disse er inngangspunktet til nettstedet. Dette betyr at et mobilnettsted bør optimaliseres med brukeren i tankene, samt søkemotoren, for å gi en enkel navigasjonsopplevelse, klar tekst, enkle klikkklikkformer og relevant metainformasjon og alt-tagger.

Filstørrelser bør vurderes i forhold til vekt og en sterk oppfordring til handling bør inkluderes på destinasjonssider. Hvis du må bruke skjemaer, så hold dem så enkle som mulig, med så få inntastingsfelter som mulig, slik at brukeren ikke blir frustrert og forlater.

Det samme gjelder for handlinger; holde dem enkle og bare bruk når det er nødvendig. Selv om det kan være fint å ha et fancy navigasjonssystem, hvis det er ubrukelig, forvent en høy avkastningsfrekvens.

Når knapper må brukes, må du passe på "tommelprøven", noe som betyr at du komfortabelt skal kunne trykke på en knapp med tommelen, uten å trykke på annet innhold som kan føre deg til en uønsket side.

Optimalisering er noe som må vurderes når man bygger en responsiv nettside også. Mye debatt har nylig raget på hvordan responsiv design bremser ned på nettet, og om det i det vesentlige vil bety døden av reagerende nettsteder. Det er imidlertid betinget lasting teknikker som kan bidra til å øke hastigheten på et nettsted for å sikre at enhetene ikke laster ned automatisk den fullstendige desktopversjonen av nettstedet hver gang.

CSS- og JavaScript-ressurser skal komprimeres, og det er rikelig med åpen kildekode-programvare tilgjengelig for å hjelpe med dette. For eksempel, UglifyJS kan brukes med JavaScript for å komprimere kode og Kompass kan brukes til å skape renere oppslag, samt sprites og utvidelser, uten for mye oppstyr og hardt arbeid.

Rutenett og bruddpunkter

Når du bruker lydhør design, er en av de viktigste tingene som skal defineres ved starten, rutenettet og dine pausepunkter. Igjen er det mange verktøy online som kan hjelpe deg med å definere kolonner og deres bredde og takrenner.

Noen utviklere liker å sette breakpoints basert på oppløsning, men dette er egentlig ikke den beste løsningen da det er så mange mobile enheter på markedet og resolusjonene endres med tiden.

Dette betyr at breakpoints bør være basert på design og innhold, snarere enn oppløsning. For å teste breakpoints og grids kan nettleservinduet brukes under designprosjektet for å se hvordan innholdet oppfører seg når størrelsen endres.

Ideelt sett bør det flyte naturlig og du kan bruke så mange brytpunkter som du trenger for å oppnå dette.

UI, kompatibilitet og retningslinjer

Ikke alle mobile operativsystemer er opprettet på samme måte som du vet, så det er verdt å se på retningslinjene når det gjelder bygging for Android og iOS, for eksempel, og nettleserne som kan brukes på dem.

Husk at brukere vil surfe på en rekke operativsystemer, og noen vil være eldre versjoner, så det er nyttig å sikre at mobilwebområdet er bakoverkompatibelt. Her er det nyttig å se på analytics for hovedsiden, hvis det er aktuelt, da du vil kunne se hvilke enheter publikum har tilgang til på nettstedet.

Å se på analyser etter at nettstedet er fullført, vil selvsagt også hjelpe deg med å gjøre nødvendige endringer og lære for fremtiden.

Innhold, innhold, innhold

Som vi alle vet nå, er innholdet enda en konge på nettet, og det er viktig å planlegge innholdsmoduler. Behandlingen til innholdsmodulene må defineres for å sikre at de vises som de skal da brukeren navigerer og tar tiltak.

Dette betyr at du må se på og definere hvordan innhold vises når du bytter mellom en skjerm for skrivebord og mobil for å bestemme hvordan modulene skal stables og ombestille seg selv.

I denne forbindelse er det ofte lettere å virkelig få dette festet i planleggingsstadiet. Lag en skiss på hvordan du ser på innholdsvisning og arbeid så gjennom hvordan dette kan oppnås.

Men prøv å ikke bli for hengt opp på å definere alt. Mens hovedsidene dine trenger trådrammer, følger det ikke nødvendigvis med at hver enkelt side vil. Å lage et mestersett for skjermstørrelser og orientering burde virkelig være nok.

Bygg en prototype først og test grundig, og sørg for at alle aspekter fungerer som du går. Det er også lurt å holde brukeren oppmerksom på når du tester, slik at navigasjonen er enkel og helst høyst tre lag. Prøv å finne noen som ikke er teknologisk tenkende, men bruker forskjellige enheter, for å teste nettstedet på.

Konklusjon

Mobil webdesign er en nødvendig utfordring for å få tak i som designer, for å kunne tilby en komplett tjeneste til kunden. Som mange ting i livet planlegger en av de viktigste aspektene at du har en klar ide om hvordan du skal gå videre.

Effektiv planlegging og holde brukeren oppmerksom på, vil bidra til å overvinne de fleste hindringene du sannsynligvis kommer over, og grundig testing vil plukke opp resten. Tenk lydhør, rask og enkel, med utmerket nyttig innhold, og du kan ikke gå for langt feil.

Utvalgt bilde / miniatyrbilde, mobil web bilde via Shutterstock.