Designers, techneuten en andere professionals in 'onze business' lopen tegen veel nieuwe trends en ontwikkelingen aan. De bijbehorende (web)terminologie is daardoor altijd in ontwikkeling en wordt steeds weer verder uitgebreid. Zo zijn naast responsive webdesign, ook mobile first en content first veel gebruikte termen. Hieronder sta ik kort stil bij het verschil tussen deze begrippen en ga ik vooral dieper in op content first, onze persoonlijke favoriet uit dit rijtje van 3. 

Responsive webdesign

Inmiddels weten we dat het vandaag de dag erg belangrijk is dat websites zich aanpassen aan de schermresolutie van de gebruiker en dus responsive zijn. Responsive webdesign is niet meer een leuk extraatje, maar een must! 

Wat is responsive webdesign ook alweer? 

In feite is een responsive website niets meer of minder dan de gewone website die, op basis van de afmetingen van het scherm waarmee die benaderd wordt, de content aanpast. Bij een klein formaat scherm past hij die content zo aan dat de website als geheel alsnog goed leesbaar en bruikbaar blijft. Ook hier wordt daarom vaak besloten bepaalde teksten, pagina’s of features niet te tonen als je de website met een smartphone of tablet benadert. 

op basis van de afmetingen van het scherm de content aanpast | Occhio Amsterdam


Mobile first

Vanwege het verder toenemende gebruik van mobiele devices worden websites steeds vaker ontworpen en ontwikkeld met de mobiele gebruiker als uitgangspunt. De gebruiker is tenslotte degene waar het om draait en die in zijn behoeften moet worden voorzien. 

Nadruk ligt op het ontwerp voor mobiel 

Bij mobile first wordt er bewust eerst nagedacht over hoe het design op mobiel en vervolgens desktop het beste kan worden weergegeven. De content past zich aan de beschikbare schermresoluties. Bezoekers hebben bij mobiel gebruik andere wensen en behoeften dan op een desktop. Zo zullen ze sneller bepaalde informatie als contactgegevens willen vinden, terwijl andere informatie zoals (sub)menuitems en grote afbeeldingen minder van belang zijn en meer naar de achtergrond mogen verdwijnen. Mobile first begint al bij het ontwerpproces. De insteek blijft over het algemeen wel vooral technisch en de hoofdvraag blijft: "Hoe kunnen we het website ontwerp zo optimaal mogelijk tonen op de verschillende devices?"

Mobile first versus responsive 

Mobile first zegt iets over de manier waarop een website is ontworpen. Responsive zegt iets over de techniek, hoe de website is gebouwd en hoe de website gepresenteerd wordt op verschillende schermen. Bij responsive websites gebeurt het nog regelmatig dat de website op de desktop er netjes uitziet, maar dat de bezoeker op mobiel niet gemakkelijk vindt wat hij zoekt of verwacht, waardoor de ervaring net niet optimaal is. Dat komt omdat er bij het ontwerp (nog) te weinig aandacht wordt besteed aan het mobile first principe en er niet voldoende geanticipeerd wordt op de behoeftes van de mobiele bezoeker.

Content first

Websiteontwerp anders bekeken Steeds meer komt de nadruk te liggen op content en het belang de juiste content op de juiste manier te presenteren wordt steeds groter. Content is en blijft immers king. Lees ook eens onze eerder geschreven blogs over het belang van content. Al voor het ontwerpproces van start gaat, verdient de content daarom aandacht. De laatste designtrend is daarmee een feit: Content first. Wat wordt er getoond en in welke volgorde? Content wordt niet alleen vanuit de techniek bekeken, maar wordt op een ander level nader onder de loep genomen en ook op basis van personalisatie en relevantie aangeboden. Content first geeft het antwoord op de vraag: "Welke informatie wil je op welk device laten zien en met welk resultaat?"

 Content wordt daardoor zo georganiseerd dat de bezoeker krijgt wat hij verwacht en wil. Informatie op de (mobiele) site kan worden gefilterd en ingericht zodat deze zich niet alleen aanpast aan het device, maar vooral ook aan de gebruikerswensen. Alle content en diensten die je biedt, moet via alle kanalen toegankelijk zijn. En heel belangrijk: op verschillende wijzen, in andere volgorde en met andere prioriteit. Bij content first komt content in het middelpunt van de belangstelling te staan.

Content toegepast vanuit de gebruikersbehoefte 

De indeling van de pagina en de content bepalen voor een groot deel of jouw boodschap op ieder device goed overkomt. Door bewust te kijken naar relevantie, locatie, tijd en personalisatie voor en tijdens het ontwerpproces en deze te combineren met goed werkende techniek, zullen websites logischer en nuttiger worden. Door content first gaan we dus op een andere manier kijken naar (responsive) websites en website ontwerpen. We kijken niet meer alleen hoe we een website vanuit de techniek responsive krijgen, maar bekijken eerst de content vanuit het oogpunt van de gebruiker en maken op basis daarvan de site responsive. 

Voordelen content first 

Het grote voordeel van content first boven mobile first is dat je jezelf dwingt in een vroeg stadium te komen tot geoptimaliseerde, relevante en efficiënte content. Dat zal zorgen voor meer bewustzijn bij jezelf, maar ook bij de bezoeker, grotere aantallen bezoekers en uiteindelijk leidt dat tot meer verkoop en hogere conversie. 

Gebruik echte content

Door gebruik van content first verloopt het gehele proces van ontwikkeling van de website ook efficiënter. Door gebruik van echte content aan het begin van het ontwikkelproces (in plaats van ‘Lorem Ipsum’ content tot vlak voor livegang), ben je niet alleen sneller dichter bij een meer compleet en afgerond ontwerp dat klaar is voor bouw, maar het ontwerp is veel meer gericht op content, waardoor je een veel completer en juister beeld krijgt van hoe de boodschap overgebracht moet worden aan de eindgebruikers. 

Hoe content first toe te passen? Vier tips. 

Het mag duidelijk zijn dat wij bij Occhio erg gecharmeerd zijn van deze designtechniek. Daarom tenslotte nog een viertal tips om content first toe te passen: 

  1. Begin in een zo vroeg mogelijk stadium met de (echte) content. Alle content is via elk device toegankelijk. Onthoud dat een bezoeker het device zal gebruiken dat op dat moment voorhanden ligt. 
  2. Stel prioriteiten. Ga na op welk moment de bezoeker op welk device je site bezoekt en wat hij daar vervolgens zoekt, leest of doet en stel prioriteiten in content. 
  3. Geef ieder device zijn eigen ‘moment of glory’ en optimaliseer zoveel mogelijk voor de verschillende varianten. Ieder device heeft unieke presentatie- en interactievormen waar je gebruik van kunt en moet maken.
  4. Ontwerp geen template die je vervolgens vult met content, maar ontwerp een systeem waarin de content en hoe die gebruikt wordt optimaal gebruikt worden. De content bepaalt de lay-out en niet andersom.

Deel dit artikel via
X

Welkom! Deze website maakt gebruik van cookies

Geef hier aan welke cookies we mogen plaatsen. De noodzakelijke en statistiek-cookies verzamelen geen persoonsgegevens en helpen ons de site te verbeteren.

Noodzakelijke cookies helpen een website bruikbaarder te maken, door basisfuncties als paginanavigatie en toegang tot beveiligde gedeelten van de website mogelijk te maken. Zonder deze cookies kan de website niet naar behoren werken.

NaamAanbiederDoelVervaldatum
admin_authOcchio.nlWij gebruiken deze cookie om te onthouden of een Occhio.nl gebruiker is ingelogd in ons systeem.5 jaar
October_sessionOcchio.nlDeze cookie wordt gebruikt door ons content management systeem en wordt geplaatst bij bezoek aan willekeurig welke pagina van onze website. Sessie
NaamAanbiederDoelVervaldatum
_gat_gtag_UA_63158_1Google-analytics.comGebruikt door Google Analytics om verzoeksnelheid te vertragen1 minuut
_gaGoogle-analytics.comRegistreert een uniek ID die wordt gebruikt om statistische gegevens te genereren over hoe de bezoeker de website gebruikt.1 jaar
_gidGoogle-analytics.comRegistreert een uniek ID die wordt gebruikt om statistische gegevens te genereren over hoe de bezoeker de website gebruikt.24 uur

Occhio.nl maakt geen gebruik van marketing cookies.

Cookies

Een cookie is een klein tekstbestand dat tijdens uw bezoek aan een website wordt geplaatst. In dit tekstbestand wordt informatie opgeslagen. Deze informatie kan bij een later bezoek weer worden herkend door deze website.

Bekijk hier onze privacy verklaring