Responsive online design - Robert van den Hanenberg

Effectieve websites op alle apparaten Responsive design

Even voorstellen

Online consultant

3

HAVE A NICE DAY Just ask friday

•  Door ontwikkeling toepassingen •  Door ontwikkeling technologie

Responsive design het internet leeft

4


Responsive design ontwikkeling technologie

PC 1920px

Laptop Tablet Smartphone 320px

5


explosieve groei Mobiel internet verkeer

6


3 op de 4 mensen in Nederland heeft een smartphone. 1 op de 2 een tablet.

7


Een gemiddelde Nederlander kijkt zo’n 150x per dag op zijn mobiel.

8


Het aandeel van mobiel in het zoekverkeer groeit hard: van 30% naar 40% het afgelopen jaar.

9


Google: 50% van alle retailgerelateerde zoekopdrachten afgelopen feestdagen van smartphones afkomstig.

10


Meer dan 60% van alle e-mails wordt geopend op smartphones.

11


“Het is niet de sterkste soort die overleeft, noch de meest

intelligente.

Het is degene die zich het beste kan aanpassen.”

Charles Darwin

12


Responsive design Google & responsiveness

13

Responsive design hoe kunnen we reageren op de toename van mobiel internetgebruik

APP Mobiele website

vs

vs Responsive design

14


Responsive design wat is responsive design?

•  Een website die zich aanpast aan het beeldscherm van het apparaat.

15


Responsive design wat is responsive design?

•  Een website die zich aanpast aan het beeldscherm van het apparaat.

•  Een website die inspeelt op de specifieke behoeftes per apparaat. (adaptive design)

16


Responsive design hoe werkt responsive design?

1920 px 320px

17


Responsive design waarom responsive design?

1 2 3 4

•  De behoefte van een bezoeker op desktop is anders dan de behoefte van de bezoeker op mobiel toestel

•  Tijdens de klantreis worden er steeds vaker verschillende devices gebruikt.

•  Een goede gebruikerservaring heeft positieve impact op de conversie.

Een positieve gebruikerservaring is essentieel

5

18



5 1 2 3 4 5

•  2/3 van alle Facebook-bezoeken komen van

Social media zorgt voor een toename van mobiele bezoekers

19



5 1 2 3 4 5

•  Slechts één website •  Het maakt de content beter deelbaar •  Effectief beheer van de content

Een Responsive website is zeer zoekmachinevriendelijk

20



5 1 2 3 4 5

Een snelle website is van groot belang

21



5 1 2 3 4 5

Voorbereid op toekomstige apparaten

•  Meer dan enkel een reactie op mobiel gebruik

VOORBEELDEN responsive design

23


Responsive design niet responsive

Appel.nl

24



Appel.nl

25



Kurage.nl

26


Responsive design wel responsive

Rijksmuseum.nl

27



alphabetoccasions.nl

28



29



Regionale omroepen

30


Responsive design voordelen responsive design samengevat

•  Een positieve gebruikerservaring •  Voorbereid op toenemend mobiel bezoek vanuit Social Media •  Is zoekmachinevriendelijk •  Een snelle website op alle apparaten •  Voorbereid op toekomstige apparaten

31


Responsive design ons advies

Ken je doelgroep (wat betekent een effectieve en gebruiksvriendelijke website voor hen?) •  Verplaats je in de klant en maak de klantreis (of klantreizen). •  Bekijk de statistieken van de huidige website.

32


Responsive design Handige links

Responsive check https://www.google.com/webmasters/tools/mobile-friendly/?utm_source=wmc-blog&utm_medium=referral&utm_campaign=mobile-friendly Of http://ami.responsivedesign.is/

Google speed check https://developers.google.com/speed/pagespeed/insights/

Bedankt Voor jullie aandacht

33

Vragen

Responsive online design - Robert van den Hanenberg

Internet

apparaten responsive

voorbeelden responsive

responsive website

adaptive design

de toename

de klantreis

de conversie

de behoefte van de bezoeker