Naar een mobile first en gebruiksvriendelijke website: volledige traject

Stap 1: naar een responsive website - mei tot juli 2016

De eerste maanden van het project gingen we voor een 'quick win'. We maakten de huidige website en alle subsites responsive. Deze fase is op 19 juli 2016 live gegaan en afgewerkt.

Responsive?  
'Responsive' betekent dat navigatie, inhoudselementen, tekstbreedte zich aanpassen aan de schermbreedte van het toestel waarmee de bezoeker surft. Op een kleiner scherm staan navigatiebuttons bv onder elkaar, of gaan ze inklappen. Inhoudselementen zoals tekstelementen, call-to-actions ... schuiven onder elkaar i.p.v. in verschillende kolommen naast elkaar te staan.

Tussenstap
In deze eerste fase gebeurden geen grote aanpassingen aan de website: informatie-architectuur, inhoudselementen, sjablonen ... bleven zoals ze zijn, maar positioneren zich op kleine schermen anders dan op groot scherm. Pas in een latere fase gaan we de website verder optimaliseren, maar daartoe onderwerpen we de website eerst aan een grondig gebruikersonderzoek.

Belangrijk! De webredacteurs zullen in hun redactie vanaf nu rekening moeten houden met het responsive gedrag van de website.

Stap 2: gebruikersonderzoek - augustus 2016 tot augustus 2017

We onderwierpen de website aan een grondig gebruikersonderzoek, zowel voor desktop als voor mobiel gebruik. De website stond dan meer dan 4 jaar online. Het vorige gebruikersonderzoek dateerde nog van 6 jaar geleden, en werd uitgevoerd op de oude ua.ac.be website. Hoog tijd dus om de gebruiksvriendelijkheid van de website te testen, de toptaken nog eens scherp te stellen, klikgedrag te analyseren, onze webinhoud te laten screenen...  

Dit gebruikersonderzoek spreidden we over enkele maanden, zodat we een gedetailleerd beeld kregen op de verschillende taken.

Op het programma stonden:

  • Screening van de Google Analytics
  • HotJar recordings: heatmaps van het klikgedrag op de website
  • Online enquêtes voor toptakenonderzoek
  • Interviews met live gebruikerstests
  • Content audit review: screening van de inhoudskwaliteit van de webpagina's (op basis van enkele objectieve parameters)
  • Anysurfer audit
  • Algemene tevredenheidsenquête (CCI)

Op basis van deze bevindingen werden een roadmap en wireframes opgesteld om de website verder te optimaliseren. Zowel voor desktop als voor mobiel bezoek. 

De optimalisatie van de website zal op verschillende niveaus plaatsvinden:

  • designaanpassingen
  • aanpassingen aan de informatie-architectuur
  • aanpassingen aan de sjablonen
  • aanpassingen aan content-elementen
  • redactierichtlijnen voor de webredacteurs
  • ....

Belangrijk hierbij: het zal voornamelijk gaan over centrale aanpassingen aan sjablonen, stylesheets, design ... met minimale workload voor de decentrale webredacteurs. We maken immers geen nieuwe website, we gaan de bestaande website stap voor stap optimaliseren. Sommige aanpassingen zullen wel effect hebben op het redactiewerk.

Stap 3: nieuwe aanbesteding

Najaar 2017 - voorjaar 2018.

Stap 4: Van wireframe naar mobile first redesign, optimaliseren zoekfunctie en navigatie + eerste snelle redesign, technische voorbereidingen

juni 2018 - voorjaar 2019:

  • afwerken van gebruikerstesten,
  • optimaliseren (vernieuwen) van de zoekfunctie,
  • start van technische aanpassingen achter de schermen, zodat database en presentatielaag uit elkaar kunnen getrokken worden,
  • op punt zetten van een verbeterde navigatiestructuur op basis van gebruikerstesten,
  • core content workshops met kerneditors van de belangrijkste toptaken,
  • afwerken wireframes en designvoorstellen op basis van core content workshops,
  • eerste, snelle redesign en toepassing van geoptimaliseerde navigatiestructuur,
  • optimaliseren webredactie op basis van gebruikersonderzoek.

april 2019 - ...

  • optimaliseren navigatiestructuur en inhoud Engelstalige website (ongoing)
  • afwerken definitieve designs voor mobile redesign volgens customer journey van toptaken (ongoing)
  • afwerken technische aanpassingen achter de schermen, zodat database en presentatielaag uit elkaar kunnen getrokken worden (verwachte einddatum: maart 2020),
  • lanceren testsite (verwacht: april 2020),
  • opleiding webeditors: roadshow - handleiding - ... (april - juni 2020)
  • omschakelen website naar mobile first redesign (verwacht: begin zomer 2020).