RWD Ikke bare om design - WordPress kan hjelpe

Som webutviklere virker nesten hver klient vi jobber med, forventer at nettstedet ditt skal ha en mobil versjon av hans eller hennes nettside. Og med det økende antallet variasjoner av skjermstørrelser og oppløsninger, vil det være umulig eller i det minste upraktisk å komme opp med et nettsted for hver enhet og skjermoppløsning som eksisterer.

I dette innlegget begynner vi på et grunnleggende nivå ved først å definere hva responsivt webdesign er, hvorfor det er viktig, og noen korte overvejelser man må gjøre når brainstorming er et responsivt WordPress-nettsted.

Hva er Responsive Web Design?

Wikipedia definerer RWD som:

Webdesign-tilnærming med sikte på å lage nettsteder for å gi optimal visningsopplevelse - enkel lesing og navigering med minimum omforming, panorering og rulling over et bredt spekter av enheter (fra mobiltelefoner til PC-skjermer).

Responsive webdesign innebærer bruk av CSS media spørringer med en blanding av fleksible grids og layouter. Jeg er sikker på at du har hørt om CSS-rammer som Bootstrap, Foundation og så videre. De bruker alle medieforespørsler med en blanding av layouter for å gjengi en side i henhold til skjermstørrelse, plattform og orientering.

For eksempel når du bruker Bootstrap, kan du bare aktivere prosjektet ditt å være responsivt ved å sette inn følgende linje kode på stikkord

 

I Bootstrap kan medieforespørsler tillate tilpasset CSS basert på en rekke forhold-forhold, bredder, skjermtype, men fokuserer vanligvis rundt en minstebredde og max bredde til

  • endre størrelse på overskrifter og tekst for å være mer passende for enheter
  • Stakk elementer i stedet for å flyte hvor det er nødvendig
  • endre bredden på rutenettet

Se opp for en hel praktisk serie dedikert til undervisning om hvordan du bygger et responsivt webdesign ved hjelp av dette bestemte rammeverket

Hvorfor er RWD viktig?

Så langt i diskusjonen vår har vi funnet ut at en viktig ting om en responsiv nettside er at nettstedet kan tilpasses til hvilken som helst skjermstørrelse eller orientering når en bruker ser på nettstedet. Bortsett fra det, er det andre viktige grunner til at du bør bytte til en responsiv nettside

Økning i mobilbruk

I dag har et betydelig antall personer tilgang til mobiltelefoner. Dette betyr at mange av disse personene får tilgang til Internett via telefoner. Statistikk viser at i dag kommer nesten 20% av Google-søkene fra mobiltelefoner - dette bør fortelle deg hvor viktig det er for brukerne å kunne få tilgang til nettstedet ditt og samhandle med det enkelt. 

Ettersom mobilt Internett-bruk overskrider datamaskinens brukestatistikk, må vi sørge for at brukerne kan identifisere seg med våre nettsteder uansett hvilke enheter de bruker uten å føle at de har tilgang til en annen eller begrenset versjon av hovedsiden.

Sterkt øke konverteringsfrekvensen 

Konverteringsfrekvens er et begrep som hovedsakelig brukes i eCommerce-nettsteder, det refererer til hvor du kommer til å slå en vanlig web besøkende til betalende kunde. I et typisk tilfelle av en e-handelsløsning, tenk på hvor mange folk handler på mobiltelefonene sine.

Hvis en vanlig nettbruker blir tvunget til å bruke en stasjonær versjon av nettstedet ditt for å gjøre en enkel kasse, er sjansene høye at de definitivt vil velge å bruke andre måter å kjøpe det samme produktet på. Med et godt utformet responsivt nettsted, bør brukerne ikke merke forskjellen når de handler på nettstedet ditt, bortsett fra at de bruker en mindre skjerm.

Bedre rangering i søkemotorer

En søkemotor som Google taler åpenbart for responsivt webdesign av flere grunner:

  1. Det er mye lettere å gjennomgå en responsiv nettside, indeksere den, og organisere innholdet på webområdet på en enklere måte. Dette er gjort mulig ved at en responsiv nettside bruker bare en nettadresse på tvers av alle plattformer i motsetning til i et scenario der det finnes forskjellige versjoner av det samme nettstedet på tvers av forskjellige nettadresser.
  2. Brukeropplevelse kan enkelt vurderes ved å se på studsfrekvensen på et nettsted. Et nettsted som har lav avvisningshastighet, betyr at brukerne holder seg på den i en periode, og dermed høyere søkerrangering.

Kostnadseffektiv

Å kjøre flere av nettsteder for det samme innholdet kan være dyrt, du trenger dobbelt ressurser for å kunne opprettholde de to nettstedene. Å ha en responsiv nettside er mye enklere, da du vil kunne dedikere all ressurser og tid til å gi brukerne det de egentlig forventer.

Betraktninger for en Responsive WordPress Site

Det er stille en rekke hensyn som man må gjøre før du kommer opp med et responsivt webdesign i WordPress. Faktum er at WordPress nå blir brukt til å bygge blogger, nettsteder, en jevn applikasjon som alle vil trolig trenge en responsiv implementering.

I neste innlegg ser vi på en implementeringsstrategi for hvordan du oppnår dette i WordPress-utviklingen. Spesielt vil vi dekke

  1. Opptreden
  2. Kontekst
  3. Progressive forbedringer

Å se disse tre kritiske faktorene krever og grundig analyse for å vise frem til hvorfor responsiv design handler ikke bare om design og hvor nøyaktig WordPress kommer i ligningen.

Sammendrag

I denne artikkelen har vi kort introdusert begrepet responsivt webdesign, definert hva det er, hvorfor det er viktig, og hvorfor vi bør vurdere det i våre fremtidige prosjekter.

Ta gjerne spørsmål eller kommentarer nedenfor!