Mobil første design: Hvorfor det er flott og hvorfor det suger

Historisk sett har de fleste nettdesignere og deres kunder først nærmet seg skrivebordsiden av ethvert prosjekt, mens de forlater den mobile delen som et sekundært mål som blir oppnådd senere. Selv med økningen i responsiv design, begynner mange av oss med nettstedet "i full størrelse" og jobber oss ned.

Det er en økende trend i bransjen om å snu denne arbeidsflyten på hodet og faktisk begynne med mobile betraktninger og deretter arbeide opp til en større desktop-versjon.

Hvorfor ville du noen gang henvende deg til et prosjekt på denne måten? Hva er noen av fordeler og ulemper med denne strategien? Les videre for å finne ut av det!

Mobil webdesign er ikke en nisje

Hvis du fremdeles har det i hodet at mobil webdesign og applikasjonsutvikling er en nisjeindustri, må du endre tankegangen din. Mobil er ikke en trend, og det er heller ikke fremtiden, det er nåtiden. Tro meg ikke? Her er noen sprø statistikk å vurdere fra Mobithinking:

• Det er over 1, 2 milliarder mobile nettbrukere over hele verden
• I USA er 25% av mobile nettbrukere bare mobile (de bruker sjelden et skrivebord for å få tilgang til nettet)
• Mobilapper har blitt lastet ned 10, 9 milliarder ganger
• Salget av mobilenheter øker over hele linjen, med over 85 prosent av nye håndsett som kan få tilgang til mobilnettet

En av de mest potente fakta her er det andre elementet, som viser at mange brukere sannsynligvis bare vil se mobilversjonen av nettstedet ditt. Det er en utrolig åpenbaring, ikke sant?

Mer enn noen gang før er nettet noe vi har i lommene, ikke noe som bare henger ut nær skrivebordet vårt eller til og med i våre hjem. Dette er en global trend som bare vil fortsette å se vekst de kommende årene. Er du klar for dette? Inkluderer ditt profesjonelle ferdighetsnett webutvikling for alle viktige plattformer eller bare skrivebordsarenaen?

Hvorfor mobil først?

Odds er ingen av de som leser dette, og har ikke lært noe nytt opp til dette punktet. Telefonene på $ 500 + i lommene til alle du kjenner er indikasjonen du trenger på at nettet har brutt ut av datamaskinens boks.

At mobilnettilgang er populær, gjør imidlertid nesten ingenting for å overbevise meg om at jeg trenger å forfølge en strategi som setter mobil først. Baksiden av at 25% av mobilbrukere bare er mobile er at 75% av dem ikke er det! Skrivebordet er fremdeles et viktig medium, for ikke å glemmes eller skyves til bakbrenneren ennå. Så hvorfor vurderer vi til og med å ta ruten for den første mobilen?

En av de viktigste katalysatorene for fremveksten av mobil-første nettdesign var kunngjøringen fra Eric Schmidt i 2010 om at Google kom til å ta denne tilnærmingen fra nå av, gå så langt som å si “Jeg tror det er nå det felles prosjektet til alle av oss for å gjøre mobilen til svaret på stort sett alt ”(kilde). Hvorfor denne drastiske endringen i tilnærming?

Graceful Degradation vs. Progressive Enhancement

Dette er noen viktige buzz-ord fra noen år siden som fremdeles kan gi mye innsikt i forestillingen om mobil-første webdesign, og hvorfor det er et viktig konsept å vurdere.

Grasiøs degradering oppsto av et behov for å ha en designfunksjon på så mange nettlesere og plattformer som mulig. Designere og utviklere ønsket å dra nytte av ny teknologi uten å ekskludere brukere med oppsett som ikke hadde støtte. Den generelle konklusjonen var å opprette og tjene opp den beste opplevelsen som mulig, og deretter redegjøre for hver mulig nedbrytning og sikre at nettstedet til tross for mangler vil forbli funksjonelt.

Når det gjelder mobil webdesign, betydde dette at et komplett, standard nettsted ville skaler tilbake og gradvis fjerne innhold og funksjoner etter hvert som visningsområdet ble mindre og systemet enklere (ingen Flash-støtte osv.).

Ut av denne trenden oppstod en kraftfull ny idé: progressiv forbedring. I denne versjonen av historien legger du din beste fot frem på den mobile plattformen, og gir brukerne minimal skjermeiendom, prosessorkraft og tredjeparts plugins en fantastisk opplevelse som både ser bra ut og fungerer perfekt. Etter hvert som behovet oppstår, kan nettstedet gradvis bli "forbedret" og til og med fullstendig omtenkt for større plattformer med færre begrensninger.

Hvorfor vinner progressiv forbedring

På et øyeblikk virker disse to metodikkene omtrent likeverdige. Hvem bryr seg hvor du begynner designprosessen så lenge den blir gjort, ikke sant?

Situasjonen er imidlertid litt mer sammensatt. Når du starter med stasjonær plattform, har du en tendens til å ønske å dra nytte av alt plattformen har å tilby. Du bygger et fantastisk produkt som utnytter mye god teknologi, bare for å innse at ingen av dem skalerer godt ned til mobil. Dette kan og føre til kraftig utvannet mobile produkter som føles mer som en ettertanke enn et polert, ferdig produkt. Skjer dette med hvert prosjekt? Kanskje ikke, men historien er sannsynligvis langt vanligere enn du ønsker å tro.

Hvis vi undersøker den arbeidsflyten med progressiv forbedring, har resultatet en tendens til å være en annen historie. Her starter vi med et prosjekt som både er supermager og ganske imponerende. Du har tatt all den startende energien og brukt den til å lage et produkt som ser ut og fungerer bra til tross for de mange begrensningene du møtte.

Enda viktigere er at du allerede har gjennomgått problemet med å trimme ned innholdet til dets viktigste elementer. Når det nå er tid for å ta dette designet til skrivebordet, i stedet for å møte beslutningen om hva du skal kutte og hvordan du skal vanne ned produktet ditt, får du i stedet bestemme hvordan du skal gjøre det enda mer robust!

Nettinnhold: Selges best mulig

Ovennevnte argument kommer fra deg fra et rent filosofisk synspunkt, og den endelige konklusjonen er at resultatet har en tendens til å bli bedre hvis en mobil-første tilnærming tas. Hvis du vil ha et argument med et litt mer observerbart stoff bak, må du ikke se lenger enn hvordan du serverer innholdet ditt.

Hvis vi tar det grasiøse nedbrytningssynspunktet, blir alt innholdet (tekst, bilder, video, lyd osv.) Servert samtidig til det som antas å være den største plattformen. Herfra blir mobilversjoner regnskapsført som bare ignorerer eller fjerner mye av dette innholdet fra siden. Problemet er imidlertid at det allerede var lastet inn om den gitte plattformen trengte det eller ikke. Vi opplever at vi serverer mer innhold enn det som er nødvendig på plattformen som ofte er assosiert med de tregeste nedlastingshastighetene. Ser du noe galt med det?

Med et mobil-første synspunkt starter vi med å laste de absolutte bare nødvendighetene på de mindre plattformene. Dette fører til en morsommere opplevelse som unngår unødvendig etterslep. De ekstra ressursene lastes strengt etter behov til plattformer som kan håndtere dem godt.

Hva med responsiv design?

Hvordan passer alt sammen med responsiv design, den andre trenden som tar over nettet? Den gode nyheten er at disse to strategiene ikke er konkurransedyktige. Du kan si at de var laget for hverandre.

Responsiv design er bygget rundt konseptet mediesøk som er målrettet mot spesifikke enheter og visningsstørrelser. Med dette i bakhodet kan du kode opp den opprinnelige CSS-en gitt et mobilperspektiv og deretter bruke mediesøk for å selektivt tjene opp ekstra styling når visningsstørrelsen øker.

Dette er sannsynligvis det motsatte av metoden du vanligvis bruker med responsiv design: start stort og reduser deretter. Gitt argumentene ovenfor, er det imidlertid mye logikk bak å strukturere mediespørsmålene dine fra små til store.

The Big Fat Ulemper

Hurra for mobil-første webdesign. Det er den største tingen å treffe på nettet siden The Oatmeal. Så hvorfor er jeg ikke spent på det? Hvorfor har jeg ofte, helt klart, unngått temaet mobil-første webdesign, selv om jeg kjemper over responsiv design?

Med en gang står jeg overfor en mindre skjerm, færre ressurser og en haug med mer hodepine.

Svaret her er enkelt: det er verken morsomt eller enkelt. Sikker responsiv design er vanskelig, men det lar meg bøye layoutmusklene og utnytte mye innebygd nettleserfunksjonalitet for å utføre noen kule bragder. Responsiv design gjør leketøykassen min større, ikke mindre.

Men med mobil-første design, blir jeg slått over hodet med begrensninger på trinn én. Det er ikke noe gøy i det hele tatt! Med en gang står jeg overfor en mindre skjerm, færre ressurser og en haug med mer hodepine. Videre er det bare ikke det komfortable territoriet. Jeg har tilbrakt mesteparten av webdesignkarrieren min på skrivebordet, og bygd erfaringer rundt musefly og klikk, ikke fingertips. Jeg har gjort mye mobilarbeid, men jeg vil ikke kalle det min sterke drakt.

Det viktigste er at fra et strengt designperspektiv synes jeg det er veldig vanskelig å dykke ned i et design hvis jeg begynner med mobil og jobber meg opp. Jeg nevnte dette i en fersk artikkel for mange "huzzahs" i kommentarene, og har til og med hørt ledende bransjefolk synge en lignende melodi.

Rising To The Challenge

La oss se litt på argumentene mine for og mot en mobil-første designtilnærming. I kategorien “for” har vi enkle og logiske argumenter som er vanskelige å bagatellisere. I kategorien “mot” har jeg mye sutring og personlig nøling. Hvilken side tror du vinner denne kampen?

Jeg må gi opp litt trøst i navnet på å være en bedre designer.

Kanskje har du noen bedre anti-mobile-first-argumenter enn jeg gjør, men hvis jeg ser på dette fra et objektivt synspunkt, er det tydelig at den mobile-first-tilnærmingen er den sterkere utfordreren.

Dette betyr at jeg sannsynligvis trenger å komme over meg selv og møte utfordringen med å starte prosjekter med et mobilt synspunkt. Hvis jeg ikke er komfortabel med å designe for mobile-først, bra, betyr det at jeg har rom til å vokse og teknikker for å lære.

Til syvende og sist, hvis mine grunner for å ta i bruk en mobile-first-tilnærming er brukersentriske og mine grunner mot den er personlige, så må jeg gi opp litt komfort i navnet til å være en bedre designer.

Hva holder deg tilbake?

Du vet nå alt om hvor flott mobil-første webdesign er for brukerne dine. Du vet at store selskaper som Google tar denne tilnærmingen, og du kan se fordelene med en mobil-første arbeidsflyt. Så hva holder deg tilbake?

Deler du mitt perspektiv om at mobile-first er en vanskelig strategi å implementere og er enig i at du bare trenger å ta spranget? Eller er det noe mer vesentlig som holder deg tilbake?