# Analyse van bestaande websites



# Uitleg

[![image.png](https://digitaallab.nl/uploads/images/gallery/2025-06/scaled-1680-/ulaimage.png)](https://digitaallab.nl/uploads/images/gallery/2025-06/ulaimage.png)

#### **Waarom websites analyseren?**

Een goede ontwerper leert niet alleen door zelf te maken, maar vooral door te **kijken, vergelijken en onderbouwen**.

Door websites te analyseren, leer je:

- Welke keuzes effectief zijn (en waarom)
- Hoe doelgroep, stijl en inhoud op elkaar afgestemd kunnen zijn
- Welke fouten of valkuilen je zelf kunt vermijden
- Bewuster naar je eigen ontwerp te kijken

> 🎯 Analyse is dus meer dan "mooi" of "lelijk" – het gaat om **wat werkt** en **voor wie**.

#### **Waar let je op bij een analyse?**

Gebruik de onderwerpen uit eerdere hoofdstukken om systematisch naar websites te kijken. Dit kun je doen aan de hand van vijf hoofdvragen:

##### 1. **Wat is het doel van de website?**

- Informeren, verkopen, overtuigen, helpen, entertainen?
- Is het doel duidelijk zichtbaar op de homepage?

##### 2. **Wie is de doelgroep?**

- Leeftijd, interesse, kennisniveau?
- Past het ontwerp bij hun verwachtingen en voorkeuren?

##### 3. **Hoe is de gebruikerservaring (UX)?**

- Is de site logisch opgebouwd?
- Kan je makkelijk navigeren?
- Zijn er frustraties of obstakels?

##### 4. **Hoe is het visueel ontwerp?**

- Welke kleuren, lettertypes en stijlen zijn gebruikt?
- Is er balans en hiërarchie?
- Hoe wordt beeld ingezet?

##### 5. **Is de site toegankelijk en mobielvriendelijk?**

- Genoeg contrast?
- Werkt het op mobiel?
- Kan je navigeren met toetsenbord?
- Zijn er alternatieve teksten bij afbeeldingen?

#### **Analysemethoden**

Er zijn meerdere manieren om een website te analyseren:

<div class="_tableContainer_16hzy_1" id="bkmrk-methode-vorm-wanneer"><div class="_tableWrapper_16hzy_14 group flex w-fit flex-col-reverse" tabindex="-1"><table class="w-fit min-w-(--thread-content-width)" data-end="2747" data-start="2295"><thead data-end="2334" data-start="2295"><tr data-end="2334" data-start="2295"><th data-col-size="sm" data-end="2305" data-start="2295">Methode</th><th data-col-size="sm" data-end="2312" data-start="2305">Vorm</th><th data-col-size="md" data-end="2334" data-start="2312">Wanneer gebruiken?</th></tr></thead><tbody data-end="2747" data-start="2375"><tr data-end="2451" data-start="2375"><td data-col-size="sm" data-end="2389" data-start="2375">✅ Checklist</td><td data-col-size="sm" data-end="2417" data-start="2389">Objectief, gestructureerd</td><td data-col-size="md" data-end="2451" data-start="2417">Voor systematische beoordeling</td></tr><tr data-end="2539" data-start="2452"><td data-col-size="sm" data-end="2481" data-start="2452">🧠 Review in eigen woorden</td><td data-col-size="sm" data-end="2506" data-start="2481">Subjectiever, creatief</td><td data-col-size="md" data-end="2539" data-start="2506">Voor reflectie en presentatie</td></tr><tr data-end="2636" data-start="2540"><td data-col-size="sm" data-end="2560" data-start="2540">🧪 Gebruikerstest</td><td data-col-size="sm" data-end="2601" data-start="2560">Je laat iemand anders de site proberen</td><td data-col-size="md" data-end="2636" data-start="2601">Om echte UX-problemen te vinden</td></tr><tr data-end="2747" data-start="2637"><td data-col-size="sm" data-end="2666" data-start="2637">🧰 Tool-gebaseerde analyse</td><td data-col-size="sm" data-end="2700" data-start="2666">Met tools als WAVE of PageSpeed</td><td data-col-size="md" data-end="2747" data-start="2700">Voor technische en toegankelijkheidsanalyse</td></tr></tbody></table>

</div></div>Voor deze module gebruiken we vooral **checklists en reviews**.

#### **Voorbeeldanalyse (samengevat)**

**Website**: bol.com  
**Doel**: producten verkopen (e-commerce)  
**Doelgroep**: breed publiek, vooral volwassenen en ouders

<div class="_tableContainer_16hzy_1" id="bkmrk-aspect-analyse-ux-du"><div class="_tableWrapper_16hzy_14 group flex w-fit flex-col-reverse" tabindex="-1"><table class="w-fit min-w-(--thread-content-width)" data-end="3466" data-start="2984"><thead data-end="3004" data-start="2984"><tr data-end="3004" data-start="2984"><th data-col-size="sm" data-end="2993" data-start="2984">Aspect</th><th data-col-size="md" data-end="3004" data-start="2993">Analyse</th></tr></thead><tbody data-end="3466" data-start="3026"><tr data-end="3116" data-start="3026"><td data-col-size="sm" data-end="3031" data-start="3026">UX</td><td data-col-size="md" data-end="3116" data-start="3031">Duidelijke zoekfunctie, veel aanbevelingen, snel scrollen, maar soms veel reclame</td></tr><tr data-end="3219" data-start="3117"><td data-col-size="sm" data-end="3127" data-start="3117">Visueel</td><td data-col-size="md" data-end="3219" data-start="3127">Rustige blauwe kleur, witruimte, duidelijke knoppen, consistent gebruik van pictogrammen</td></tr><tr data-end="3294" data-start="3220"><td data-col-size="sm" data-end="3232" data-start="3220">Structuur</td><td data-col-size="md" data-end="3294" data-start="3232">Heldere header, vaste navigatie, veel herhaling en filters</td></tr><tr data-end="3377" data-start="3295"><td data-col-size="sm" data-end="3314" data-start="3295">Toegankelijkheid</td><td data-col-size="md" data-end="3377" data-start="3314">Goede lettergrootte, werkt op mobiel, contrast meestal goed</td></tr><tr data-end="3466" data-start="3378"><td data-col-size="sm" data-end="3393" data-start="3378">Verbeterpunt</td><td data-col-size="md" data-end="3466" data-start="3393">Sommige knoppen te klein op mobiel, veel afleiding op productpagina’s</td></tr></tbody></table>

</div></div>

# Oefeningen

#### **Opdracht A – Analyse met checklist**

1. Kies een website (of gebruik een lijst van de docent). Bijvoorbeeld:
    
    
    - Een schoolsite
    - Een webshop
    - Een museumsite
    - Een persoonlijk portfolio
2. Vul de volgende checklist in:

<div class="_tableContainer_16hzy_1" id="bkmrk-vragen-antwoord-%2F-to"><div class="_tableWrapper_16hzy_14 group flex w-fit flex-col-reverse" tabindex="-1"><table class="w-fit min-w-(--thread-content-width)" data-end="4159" data-start="3734"><thead data-end="3769" data-start="3734"><tr data-end="3769" data-start="3734"><th data-col-size="md" data-end="3743" data-start="3734">Vragen</th><th data-col-size="sm" data-end="3769" data-start="3743">Antwoord / Toelichting</th></tr></thead><tbody data-end="4159" data-start="3807"><tr data-end="3841" data-start="3807"><td data-col-size="md" data-end="3838" data-start="3807">Wat is het doel van de site?</td><td data-col-size="sm" data-end="3841" data-start="3838"> </td></tr><tr data-end="3868" data-start="3842"><td data-col-size="md" data-end="3865" data-start="3842">Wie is de doelgroep?</td><td data-col-size="sm" data-end="3868" data-start="3865"> </td></tr><tr data-end="3899" data-start="3869"><td data-col-size="md" data-end="3896" data-start="3869">Is de navigatie logisch?</td><td data-col-size="sm" data-end="3899" data-start="3896"> </td></tr><tr data-end="3935" data-start="3900"><td data-col-size="md" data-end="3932" data-start="3900">Wat valt direct op (visueel)?</td><td data-col-size="sm" data-end="3935" data-start="3932"> </td></tr><tr data-end="3974" data-start="3936"><td data-col-size="md" data-end="3971" data-start="3936">Hoe is de kleur- en letterkeuze?</td><td data-col-size="sm" data-end="3974" data-start="3971"> </td></tr><tr data-end="4025" data-start="3975"><td data-col-size="md" data-end="4022" data-start="3975">Zijn er UX-fouten of verwarrende onderdelen?</td><td data-col-size="sm" data-end="4025" data-start="4022"> </td></tr><tr data-end="4060" data-start="4026"><td data-col-size="md" data-end="4057" data-start="4026">Is de site mobiel bruikbaar?</td><td data-col-size="sm" data-end="4060" data-start="4057"> </td></tr><tr data-end="4108" data-start="4061"><td data-col-size="md" data-end="4105" data-start="4061">Is de content toegankelijk voor iedereen?</td><td data-col-size="sm" data-end="4108" data-start="4105"> </td></tr><tr data-end="4130" data-start="4109"><td data-col-size="md" data-end="4127" data-start="4109">Wat werkt goed?</td><td data-col-size="sm" data-end="4130" data-start="4127"> </td></tr><tr data-end="4159" data-start="4131"><td data-col-size="md" data-end="4156" data-start="4131">Wat zou je verbeteren?</td><td data-col-size="sm" data-end="4159" data-start="4156"> </td></tr></tbody></table>

</div></div>💡 Je kunt deze opdracht individueel of in tweetallen uitvoeren.

#### **Opdracht B – Mini-presentatie**

1. Maak een korte presentatie (±3 minuten) over je analyse:
    
    
    - Toon screenshots
    - Vertel wat goed werkt en waarom
    - Benoem 1–2 verbeterpunten
    - Geef een eindbeoordeling (bijv. score uit 10)
2. Presenteer dit klassikaal of in kleine groepen.