Responsive webdesign - wat is het en wat hebben verzekeraars eraan

responsive
webdesign:
wat is het en wat
hebben verzekeraars
eraan?

responsive webdesign: wat is het en wat hebben verzekeraars eraan?

91% van de volwassenen heeft 24/7
hun mobiele telefoon binnen
handbereik.

Morgan Stanley, 2007


in 2012 werd 48% van de
nederlandse verzekeringen
online afgesloten. hiervan
werd nog steeds 95%
afgesloten via een laptop of
desktop.

onderzoeksbureau Gfk, 2012


25% van de amerikanen gebruikt alleen
een smartphone om het internet op te
gaan.

http://www.gomonews.com/mobile-web-growth-1-in-5-internet-users-dont-use-a-computer/


in 2012 werden er 122.8 miljoen
tablets verkocht. in 2013 zullen
dat er ruim 172 miljoen zijn.

http://techcrunch.com/2012/12/05/idc-raises-tablet-forecast-for-2012-and-onward-122-3m-by-year-end-172-4m-by-2013-android-gains-ereaders-lose/


we leven in een
multi-device wereld!


en we gebruiken al deze
devices naast elkaar.
• ondanks dat we een voorkeur hebben voor bepaalde
schermformaten, gebruiken we ook vaak het device dat
simpelweg het dichtste bij ligt …
34% van de gebruikers pakt het
device wat het dichtste bij ligt als ze
op zoek zijn naar informatie.*

• en we wisselen gedurende een online aankoop of transactie
steeds vaker van device.
67% start een online aankoop of
transactie op één device en rond
het af op een ander device.*

* Volgens Google’s ‘The New Multi-screen World, Understanding Cross-platform Consumer Behaviour’


met allerlei
verschillende schermformaten.
• we weten dus niet welk device iemand gebruikt om aan zijn
informatiebehoefte te voldoen.


en daar moet webdesign
mee om kunnen gaan.

de vraag is
hoe ?
(het antwoord: responsive webdesign)


geen technologie,
maar filosofie.
• responsive webdesign is geen technologie maar een filosofie.
• kort gezegd gebruikt responsive design een flexible (fluid) grid
waar elementen op verschillende plaatsen neergezet kunnen
worden.
• responsive webdesign is dus webdesign voor alle
schermformaten.

“
met andere woorden: een
flexibel raster met flexibele
afbeeldingen die gebruik maken
van media queries om
daarmee automatisch aan te
passen en te reageren op het
formaat van een scherm.

- Ethan Marcotte

”

maak de
content flexibel.
• door de content flexibel te maken (en dus gebruik te maken
van percentages ipv vaste waarden), kun je per schermformaat
een indeling bepalen.
• ook lettertypen en afbeeldingen bewegen mee met de flexibele
indeling.


aangestuurd
door media queries.
• het schermformaat van de
gebruiker wordt herkend door
media queries waardoor de juiste
content op de juiste manier
getoond wordt.
voorbeelden van media queries voor het bepalen van de stylesheet voor
mobile (max 320 pixels) en desktop (min 940 pixels):

<link rel = “stylesheet”
media = “screen and (max-width: 320px)”
href=“mobile.css” />

<link rel = “stylesheet”
media = “screen and (min-width: 940px)”
href=“desktop.css” />


het resultaat:
één website.
• door dezelfde content device agnostic te tonen kan de website
alle apparaten aan.
• er is dus geen noodzaak meer voor meerdere (mobiele)
websites en/of apps die allemaal apart onderhouden dienen te
worden.


maar wel …
mobile first!
• bepaal de inhoud op basis van je mobiele doelgroep.
vervolgens kan er voor grotere schermformaten meer context
en functionaliteit aan de inhoud gegeven worden.


wat zijn de voor-
en nadelen van
responsive
webdesign?


als eerste de
nadelen.
• performance: de website wordt trager.
• omdat alle functionaliteit, afbeeldingen, etc. van je volledige
website op elk device wordt ingeladen kan de performance
(< 3G) van mobile devices onvoldoende zijn.

• verouderde browsers ondersteunen de techniek niet.
• wel: Internet Explorer 9+, Opera 9.5+, Opera Mobile, Safari 3+,
Firefox 3.5+ en Chrome.
• en dus niet door Internet Explorer 6, 7 en 8, Safari 2 en Firefox 1
en 2.


maar de
voordelen zijn groter. (1)
• de website wordt automatisch aangepast aan alle
schermformaten.
• er komt een steeds grotere diversiteit aan schermenformaten op
de markt. hierdoor wordt het onmogelijk om specifieke websites
of apps voor elk schermformaat te ontwikkelen.

• je bent platform onafhankelijk.
• je hoeft geen aparte apps meer te maken die werken onder de
verschillende browsers en (mobiele) besturingssystemen.

• er wordt maar één website ontwikkeld, zonder een aparte
mobiele versie.
• het is met een responsive website niet meer nodig om aparte
mobiele websites in de lucht te houden en aan te passen.


maar de
voordelen zijn groter. (2)
• via responsive webdesign heeft de gebruiker altijd de beste
beleving.
• gebruikers hoeven niet meer te dubbelklikken op het scherm of
in te zoomen om de teksten te lezen. ook wordt hiermee het
scrollen in de breedte beperkt.

• het is gemakkelijker de content te onderhouden.
• alle teksten en afbeeldingen kunnen vanuit één content
management systeem onderhouden worden.


even testen: hoe
responsive zijn
verzekeraars?


even testen…
traditionele verzekeraars.


  maart 2013

even testen…
online schadeverzekeraars.


  maart 2013

even testen…
zorgverzekeraars.


  maart 2013

de meeste verzekeraars
zijn (nog) niet responsive.
 Aegon
 Menzis
 BeFrank (logo en menu)  (content)
 AllSecur
 ASR
 Centraal Beheer Achmea
 CZ
 De Goudse Verzekeringen
 Delta Lloyd
 Ditzo
 Inshared
 Nationale Nederlanden
 Ohra
 VGZ
 Zwitserleven
maart 2013


verzekeraars zijn
dus niet responsive.
maar is dat erg?

verzekeraars zijn
mobiel aanwezig.
• 58% van de verzekeraars is actief op mobiel.*

52% van de verzekeraars
heeft een smartphone app.*

20% van de verzekeraars
12% van de verzekeraars heeft een aparte mobiele
heeft een tablet app.* website.*

* Volgens de ‘Social Media Monitor 2012’ van ITDS.


maar zijn vaak ook
nog bewust onbekwaam.
• verzekeraars blijven achter bij het inzetten van mobiele
websites.*
• een echte strategie voor mobiel internet die ingebed is in het
bedrijfsbeleid is bij nog geen verzekeraar aanwezig.*
• veel apps zijn gebaseerd op één of enkele devices (of
besturingssysteem) en hebben dus een beperkte
doelgroep.
• de samenhang tussen de algemene website, mobiele
website, smartphone app(s) en tablet app(s) ontbreekt vaak.

* Volgens de ‘Social Media Monitor 2012’ van ITDS.


doel: de klant in alle fasen device
agnostic kunnen ondersteunen.
• met een responsive webdesign kan een verzekeraar op alle
devices contact met zijn klant hebben.
• de klant bepaald gedurende alle fasen welk device daar het
beste bij past. de klant zal ook switchen tussen devices
gedurende de fasen.

smartphone smartphone
tablet

laptop / desktop

dienst-
bewustwording oriënteren kopen gebruiken
verlening

voorkomen genezen
(informatie over voorkomen van risico’s, premieberekeningen, naamsbekendheid) (definitieve aankoop, claimafhandeling, directe contactmomenten)


maar de klant verwacht niet
alle functionaliteit op elk device.
• door middel van persona’s (voor wie is de website bedoeld)
en customer journeys (welke functionaliteit is op een bepaald
moment in een bepaalde context relevant) bepaal je de
content.


een device agnostic
website + goede
customer journeys
bepalen de online
klanttevredenheid!

DOOR:
Kristian Wijnen, Senior Consultant bij ITDS.
(k.wijnen@itds.nl)

© 2013 - ITDS Groep B.V. Niets uit deze uitgave mag worden vermenigvuldigd en/of op andere wijze openbaar gemaakt worden door middel van druk,
fotokopie, microfilm of anderszins, zonder voorafgaande schriftelijke toestemming van de auteursrechthebbende, i.c. ITDS Groep B.V. te Naarden. Dit is
ook van toepassing op gehele of gedeeltelijke bewerking.

OVER ITDS: ITDS is een gespecialiseerd adviesbureau voor financiële instellingen: banken, verzekeraars en pensioenfondsen. De unieke meerwaarde
van ITDS is de dubbele deskundigheid: kennis van de producten en processen in de branche, gekoppeld aan kennis van de informatietechnologie.
Onze dienstverlening beslaat daarom het totale traject van strategie naar een werkende oplossing. Strategisch denken wordt gecombineerd met
praktische ervaring.

ITDS Groep BV, Gooimeer 4-20,
1411 DC Naarden, www.itds.com


Responsive webdesign - wat is het en wat hebben verzekeraars eraan

Recomendados

Recomendados

Mais conteúdo relacionado

Semelhante a Responsive webdesign - wat is het en wat hebben verzekeraars eraan

Semelhante a Responsive webdesign - wat is het en wat hebben verzekeraars eraan (20)

Responsive webdesign - wat is het en wat hebben verzekeraars eraan