Ingrid Nese Veen sitt foredrag på kundeseminaret "Det du trenger er en app?"

1. Responsivt webdesign
Av Ingrid Nese Veen

2. Mer enn halvparten
av alle datamaskiner er ikke
datamaskiner lenger

3. Mobile enheter vil stå for
over halvparten av all internettrafikk
i løpet av de neste årene.

4. Mobil er uten tvil
den neste store
dataplattformen

5. ?
Hva skal man støtte?
iOS? Android?
Microsoft? Nettleser?
…?

6. ?
Hva med de man ikke
velger å støtte?

7. App vs. Nettinnhold
Utviklet for en spesifikk Kan åpnes på en hvilken som
enhet, kjører lokalt. helst enhet med nettleser.

8. Ulemper med apper / Fordeler med nettinnhold
•Apper er kun tilgjengelig på plattformen den er utviklet for.
/ Nettinnhold er tilgjengelig på alle enheter som har en nettleser.
•Bruk av apper krever mye fragmentering.
/ Nettinnhold krever mindre fragmentering.
•Innholdet vil ikke kunne være søkbart gjennom søkemotorer.
/ Nettinnhold laget med webstandarder er søkbart.
•Lenker til nettsider åpnes i en annen app (nettleser). Kan være
forvirrende.

9. Fordeler med apper / Ulemper med nettinnhold
•App kan kombinere innebygde UI-element med nettinnhold.
/ Nettinnhold i seg selv kan kun benytte de API’ene som er
tilgjengelig gjennom nettleseren.

11. Tilgang til app vs. nettinnhold

12. Tilpasset nettinnhold vil
uansett
være nødvendig.

13. JA,
apper kan i noen tilfeller være beste løsning.
Dersom man trenger funksjoner som nettleseren ikke støtter (Eks:
Kamera, kompass, etc.)
Dersom man skal lage programvare eller spill som skal utnytte
mulighetene og funksjonene til enheten.

14. Men,
i de fleste tilfeller vil nettinnhold være den mest
optimale og rimeligste løsningen for de fleste
nettsteder.

15. Så,
hvordan skal man tilpasse nettinnholdet
for mobile enheter?

16. ” Vi trenger en mobil nettside!
”

17. http://m.tekna.no/
Separate mobile nettsider:
m.nettadresse.com
mobil.nettadresse.com
”Vis fullversjon”

18. Mobil-bruker Desktop-bruker
-Har det travelt -Har god tid
-Har treg internettforbindelse -Har god internettforbindelse
-Kun interessert i raske interaksjoner -Er interessert i fullversjonen
av nettsiden

19. 41 prosent bruker nettbrett mens
de ser på TV.
38 prosent bruker mobiltelefon
(smarttelefon) mens de ser på TV.
(Kilde: Yahoo News, des 2012)

20. Brukere med mobile enheter er
altså IKKE alltid mobile.

21. http://m.tekna.no/ http://tekna.no/

22. ?
Hva med nettbrett?
Hva med nye enheter med ukjente
skjermstørrelser?

23. ?
Spørsmålet er:
Hvordan kan man levere
en god nettopplevelse som
når alle mennesker
uavhengig av hvilken
enhet de har?

24. Apper vil ikke være et
tilfredsstillende svar på alle behov
som finnes i dag.
:(

25. Men det finnes andre
alternativer!
:)

26. Løsningen er å benytte
!
Responsive webdesign-teknikker
når nettinnhold skal
optimaliseres.

27. Responsivt webdesign
En tilnærming med fokus på at nettsidens
utseende skal reagere på brukerens atferd
og miljø basert på skjermstørrelse, plattform
og orientering (landskap/portrett).

28. Kun en nettside å oppdatere!

29. Ingen problem å dele lenker
Ingen problemer med søkemotorer

30. Layouten tilpasser seg
hvilken som helst
skjermstørrelse!

31. Ved bruk av responsivt webdesign-tilnærmingen
tilpasses CSS-filene slik at nettsiden passer hver
enkelt skjermoppløsning og i ulike visningsmodus
(horisontalt og vertikalt).
Med andre ord:
Nettsiden skal automatisk svare
på brukerens innstillinger.

40. Små skjermer først!
Responsivt webdesign fungerer best dersom det
bygges nedenfra og opp – altså for mobiltelefoner
først. Man fyller deretter på med mer design og
funksjonalitet for større skjermer.

41. Lages mobilløsningene først, får man et
sluttresultat som har alle
nøkkelfunksjonene på plass, rensket for
omveier og grensesnittrusk.

42. Har det noen
forretningsverdi
?

43. Eksempel!

44. Resultat
• Transaksjoner på iPhone ble mer
enn doblet.
• Transaksjoner på Android ble mer
enn firedoblet.

45. Oppsummering:
•Responsivt webdesign = Trygg framtid
Det er den eneste gunstige løsningen for
innholdsbaserte nettsider.
•Tenk mobiltelefoner først
Det vil redusere utviklingstiden
•Keep it simple!
Gjør det så enkelt som mulig for brukeren.