# HTML Oefenopdracht: Maak een Blog Mockup
## Leerdoelen
Pas je HTML-kennis toe door een complete blog homepage te ontwerpen en te coderen. Deze praktische opdracht versterkt je begrip van semantische HTML-concepten, toegankelijkheidsrichtlijnen en professionele code-organisatievaardigheden die je gedurende je webontwikkelingsreis zult gebruiken.
**Door deze opdracht te voltooien, leer je:**
- Het plannen van website-indelingen voordat je begint met coderen
- Het correct toepassen van semantische HTML-elementen
- Het maken van toegankelijke, goed gestructureerde markup
- Het ontwikkelen van professionele codeer-gewoontes met behulp van commentaar en organisatie
## Projectvereisten
### Deel 1: Ontwerpplanning (Visuele Mockup)
**Maak een visuele mockup van je blog homepage die het volgende bevat:**
- Header met sitetitel en navigatie
- Hoofdinhoud met minimaal 2-3 blogpost previews
- Zijbalk met aanvullende informatie (over-sectie, recente berichten, categorieën)
- Footer met contactinformatie of links
**Opties voor het maken van een mockup:**
- **Handgetekende schets**: Gebruik papier en potlood, maak vervolgens een foto of scan je ontwerp
- **Digitale tools**: Figma, Adobe XD, Canva, PowerPoint of een andere tekenapplicatie
- **Wireframe tools**: Balsamiq, MockFlow of vergelijkbare wireframing software
**Label de secties van je mockup** met de HTML-elementen die je van plan bent te gebruiken (bijv. "Header - ``", "Blogposts - ``").
### Deel 2: HTML Elementen Planning
**Maak een lijst waarin elke sectie van je mockup wordt gekoppeld aan specifieke HTML-elementen:**
```
Example:
- Site Header →
- Main Navigation →