Online23.08.2012

Wirwar aan schermen noopt webdesigner tot kundige creativiteit [Infographic]


wirwar-aan-schermen-noopt-webdesigner-to.jpg
wirwar-aan-schermen-noopt-webdesigner-to.jpg

Tegenwoordig moet een webdesigner rekening houden met uiteenlopende bezoekers en gebruikers. Aan de ene kant van het spectrum bevindt zich de gebruiker die nog werkt met een acht jaar oud scherm. Aan de andere kant staat de gebruiker die thuis op de bank zijn tablet gebruikt om een website te bezoeken.

Webdesign in moderne schermenjungle stelt dus fikse eisen. Meer dan de helft van de mobiele internetter surft vandaag de dag thuis vanaf de bank. Het gebruik van mobiel internet is allang niet meer alleen voor de laatste vertrektijden van treinen. Tegelijkertijd bekijkt ongeveer 5% van de mensen nog steeds op een website met een 1024 x 768 scherm. Dit betekent dat ze waarschijnlijk een 15” of 17” monitor gebruiken die vaak al een jaar of 8, zo niet meer, oud zijn. De vraag is, hoe krijgen al deze gebruikers op hun verschillende schermen toch dezelfde mogelijkheden?

Gelukkig is er hardware ontwikkeld die juist rekening houdt met de huidige websites in plaats van andersom. Zo heeft Apple met de ontwikkeling van de iPhone en de iPad het mobiele internet sterk laten opgekomen. De eerste iPad heeft een XGA-resolutie van 1024 x 768. Dat komt wel heel erg goed uit, want nu kunnen alle sites die we over de afgelopen jaren hebben gemaakt zonder Flash of hele kleine links, goed gebruikt worden op een iPad.

Dit ging allemaal prima totdat Apple bedacht dat de gebruiker meer pixels nodig heeft. Een goed industrieel ontwerper weet tenslotte dat je dingen moet verdubbelen om te innoveren.

Zo heeft de derde generatie iPad een resolutie van 2048 x 1536 pixels, dat zijn er vier keer zoveel als de eerste en tweede generatie. Hierop zijn alle “960-websites” nog steeds te zien, maar lijkt alles wel van een lagere kwaliteit omdat de ontbrekende pixels erbij bedacht moeten worden door de iPad zelf. Ditzelfde geldt voor de iPhone. Was de eerste iPhone nog beperkt tot 480 x 320 pixels, de vierde versie heeft maar liefst 960 x 640 pixels. Om nog maar te zwijgen over de mogelijkheid om een website zowel in portrait als landscape mode te bekijken. Om dit alles helemaal ingewikkeld te maken, heeft Apple hetzelfde trucje nog een keer uitgehaald op de MacBook Pro met een ongelooflijke 2880 x 1800 pixels. Dat zijn er meer dan bijvoorbeeld een 37″ plasma TV, samengepropt op een 15″ laptop.

We weten dat sites gemiddeld ongeveer evenveel bezoekers krijgen vanaf mobiel als vanaf een PC met een schermresolutie van 1024 x 768 pixels. Het aantal mobiele bezoekers stijgt echter alleen maar en kan niet genegeerd worden. Daarom moeten vanaf nu sites ontwikkeld worden die het zowel goed doen op een iPhone 3G met een resolutie van 480 x 320 pixels als opde nieuwste MacBook Pro met een resolutie van 2880 x 1800 pixels. En hoewel we voor deze verschillende resoluties voorheen gebruik maakten van wisselende gebruikerscenario’s, is dat tegenwoordig ook niet meer vanzelfsprekend. Mobiel internet wordt steeds vaker gebruikt, ook in niet-mobiele situaties en dan is de behoefte aan informatie niet anders dan op een desktop.

De vraag, hoe deze verschillende gebruikers, op verschillende schermen, dezelfde functionaliteit te bieden, kent meerdere antwoorden.

1) Er is een bestaande website, maar de markt moet volledig bediend worden. Het is een goede optie om de site uit te breiden met een mobiele site. Hierbij kan met het design goed rekening gehouden worden met de resolutie, snelheid en de input methode die horen bij smartphones.

2) Er is nog geen site of er is een site die toe is aan vervanging. Dan is een responsive website mogelijk het antwoord. Een responsive website is een site die zich aan alle mogelijke resoluties en gebruikerscenario’s aanpast. Dit gebeurt door gebruik te maken van CCS media queries die het mogelijk maken om de resolutie van de browser op te vragen.

3) De laatste optie om meerdere devices te ondersteunen, is het gebruik van apps. Het is mogelijk om voor de iPhone, Android, Blackberry en Windows phone apps te maken naast een gewone of responsive website om ook de desktop gebruikers niet te vergeten.

responsive-design.jpg
responsive-design.jpg

[Groot formaat]

Bijdrage via: Lasse Licht, Interaction Designer bij full service internetbureau TriMM.

...

Verder lezen over Infographic

Infographic: 25 dagen EA Sports FC 25

Electronic Arts heeft onthuld hoe fans wereldwijd aan de slag zijn gegaan met EA Sports FC 25, vanaf de vroege toegang tot en met de eerste 25 dagen na de wereldwijde release op 27 september. Een wereldwijde community van spelers uit meer dan 200 landen heeft samen inmiddels al ruim 1,7 miljard wedstrijden gespeeld in alle beschikbare modi en tot nu toe een indrukwekkend totaal van 4,3 miljard doelpunten gescoord.

Gaming31.10.2024

Infographic: 25 dagen EA Sports FC 25

De voordelen van visuele content in e-learning

Visuele content is cruciaal in e-learning om de betrokkenheid van de leerlingen te verhogen. Afbeeldingen, video's, infographics en animaties trekken de aandacht en kunnen helpen om complexe informatie op een begrijpelijke en aantrekkelijke manier over te brengen.

DC Business13.06.2024

De voordelen van visuele content in e-learning

​Virtual twins: nieuwe troef voor klinische studies?

Tijdens de zoektocht naar geschikte COVID-19-vaccins werden klinische studies onder allesbehalve ideale omstandigheden uitgevoerd. Virtual twin-technologie bleek een waardevol hulpmiddel, met een grote potentie voor de t...

DC Business07.10.2021

​Virtual twins: nieuwe troef voor klinische studies?

10 banen die 10 jaar geleden nog niet bestonden [Infographic]

Fiverr werd in 2010 opgericht in Tel Aviv, Israël. Het bedrijf biedt een platform voor freelancers om diensten aan klanten wereldwijd aan te bieden. Dit jaar bestaan ze dus 10 jaar. En dus hebben ze een lijstje gemaakt...

Vacatures26.02.2020

10 banen die 10 jaar geleden nog niet bestonden [Infographic]

Social Media Cheat Sheet voor 2020

2020 komt steeds dichterbij. Dat betekent dat het weer tijd is voor een nieuw social media cheat sheet. Social media platforms blijven eigenlijk constant de bestandsformaten en afmetingen van afbeeldingen veranderen. Daa...

Social Media10.12.2019

Social Media Cheat Sheet voor 2020

[Infographic] Segmentatie versus Personalisatie

De termen segmentatie en personalisatie worden vaak in één adem genoemd. Toch zijn ze niet hetzelfde. De termen staan voor twee verschillende en bijzonder effectieve manieren in je marketingaanpak. Maar wat is precies...

E-mail25.02.2019

[Infographic] Segmentatie versus Personalisatie

advertorial
Wat ligt er voor jou onder de kerstboom?

Nederlanders kopen tijdens deze periode voor de feestdagen weer massaal hun kerstcadeaus online. Het is een cijfer dat ieder jaar weer blijft toenemen. En de verwachting is dat dit de komende jaren door blijft zetten. Zo...

Online23.12.2018

Wat ligt er voor jou onder de kerstboom?

Nederland gaat voor keuzevrijheid
Het Social Media Cheat Sheet voor 2019

Met een nieuw jaar voor de deur, is het ook weer tijd voor een nieuw social media cheat sheet. De verschillende social media platformen blijven de afmetingen en bestandsformaten van afbeeldingen veranderen. Tijd dus voor...

Social Media11.12.2018

Het Social Media Cheat Sheet voor 2019