We are a 3-in-1 agency

Zittend internetten achter je computer behoort tot het verleden. Door de komst van de smartphone, tablet, en netbook worden websites tegenwoordig zowel op grote als kleine devices (apparaten) bekeken. Als hier bij de ontwikkeling van de website niet al meteen rekening mee wordt gehouden, kan er later een negatieve gebruikerservaring bij de bezoeker ontstaan. Gelukkig zijn er knappe koppen die hiervoor dé oplossing hebben bedacht: Responsive webdesign.

Responsive wat?

Mobiel internet groeit sneller dan dat op de desktop het geval is. Het is slechts een kwestie van tijd tot dat mobiel internet de wereld heeft veroverd. Een website ontwerpen voor alleen de grotere schermen is verleden tijd… Bij hedendaags webdesign is het erg belangrijk dat er ook wordt nagedacht over het gedrag van de website bij gebruik van andere resoluties.

Responsive webdesign optimaliseert een website naar één versie voor verschillende devices zoals smartphones, tablets en desktops. De website past zich automatisch aan op de grootte van het scherm, zonder dat er cruciale functionaliteiten of content verloren gaat. Door een flexibele indeling, schaalbare afbeeldingen en media-tools als CSS3 en HTML 5 is de ervaring van de gebruiker altijd optimaal, ongeacht het device waarop de website bezocht wordt.

Het verschil tussen een gewone website en een responsive website is het gebruik van flexibele grids. De inhoud van de website wordt namelijk op basis van percentages ingedeeld en niet met vaste pixels zoals tot nu toe het geval was. Hierdoor wordt het mogelijk om de website te vergroten of verkleinen naar elke mogelijke resolutie.

Zonder verlies van kwaliteit.

Het ontwerptraject:
Begin met de mobiele versie van de website.

Handig! Één website geschikt voor alle devices… Maar dit is van grote invloed op het ontwerptraject van een responsive website. Waar webdesigners eerder nog wegkwamen met één ontwerp van elke pagina, zullen er nu meerdere ontwerpen moeten worden gemaakt. Hoe ziet de website eruit op een 27″ desktop monitor, op een iPhone, een iPad, een Netbook, widescreen laptop enz.?

Het traject van ontwerp tot launch van een responsive website kan door verschillende methoden gerealiseerd worden. Hieronder beschrijven we in het kort de meest gebruikte methode;

Mobile first

De website wordt als eerste ontworpen voor een mobile device, daarna wordt de website geoptimaliseerd voor andere devices en resoluties. Bij het ontwerp voor een mobile device is de beschikbare ruimte beperkt. Hierdoor wordt de webdesigner gedwongen om in zijn of haar creativiteit tot het uiterste te gaan.

‘Elk voordeel heb z’n nadeel’

Zoals je kunt lezen, heeft een responsive website zijn voordelen. Maar uiteraard zitten er ook wat addertjes onder het gras. De code die geschreven moet worden is lang. Hierdoor duurt het laden van de website op een mobiele internetverbinding langer dan op een vaste internetverbinding en kost dit het mobile device meer rekenkracht. Daarnaast ondersteunen veel verouderde browsers deze techniek niet.

Daar tegenover staat het weinig benodigde onderhoud in functionaliteit en content. Als er een nieuwe iPad gelanceerd wordt, met een hogere resolutie, zal de responsive website altijd goed worden getoond. De site wordt namelijk automatisch geschaald en er hoeft dus geen nieuwe versie gemaakt te worden.

Conclusie

Responsive webdesign is dus niet dé oplossing voor webdesign, maar kan worden gezien als een grote stap richting websites geschikt voor alle devices en resoluties. Omdat een responsive website maar één versie heeft, kan er voor de mobiele versies geen functionaliteit geintegreerd worden die juist daarvoor uitermate geschikt is. Onze vraag is dus aan u: wilt u één website die geschikt voor alle devices en resoluties, of wilt u een losse mobiele versie die gebruik maakt van de extra functionaliteiten die een mobile device biedt?

Ook zin om daarover met onze web- en usability guru’s te brainstormen? Wij zetten de koffie alvast klaar!