Menu

Responsive design

Jan Lammert 25 mei 2012

Zo langzamerhand durf ik wel te beweren dat responsive design hot is. In gesprekken met klanten merk ik dat er steeds meer vragen over worden gesteld. Ook op de Nederlandse, bekendere marketingweblogs wordt veel over dit onderwerp geschreven. Terecht? Ik vind van wel. Anderzijds schuurt het begrip ‘responsive design’ bijna tegen een hype aan. En waar een hype is, is ook veel lucht. In dit artikel vertel ik meer over responsive design bekeken vanuit het oogpunt van de ontwikkelaar. Nuchter, duidelijk en met een aantal goede tips.

Wat is responsive design?

Deze week was het weer raak. Van 3 gerespecteerde, grote partijen kreeg ik een briefing binnen met daarin een uitgebreide projectomschrijving en een programma van eisen. Eén van de eisen was dat de website responsive moest zijn. Dat was het, verder geen toelichting of uitleg. Voor mij is het dan gissen wat men nu echt wil. De definitie van responsive design kan redelijk eenvoudig zijn: Een website die zich aanpast op de gebruiker. De praktijk is echter weerbarstiger. Wat past zich namelijk aan en waarop? Noem je een website die meeschaalt ook al responsive en is een App ook een vorm van responsive design? Ethan Marcotte, een belangrijk auteur over dit onderwerp, definieert responsive design aan de hand van een aantal technische specificaties:

  • Identificatie. De website beschikt over de mogelijkheid om de bezoeker en haar technische gegevens te identificeren.
  • Flexibele media: Het maakt niet uit met wat of in welke resolutie je een website bekijkt, de afbeeldingen moeten meeschalen.
  • Flexibele grafische structuur: Grafische elementen en de structuur van de website passen zich aan. Dit kan bijvoorbeeld in de praktijk betekenen dat bij een grote resolutie de website te zien is in 3 kolommen en bij een kleine resolutie in 2 kolommen.

Persoonlijk vind ik dat aan de hand van bovenstaande definitie het begrip responsive design al een stuk duidelijker wordt gedefinieerd. Er blijft echter genoeg ruimte over om verwarring te creëren. Soms wordt namelijk ook verwacht dat bepaalde content in kleine resoluties achterwege blijft of dat een menustructuur eenvoudiger wordt gemaakt. Mijn tip zou daarom zijn om altijd duidelijk te communiceren naar de ontwikkelaar wat jouw verwachtingen zijn van responsive design.

Waarom responsive design?

Hoewel ik soms sceptisch ben over hoe mensen het begrip responsive design hanteren ben ik wel voorstander van het gebruik van responsive design. Dit past namelijk naadloos bij de visie van Pronamic: Mensen optimaal van het web laten genieten. De tijd dat mensen alleen via een computer een website bekeken is definitief verleden tijd. De helft van de Nederlanders beschikt momenteel over mobiel internet. Daarnaast zal het gebruik van internet via tablets, de TV of notebooks alleen maar toenemen de komende jaren. Een goede website moet op deze ontwikkelingen voorbereid zijn.

Hoe maak ik een responsive design?

Deze vraag is eenvoudig te beantwoorden, het enige wat je moet doen is contact opnemen met Pronamic. Wij kennen de technische vereisten om een website responsive te maken. Dat is echter niet het enige wat je moet doen. Een website responsive maken betekent vaak ook bij kleine resoluties dat je keuzes moet maken. Wat vind ik belangrijk en welke content wil ik de bezoeker per se laten zien? Stel een aantal taken op die volgens jou de bezoeker, die via dat platform binnenkomt, moet kunnen voltooien. Richt daar je website op in en laat vervolgens onnodige tekst en menu items weg. Een dergelijk ontwerpproces wordt ook wel ontwerpen vanuit de content genoemd.

Nog meer willen weten over responsive design?

De ontwikkelingen op het gebied van responsive design volgen elkaar snel op en Pronamic kan er nog veel meer over vertellen. Nieuwsgierig? Neem dan vrijblijvend contact op en wij praten je graag bij.

1 reactie

  1. Goed artikel!

    Vaak wordt er ook te laat over nagedacht waardoor het weer moeilijker wordt om de website responsive te maken. Je moet tijdens het ontwerpproces al rekening mee houden om het vervolgens technisch goed te implementeren.

    Ik vind de website van https://www.smashingmagazine.com/ als het gaat om responsive webdesign echt super en gebruik https://mediaqueri.es/ voor inspiratie.

Altijd op de hoogte blijven?