Wordpress 2026

Doorlopen en aanvullen met illustraties01 CMS en WordPress

🎯 Leerdoelen voor opdracht 1

• Je kunt in je eigen woorden uitleggen wat een CMS doet.
• Je kunt de belangrijkste onderdelen van een WordPress-site benoemen.
• Je kunt uitleggen welk WordPress-platform je gebruikt om zelf een website te installeren.

💡 Uitleg: wat is een CMS?

CMS staat voor Content Management System. Het is software waarmee je de inhoud van een website maakt en beheert. Je kunt bijvoorbeeld pagina’s schrijven, afbeeldingen uploaden, een menu maken en een formulier toevoegen zonder voor elk onderdeel zelf een HTML-bestand te schrijven.

Een CMS bewaart de inhoud meestal in een database en toont die inhoud met behulp van een ontwerp. Daardoor kunnen meerdere mensen aan dezelfde website werken: bijvoorbeeld een redacteur die teksten schrijft en een beheerder die instellingen wijzigt.

Voorbeelden van CMS-systemen zijn WordPress, Drupal en Joomla. In deze module werken we met WordPress.

De belangrijkste onderdelen van WordPress

• Pagina’s: vaste inhoud, zoals Home, Over ons en Contact.
• Berichten: tijdgebonden inhoud, zoals nieuws- of blogartikelen.
• Thema: bepaalt de vormgeving en lay-out van de website.
• Plugins: voegen extra functies toe, bijvoorbeeld een formulier, galerie of beveiliging.
• Media: afbeeldingen, video’s en documenten die je op de site gebruikt.
• Gebruikers: personen met toegang tot de beheeromgeving, ieder met eigen rechten.

WordPress.org en WordPress.com

Deze twee namen lijken op elkaar, maar betekenen niet hetzelfde:

• WordPress.org biedt de gratis, open-source WordPress-software. Je downloadt deze software en installeert haar zelf op een lokale computer of webserver. In deze cursus gebruiken we WordPress.org.
• WordPress.com is een commerciële online dienst waarop hosting en WordPress samen worden aangeboden. Je hebt daar minder technische controle, afhankelijk van het gekozen abonnement.

Open source betekent dat de broncode van WordPress beschikbaar is. Je mag de software gebruiken, bestuderen en aanpassen. Dat betekent niet dat je zomaar elk thema of elke plugin zonder controle moet installeren: controleer altijd of een uitbreiding betrouwbaar en onderhouden is.

Frontend en backend

Bezoekers zien de frontend: de publieke website. In de backend, ook wel het dashboard of beheergedeelte, maak en beheer je de inhoud en instellingen. Je hebt een account nodig om in de backend te werken.

🛠️ Opdracht – CMS en WordPress herkennen

1. Zoek twee bestaande websites die volgens jou met een CMS zijn gemaakt.
2. Noteer van beide websites de URL en noem twee onderdelen die waarschijnlijk via een CMS beheerd worden, bijvoorbeeld het menu, nieuwsberichten, afbeeldingen of een contactformulier.
3. Maak vervolgens een overzicht met de zes WordPress-onderdelen uit de uitleg: pagina’s, berichten, thema’s, plugins, media en gebruikers.
4. Schrijf bij elk onderdeel in één zin waarvoor je het gebruikt.
5. Beantwoord ten slotte: waarom gebruiken organisaties liever een CMS dan losse HTML-bestanden voor een website die regelmatig verandert?

🧠 Reflectie

• Wat is volgens jou het belangrijkste voordeel van een CMS?
• Wat is het verschil tussen een thema en een plugin?
• Waarom werken we in deze cursus met WordPress.org en niet met WordPress.com?

📤 Inleveren

1. Lever één PDF of tekstdocument in met jouw twee websitevoorbeelden, het overzicht van WordPress-onderdelen, je antwoord op de opdrachtvraag en de drie reflectievragen.
2. Noem het bestand: 01-cms-en-wordpress-<jouwnaam>.pdf of 01-cms-en-wordpress-<jouwnaam>.txt.

02 Lokale installatie van WordPress

🎯 Leerdoelen

• Je begrijpt waarom je een WordPress-site eerst lokaal kunt bouwen.
• Je kunt Apache en MySQL starten in XAMPP.
• Je kunt een database aanmaken in phpMyAdmin.
• Je kunt WordPress lokaal installeren en inloggen in het dashboard.
• Je kunt een LLM AI verantwoord inzetten om installatieproblemen te onderzoeken.

💡 Uitleg: lokaal werken

Een lokale ontwikkelomgeving draait op je eigen computer. De website is dan nog niet openbaar op internet. Dat is handig: je kunt veilig oefenen, fouten maken en onderdelen testen voordat je een site live zet.

In deze cursus gebruiken we XAMPP. XAMPP bevat onder andere:

• Apache: de webserver die jouw WordPress-bestanden in de browser laat zien.
• MySQL: het databasesysteem waarin WordPress inhoud, instellingen en gebruikers opslaat.
• phpMyAdmin: een webprogramma waarmee je databases kunt bekijken en beheren.

WordPress bestaat dus uit twee delen die allebei nodig zijn: bestanden (zoals thema’s, plugins en afbeeldingen) en een database (zoals pagina’s, instellingen en gebruikers).

Voorbereiding

1. Open de XAMPP Control Panel.
2. Start Apache en MySQL. Beide regels moeten als actief zichtbaar zijn.
3. Open in je browser http://localhost/phpmyadmin.
4. Maak een nieuwe database, bijvoorbeeld wp-jouwnaam. Gebruik geen spaties in de databasenaam.
5. Download de meest recente WordPress-versie van wordpress.org/download. Gebruik voor deze cursus dus niet WordPress.com.
6. Pak het ZIP-bestand uit en plaats de uitgepakte WordPress-map in de map htdocs van XAMPP. Geef de map een herkenbare naam, bijvoorbeeld wp-jouwnaam.

WordPress installeren

1. Ga in je browser naar http://localhost/wp-jouwnaam.
2. Kies de gewenste taal en start de installatie.
3. Vul de databasegegevens in. Bij een standaard XAMPP-installatie zijn dit meestal:
   
   • Databasenaam: wp-jouwnaam
   • Gebruikersnaam: root
   • Wachtwoord: leeg
   • Databasehost: localhost
   • Tabelvoorvoegsel: laat de standaardwaarde staan, tenzij je docent iets anders aangeeft.
4. Vul een sitetitel in en maak een beheerdersaccount aan. Gebruik een uniek, sterk wachtwoord.
5. Bewaar je wachtwoord in een wachtwoordmanager of op de manier die je docent voorschrijft. Deel het niet in screenshots, prompts of documenten.
6. Rond de installatie af en log in via http://localhost/wp-jouwnaam/wp-admin.

🤖 AI gebruiken bij installatieproblemen

Een LLM AI, zoals ChatGPT, kan helpen om een foutmelding te begrijpen of een volgende stap te vinden. De AI voert de installatie niet voor jou uit en kan zich vergissen. Controleer daarom altijd het antwoord in jouw eigen omgeving.

Een goede vraag aan AI bevat:

• wat je probeert te doen;
• welk programma je gebruikt, bijvoorbeeld XAMPP op Windows of macOS;
• de volledige foutmelding;
• wat je zelf al hebt gecontroleerd.

Voorbeeldprompt:

Ik installeer WordPress lokaal met XAMPP op Windows. Apache en MySQL draaien. Bij http://localhost/wp-samira zie ik de foutmelding “[plak foutmelding]”. Ik heb al gecontroleerd dat de map in htdocs staat. Geef maximaal drie mogelijke oorzaken en veilige controles die ik zelf kan uitvoeren. Vraag om extra informatie als dat nodig is.

Let op: plak nooit wachtwoorden, databasewachtwoorden, API-sleutels of persoonsgegevens in een AI-chat. Vraag AI om uitleg en controles; kopieer niet blind commando’s of wijzigingen die je niet begrijpt. Noteer bij je werk kort welke AI-vraag je hebt gesteld en hoe je het antwoord hebt gecontroleerd.

🛠️ Opdracht – Installeer WordPress lokaal

1. Start Apache en MySQL in XAMPP.
2. Maak de database wp-jouwnaam aan.
3. Download en installeer WordPress in de map wp-jouwnaam.
4. Log in op jouw WordPress-dashboard.
5. Maak een screenshot van het dashboard. Zorg dat de lokale URL zichtbaar is, maar dat er geen wachtwoord of andere gevoelige gegevens in beeld staan.
6. Open phpMyAdmin, selecteer jouw database en maak een screenshot waarop de WordPress-tabellen zichtbaar zijn.
7. Gebruik AI alleen als je vastloopt. Noteer dan de gebruikte prompt, een korte samenvatting van het antwoord en hoe je hebt gecontroleerd dat de oplossing werkte.

🧠 Reflectie

• Waarom is lokaal werken handig voordat je een website publiceert?
• Welke informatie bewaart WordPress in de database en welke informatie staat in bestanden?
• Als je AI hebt gebruikt: wat was je vraag en hoe heb je gecontroleerd of het antwoord juist was? Als je AI niet hebt gebruikt: bij welk installatieprobleem zou AI je kunnen helpen?

📤 Inleveren

1. 02-dashboard-jouwnaam.jpg: screenshot van jouw WordPress-dashboard met de lokale URL zichtbaar.
2. 02-database-jouwnaam.jpg: screenshot van jouw WordPress-database met tabellen zichtbaar in phpMyAdmin.
3. 02-reflectie-jouwnaam.pdf of 02-reflectie-jouwnaam.txt: antwoorden op de reflectievragen en, indien van toepassing, jouw AI-log.

3 Dashboard en blokeditor

🎯 Leerdoelen

• Je kunt inloggen in het WordPress-dashboard.
• Je kent de belangrijkste onderdelen van het WordPress-beheermenu.
• Je kunt een pagina maken, bewerken, opslaan en bekijken.
• Je kunt werken met veelgebruikte blokken in de WordPress-blokeditor.
• Je kunt AI gebruiken om ideeën te verbeteren zonder teksten klakkeloos over te nemen.

💡 Uitleg: het dashboard

Na het inloggen kom je in het dashboard terecht. Dit is de backend van WordPress: de plek waar je jouw website beheert. In het linkermenu zie je onder andere deze onderdelen:

• Berichten: nieuws- of blogartikelen die meestal op datum worden getoond.
• Pagina’s: vaste pagina’s, zoals Home, Contact en Over ons.
• Media: afbeeldingen, documenten en andere bestanden.
• Weergave: instellingen voor thema, ontwerp, navigatie en soms de Site Editor.
• Plugins: extra functionaliteit voor jouw site.
• Gebruikers: accounts en rechten.
• Instellingen: algemene instellingen van de website.

Welke menuonderdelen je precies ziet, hangt af van je thema, plugins en gebruikersrol. In deze stap werk je vooral met Pagina’s.

💡 Uitleg: de blokeditor

WordPress gebruikt standaard de blokeditor, ook wel Gutenberg genoemd. Een pagina bestaat uit losse blokken. Elk blok heeft een eigen doel en instellingen. Daardoor kun je inhoud combineren zonder zelf HTML te schrijven.

Veelgebruikte blokken

• Paragraaf: gewone lopende tekst.
• Kop: een tussenkop. Gebruik koppen in een logische volgorde.
• Afbeelding: een afbeelding uit de mediabibliotheek of van je computer.
• Knoppen: een duidelijke link naar een volgende actie of pagina.
• Kolommen: zet inhoud naast elkaar; controleer altijd of dit ook op mobiel leesbaar blijft.
• Lijst: voor korte, scanbare opsommingen.
• Groep: groepeert blokken zodat je ze gezamenlijk kunt opmaken.

Een pagina maken

1. Ga in het dashboard naar Pagina’s → Nieuwe pagina toevoegen.
2. Geef de pagina een duidelijke titel.
3. Klik op het plus-icoon (+) om een blok toe te voegen.
4. Maak de inhoud met verschillende blokken.
5. Gebruik rechtsboven Voorbeeld om te controleren hoe de pagina eruitziet.
6. Klik op Opslaan als concept als de pagina nog niet af is, of op Publiceren als de pagina zichtbaar mag worden.

Tip: bekijk je pagina ook op een smal browservenster of op je telefoon. Tekst moet leesbaar blijven en knoppen moeten goed aanklikbaar zijn.

🤖 AI gebruiken bij content

AI kan helpen om ideeën te verzamelen, teksten korter en duidelijker te maken of feedback te geven op structuur. De inhoud moet wel van jou blijven: controleer feiten, herschrijf in je eigen woorden en zorg dat de tekst past bij jouw doelgroep.

Voorbeeldprompt:

Ik maak een welkomstpagina voor een kleine fictieve gameclub voor jongeren van 16–18 jaar. Bedenk een structuur met een titel, twee korte tussenkoppen, een alinea en een knoptekst. Schrijf in eenvoudig Nederlands. Geef alleen een voorstel; ik pas het zelf aan.

Gebruik geen persoonsgegevens van jezelf, klasgenoten of echte klanten in je prompt. Noteer onderaan je opdracht of je AI hebt gebruikt, waarvoor je het gebruikte en welke onderdelen je zelf hebt aangepast.

🛠️ Opdracht – Maak een welkomstpagina

1. Maak een nieuwe pagina met de titel Welkom.
2. Voeg een hoofdtitel en minimaal twee tussenkoppen toe.
3. Voeg twee korte alinea’s toe waarin je uitlegt waar jouw fictieve website over gaat.
4. Gebruik minimaal vier verschillende bloktypen: een kop, een paragraaf, een lijst en een knop. Je mag daarnaast andere blokken gebruiken.
5. Laat de knop verwijzen naar een bestaande pagina of gebruik tijdelijk # als je doelpagina nog niet bestaat.
6. Bekijk de pagina in voorbeeldweergave en controleer spelling, leesbaarheid en de mobiele weergave.
7. Publiceer de pagina.
8. Maak een screenshot van de gepubliceerde pagina met de URL zichtbaar in de adresbalk.

🧠 Reflectie

• Wat is het voordeel van werken met blokken in plaats van één groot tekstveld?
• Welk blok vond je het nuttigst voor jouw pagina en waarom?
• Hoe heb je gecontroleerd of jouw pagina prettig leesbaar is voor een bezoeker?
• Als je AI hebt gebruikt: welke suggestie heb je aangepast of afgewezen, en waarom?

📤 Inleveren

1. 03-welkom-jouwnaam.jpg: screenshot van de gepubliceerde Welkom-pagina met zichtbare URL.
2. 03-reflectie-jouwnaam.pdf of 03-reflectie-jouwnaam.txt: antwoorden op de reflectievragen, inclusief een korte AI-verantwoording als je AI hebt gebruikt.

04 Media en toegankelijkheid

🎯 Leerdoelen

• Je kunt afbeeldingen uploaden en plaatsen in WordPress.
• Je kunt een afbeelding voorzien van een goede alt-tekst.
• Je begrijpt waarom bestandsformaat en bestandsgrootte belangrijk zijn.
• Je kunt een pagina toegankelijker maken met koppen, links en voldoende contrast.
• Je gaat zorgvuldig om met auteursrecht, privacy en AI-gegenereerd beeld.

💡 Uitleg: media in WordPress

Onder Media in het WordPress-dashboard beheer je afbeeldingen, documenten en andere bestanden. Je kunt bestanden daar eerst uploaden en later opnieuw gebruiken, of ze direct toevoegen vanuit een afbeeldingsblok.

Een goede website gebruikt afbeeldingen die passen bij de inhoud, scherp genoeg zijn en niet onnodig groot zijn. Grote bestanden maken een website langzaam, vooral op een mobiele verbinding.

Bestandsformaten

• JPG/JPEG: geschikt voor foto’s met veel kleuren.
• PNG: geschikt voor afbeeldingen die transparantie nodig hebben, bijvoorbeeld een logo. Vaak groter dan JPG.
• WebP: modern formaat met vaak een kleinere bestandsgrootte en goede kwaliteit.
• SVG: vectorformaat, vooral geschikt voor eenvoudige iconen en logo’s. Upload dit alleen wanneer je organisatie dit toestaat; SVG-bestanden kunnen onveilige code bevatten.

Verklein een afbeelding voordat je hem uploadt als dat mogelijk is. Upload bijvoorbeeld geen foto van 6000 pixels breed als hij op de pagina maar 1200 pixels breed wordt getoond.

💡 Alt-tekst: beschrijf wat belangrijk is

Een alt-tekst is een korte beschrijving van een afbeelding. Schermlezers lezen deze tekst voor aan bezoekers die de afbeelding niet kunnen zien. Ook helpt de tekst wanneer een afbeelding niet laadt.

Beschrijf vooral de informatie die de afbeelding toevoegt aan de pagina. Een decoratieve afbeelding die geen informatie bevat, heeft meestal geen alt-tekst nodig.

• Niet goed: foto.jpg of Afbeelding van een vakantiehuis.
• Wel goed: Houten vakantiehuis met terras en drie stoelen aan de rand van het bos.
• Decoratief: laat de alt-tekst leeg als de afbeelding alleen sfeer toevoegt en de omliggende tekst al genoeg informatie geeft.

💡 Toegankelijke inhoud

Toegankelijkheid betekent dat zo veel mogelijk mensen jouw website kunnen gebruiken, ook mensen die bijvoorbeeld een schermlezer gebruiken, slecht zien of alleen met een toetsenbord navigeren.

Koppen, links en contrast

• Gebruik één duidelijke hoofdtitel (H1) per pagina en gebruik daarna koppen in een logische volgorde. Kies geen kop alleen omdat de tekst groter moet worden.
• Gebruik beschrijvende linkteksten. Schrijf liever Bekijk onze openingstijden dan Klik hier.
• Zorg dat tekst voldoende contrasteert met de achtergrond. Lichtgrijze tekst op een witte achtergrond is vaak moeilijk leesbaar.
• Geef informatie niet alleen met kleur door. Gebruik bijvoorbeeld ook een tekstlabel of icoon bij een foutmelding.
• Controleer of knoppen duidelijk maken wat er gebeurt, bijvoorbeeld Stuur reserveringsaanvraag.

⚖️ Auteursrecht, privacy en AI-beelden

Gebruik alleen afbeeldingen waarvoor je toestemming hebt. Dat kunnen eigen foto’s zijn, materiaal van een opdrachtgever of beelden met een licentie die het gebruik op jouw website toestaat. Noteer altijd de bron of licentie als dat nodig is.

AI kan helpen om een afbeelding te maken of een alt-tekstvoorstel te formuleren, maar controleer het resultaat zelf. Plaats geen herkenbare personen zonder toestemming in je prompt of op je website. Presenteer een AI-afbeelding niet als een echte foto van een plaats, product of persoon wanneer dat misleidend zou zijn.

Voorbeeldprompt voor feedback:

Ik gebruik op een website een foto waarop [korte, niet-persoonlijke beschrijving]. De afbeelding staat naast een tekst over [onderwerp]. Geef drie korte voorstellen voor een alt-tekst. Vertel ook of de afbeelding waarschijnlijk decoratief of informatief is. Ik controleer de voorstellen zelf.

🛠️ Opdracht – Maak jouw Welkom-pagina toegankelijker

1. Open de Welkom-pagina uit stap 3 in de blokeditor.
2. Voeg minimaal drie afbeeldingen toe die passen bij de inhoud. Gebruik eigen, rechtenvrij of door de opdrachtgever aangeleverd materiaal.
3. Vul bij elke informatieve afbeelding een passende alt-tekst in.
4. Controleer de koppenstructuur: één hoofdtitel en minimaal twee logische tussenkoppen.
5. Voeg één duidelijke knop of link toe met een beschrijvende tekst.
6. Controleer of de tekst goed leesbaar is tegen de achtergrond en bekijk de pagina op een smal scherm.
7. Publiceer of werk de pagina bij.
8. Maak een screenshot van de gepubliceerde pagina met zichtbare URL.

🧠 Reflectie

• Waarom is een alt-tekst niet hetzelfde als een bestandsnaam?
• Welke afbeelding op jouw pagina is informatief en welke is eventueel decoratief? Leg uit.
• Welke verandering heb je gedaan om jouw pagina toegankelijker te maken?
• Welke bron of licentie heb je gebruikt voor jouw afbeeldingen? Als je AI hebt gebruikt: waarvoor en hoe heb je het resultaat gecontroleerd?

📤 Inleveren

1. 04-media-jouwnaam.jpg: screenshot van de bijgewerkte Welkom-pagina met zichtbare URL en minimaal drie afbeeldingen.
2. 04-reflectie-jouwnaam.pdf of 04-reflectie-jouwnaam.txt: antwoorden op de reflectievragen, inclusief de beeldbronnen en eventuele AI-verantwoording.

05 Pagina’s, berichten en structuur

🎯 Leerdoelen

• Je kunt het verschil uitleggen tussen een pagina en een bericht.
• Je kunt berichten indelen met categorieën en tags.
• Je kunt een logische URL-structuur kiezen.
• Je kunt een statische homepage en een aparte blogpagina instellen.
• Je kunt AI gebruiken om een sitestructuur te toetsen, niet om deze blind over te nemen.

💡 Pagina’s versus berichten

In WordPress zijn pagina’s en berichten allebei inhoud, maar ze hebben een ander doel.

• Pagina’s gebruik je voor vaste informatie die niet vaak verandert, zoals Home, Over ons, Contact, Diensten en Privacy.
• Berichten gebruik je voor actuele of terugkerende inhoud, zoals nieuws, blogartikelen, updates en evenementen. Berichten hebben een datum en worden meestal van nieuw naar oud getoond.

Een eenvoudige vuistregel: zou je de inhoud later in een overzicht met nieuwsartikelen willen tonen? Kies dan een bericht. Is het een vaste plek in je website? Kies dan een pagina.

💡 Categorieën en tags

Je kunt berichten organiseren met categorieën en tags. Daarmee kunnen bezoekers en zoekmachines beter begrijpen waar een bericht over gaat.

• Categorieën zijn brede hoofdonderwerpen. Voor een vakantiepark kunnen dat bijvoorbeeld Nieuws, Activiteiten en Aanbiedingen zijn.
• Tags zijn specifiekere trefwoorden die berichten met elkaar verbinden, bijvoorbeeld wandelroute, zomervakantie of hond toegestaan.

Gebruik categorieën en tags alleen wanneer ze de bezoeker helpen. Maak niet voor elk bericht een nieuwe categorie of een lange lijst met bijna gelijke tags.

💡 Permalinks: duidelijke webadressen

Een permalink is de vaste URL van een pagina of bericht. Kies URL’s die kort, leesbaar en beschrijvend zijn. Een URL als /openingstijden/ is duidelijker dan /?p=123.

Je stelt de algemene structuur in via Instellingen → Permalinks. Kies in deze cursus de optie Berichtnaam, tenzij je docent een andere afspraak maakt. Pas een bestaande URL niet zomaar aan nadat een website live staat: externe links kunnen dan breken.

💡 Homepage en blogpagina instellen

Een nieuwe WordPress-installatie toont vaak de meest recente berichten op de homepage. Voor veel organisaties is een vaste welkomstpagina handiger. Je kunt dan een aparte pagina instellen als homepage en een tweede, lege pagina aanwijzen als berichtenpagina.

1. Maak een pagina met de titel Home.
2. Maak een tweede pagina met de titel Nieuws. Je hoeft daar geen inhoud in te zetten; WordPress toont hier automatisch je berichten.
3. Ga naar Instellingen → Lezen.
4. Kies bij Je homepage toont voor Een statische pagina.
5. Kies Home als homepage en Nieuws als berichtenpagina.
6. Klik op Wijzigingen opslaan.

🤖 AI gebruiken om je sitestructuur te toetsen

AI kan ideeën geven voor een sitemap, categorieën of duidelijke paginatitels. Bepaal zelf wat logisch is voor jouw doelgroep en opdracht. Controleer ook of elk voorstel echt nodig is; een kleine website met te veel pagina’s of categorieën wordt juist onduidelijk.

Voorbeeldprompt:

Ik maak een kleine WordPress-site voor een fictief vakantiepark. De doelgroep bestaat uit gezinnen die een vakantiehuis zoeken. Ik heb de pagina’s Home, Over het park, Woningtypes, Nieuws en Contact. Beoordeel of deze structuur logisch is en noem maximaal twee ontbrekende pagina’s, met een korte reden. Gebruik geen fictieve feiten of prijzen.

🛠️ Opdracht – Geef jouw website een logische structuur

1. Maak de pagina Home. Je mag de Welkom-pagina uit stap 3 hernoemen of als basis gebruiken.
2. Maak een lege pagina met de titel Nieuws.
3. Maak minimaal twee berichten. Geef elk bericht een titel, korte inhoud en een passende uitgelichte afbeelding.
4. Maak minimaal twee categorieën aan en deel beide berichten in.
5. Voeg aan elk bericht één tot drie relevante tags toe.
6. Stel via Instellingen → Permalinks de structuur Berichtnaam in.
7. Stel via Instellingen → Lezen de pagina Home in als statische homepage en Nieuws als berichtenpagina.
8. Controleer in de frontend of de homepage en het nieuwsoverzicht goed werken.

🧠 Reflectie

• Waarom is een Contact-pagina meestal een pagina en geen bericht?
• Wat is het verschil tussen een categorie en een tag?
• Waarom zijn duidelijke en stabiele URL’s belangrijk?
• Als je AI hebt gebruikt: welk advies heb je wel of niet toegepast, en waarom?

📤 Inleveren

1. 05-home-jouwnaam.jpg: screenshot van de homepage met zichtbare URL.
2. 05-nieuws-jouwnaam.jpg: screenshot van de berichtenpagina met minimaal twee berichten en zichtbare URL.
3. 05-reflectie-jouwnaam.pdf of 05-reflectie-jouwnaam.txt: antwoorden op de reflectievragen, inclusief eventuele AI-verantwoording.

06 Thema en vormgeving

🎯 Leerdoelen

• Je kunt uitleggen wat een WordPress-thema bepaalt.
• Je kunt een thema beoordelen, installeren, activeren en testen.
• Je kunt de Site Editor gebruiken met een block theme.
• Je weet wanneer een klassiek thema de Customizer gebruikt.
• Je kunt een eenvoudige, consistente huisstijl toepassen.

💡 Uitleg: wat is een thema?

Een thema bepaalt het uiterlijk en de basislay-out van je WordPress-site: kleuren, lettertypen, afstanden, header, footer en de manier waarop pagina’s en berichten worden weergegeven. De inhoud van je pagina’s en berichten blijft normaal gesproken bestaan als je van thema wisselt, maar de weergave kan sterk veranderen.

Kies een thema niet alleen omdat het er mooi uitziet in een voorbeeld. Controleer of het actief wordt onderhouden, geschikt is voor jouw doel, goed werkt op mobiel en voldoende mogelijkheden biedt zonder onnodige extra plugins.

💡 Block themes en klassieke thema’s

WordPress kent grofweg twee soorten thema’s. Welke menu’s jij ziet, hangt af van het actieve thema.

• Block theme: gebruikt blokken voor de hele site, dus ook voor header, footer en navigatie. Je bewerkt dit via Weergave → Editor, de Site Editor.
• Klassiek thema: gebruikt meestal Weergave → Customizer, een aparte menu-pagina voor navigatie en soms widgets.

In deze cursus gebruiken we bij voorkeur een block theme, omdat dit de huidige WordPress-werkwijze is. De Site Editor is alleen beschikbaar wanneer een block theme actief is. Bij een klassiek thema kan de Customizer beschikbaar zijn, maar niet elk thema heeft dezelfde instellingen. [WordPress-documentatie: Site Editor]

💡 Werken met de Site Editor

Ga naar Weergave → Editor. In de Site Editor kun je onder andere deze onderdelen bewerken:

• Navigatie: de links waarmee bezoekers door je site gaan.
• Stijlen: kleuren, typografie en lay-out voor de hele site.
• Pagina’s: pagina-inhoud bekijken en bewerken.
• Templates: de lay-out voor bijvoorbeeld berichten, archieven en de 404-pagina.
• Patronen: herbruikbare blokcombinaties en template-onderdelen, zoals header en footer.

Let op: een wijziging in de header of footer geldt vaak voor de hele website. Controleer daarom na iedere grote wijziging meerdere pagina’s.

🎨 Een eenvoudige huisstijl

Een huisstijl zorgt voor herkenbaarheid. Kies een klein en bewust palet: bijvoorbeeld één hoofdkleur, één accentkleur en neutrale kleuren voor achtergrond en tekst. Gebruik maximaal twee lettertypen en zorg dat gewone tekst goed leesbaar blijft.

• Gebruik kleuren consequent voor dezelfde functie, bijvoorbeeld één kleur voor knoppen.
• Gebruik geen tekst die te klein is of te weinig contrast heeft.
• Gebruik een logo alleen als het leesbaar blijft op mobiel.
• Pas het ontwerp aan de doelgroep en inhoud aan, niet alleen aan je persoonlijke smaak.

🤖 AI gebruiken voor huisstijlideeën

AI kan voorstellen doen voor een kleurpalet, tone of voice of een korte ontwerpcheck. Gebruik zulke voorstellen als startpunt. Controleer zelf contrast, leesbaarheid, auteursrecht en of de stijl bij de opdracht past. Laat AI geen bestaand merk of logo kopiëren.

Voorbeeldprompt:

Ik ontwerp een rustige WordPress-site voor een fictief vakantiepark voor gezinnen. Stel een toegankelijk kleurpalet voor met een hoofdkleur, accentkleur, achtergrondkleur en tekstkleur. Geef de hex-codes en leg kort uit waarvoor elke kleur bedoeld is. Vermijd kleurcombinaties met laag contrast; ik controleer het contrast zelf.

🛠️ Opdracht – Geef jouw site een eigen vormgeving

1. Ga naar Weergave → Thema’s en bekijk de beschikbare thema’s.
2. Installeer en activeer een gratis block theme uit de officiële WordPress-themabibliotheek.
3. Open Weergave → Editor. Zie je geen Editor? Controleer of je thema een block theme is. Gebruik anders de Customizer en noteer welk soort thema je gebruikt.
4. Pas in Stijlen minimaal drie onderdelen aan: bijvoorbeeld kleuren, typografie en lay-out.
5. Voeg een sitetitel en eventueel een eigen logo toe. Gebruik geen logo of beeld van een bestaand merk zonder toestemming.
6. Pas de header of footer aan met minimaal één bruikbare wijziging, bijvoorbeeld een duidelijke sitetitel, contactlink of copyrighttekst.
7. Controleer de homepage, een bericht en de Welkom-pagina op desktop en mobiel.
8. Maak een screenshot van de homepage met zichtbare URL.

🧠 Reflectie

• Wat is het verschil tussen de inhoud van een pagina en de vormgeving die een thema bepaalt?
• Werk jij met een block theme of een klassiek thema? Waaraan zie je dat?
• Welke drie vormgevingskeuzes heb je gemaakt en waarom passen die bij jouw website?
• Hoe heb je gecontroleerd dat de vormgeving ook voor mobiele bezoekers leesbaar is?

📤 Inleveren

1. 06-vormgeving-jouwnaam.jpg: screenshot van jouw aangepaste homepage met zichtbare URL.
2. 06-reflectie-jouwnaam.pdf of 06-reflectie-jouwnaam.txt: antwoorden op de reflectievragen, inclusief eventuele AI-verantwoording.

07 Navigatie en gebruikerservaring

🎯 Leerdoelen

• Je kunt een duidelijk hoofdmenu maken en aanpassen.
• Je kunt interne en externe links correct gebruiken.
• Je kunt een menu logisch indelen voor bezoekers.
• Je kunt de navigatie op desktop en mobiel testen.
• Je kunt feedback van een gebruiker verzamelen en toepassen.

💡 Uitleg: goede navigatie

Navigatie helpt bezoekers snel vinden wat zij zoeken. Een goed menu is kort, begrijpelijk en op elke pagina op dezelfde plek te vinden. Gebruik woorden die bezoekers herkennen, zoals Home, Woningtypes, Nieuws en Contact.

Voor een kleine website zijn ongeveer vier tot zes hoofdlinks vaak genoeg. Plaats minder belangrijke links, zoals Privacy of Cookies, meestal in de footer.

Interne en externe links

• Interne link: verwijst naar een andere pagina binnen jouw eigen website.
• Externe link: verwijst naar een andere website.

Gebruik een beschrijvende linktekst. Schrijf bijvoorbeeld Bekijk onze woningtypes in plaats van Klik hier. Bij een externe link is het meestal prettig als de bezoeker kan zien dat hij of zij naar een andere website gaat.

💡 Menu maken met een block theme

Bij een block theme beheer je de navigatie meestal via Weergave → Editor → Navigatie of door het navigatieblok in de header te bewerken.

1. Ga naar Weergave → Editor.
2. Kies Navigatie, of open de header bij Patronen.
3. Maak een nieuw menu of wijzig het bestaande menu.
4. Voeg links naar jouw belangrijkste pagina’s toe.
5. Sleep links om de volgorde te wijzigen. Maak alleen een submenu wanneer dat echt helpt.
6. Sla de wijzigingen op en controleer de website in de frontend.

Gebruik je een klassiek thema? Dan vind je dit meestal via Weergave → Menu’s of in de Customizer. De namen en plekken kunnen per thema verschillen.

📱 Testen op mobiel

Op een telefoon verandert een hoofdmenu meestal in een knop met een icoon. Controleer daarom niet alleen of het menu zichtbaar is, maar ook of je het met een duim kunt bedienen.

• Werkt het menu op een klein scherm?
• Zijn alle belangrijkste pagina’s bereikbaar?
• Zijn de menu-items kort genoeg en niet afgekapt?
• Zijn links en knoppen goed aanklikbaar?
• Komt een bezoeker binnen twee klikken bij Contact of de belangrijkste actie?

🤖 AI gebruiken als kritische meedenker

AI kan je helpen om een menustructuur te beoordelen vanuit het perspectief van een bezoeker. Vraag om feedback, maar neem geen voorstel automatisch over. Test het voorstel altijd zelf of met een klasgenoot.

Voorbeeldprompt:

Ik maak een website voor een fictief vakantiepark. Mijn hoofdmenu is: Home, Over ons, Woningtypes, Nieuws, Contact, Privacy. Beoordeel dit menu voor gezinnen die een vakantiehuis willen boeken. Noem maximaal drie verbeterpunten en leg kort uit. Verzin geen extra bedrijfsinformatie.

🛠️ Opdracht – Maak en test jouw navigatie

1. Maak een hoofdmenu met minimaal vier en maximaal zes belangrijke pagina’s van jouw website.
2. Zorg dat Home, Nieuws en Contact vanuit het hoofdmenu bereikbaar zijn.
3. Voeg in de footer een link toe naar een pagina of tijdelijk concept met de titel Privacy.
4. Voeg één externe link toe die relevant is voor jouw fictieve organisatie. Geef de link een duidelijke tekst.
5. Maak alleen een submenu als je minimaal twee onderliggende pagina’s hebt die bij één hoofdonderwerp horen.
6. Test het menu op desktop én in een smal browservenster of op je telefoon.
7. Laat één klasgenoot of andere tester een taak uitvoeren, bijvoorbeeld: “Zoek de contactpagina” of “Vind de nieuwsberichten”. Noteer wat goed ging en wat je hebt aangepast.
8. Maak een screenshot waarop het hoofdmenu zichtbaar is.

🧠 Reflectie

• Waarom staan niet alle links in het hoofdmenu?
• Wat is het verschil tussen een interne en externe link?
• Welk resultaat kwam uit jouw gebruikerstest en welke verbetering heb je gedaan?
• Als je AI hebt gebruikt: welke suggestie heb je wel of niet toegepast, en waarom?

📤 Inleveren

1. 07-navigatie-jouwnaam.jpg: screenshot van jouw website met zichtbaar hoofdmenu en zichtbare URL.
2. 07-gebruikerstest-jouwnaam.pdf of 07-gebruikerstest-jouwnaam.txt: de uitgevoerde taak, het resultaat, jouw aanpassing en de reflectievragen.

08 Plugins en functionaliteit

🎯 Leerdoelen

• Je kunt uitleggen wat een WordPress-plugin is.
• Je kunt een plugin kritisch beoordelen vóór je hem installeert.
• Je kunt een plugin installeren, activeren, instellen en testen.
• Je begrijpt waarom te veel of verouderde plugins risico’s geven.
• Je kunt de keuze voor een plugin onderbouwen.

💡 Uitleg: wat is een plugin?

Een plugin is een uitbreiding die extra functies toevoegt aan WordPress. Voorbeelden zijn een contactformulier, spambeveiliging, een fotogalerij, caching, SEO-hulp of een webwinkel.

Een thema bepaalt vooral hoe een website eruitziet. Een plugin bepaalt vooral wat een website extra kan doen. Je kunt meerdere plugins tegelijk actief hebben, maar iedere plugin moet worden onderhouden en kan invloed hebben op snelheid, privacy en veiligheid.

🔎 Een plugin verantwoord kiezen

Installeer niet zomaar de eerste plugin uit een zoekresultaat. Controleer vooraf:

• Functie: lost deze plugin een concreet probleem op dat jouw site echt heeft?
• Onderhoud: is de plugin recent bijgewerkt?
• Compatibiliteit: is de plugin getest met jouw WordPress-versie?
• Reputatie: hoeveel actieve installaties en beoordelingen heeft de plugin? Lees ook enkele recente beoordelingen.
• Privacy: verzamelt of verstuurt de plugin gegevens? Is dat nodig en duidelijk?
• Alternatief: kan WordPress of je thema dit al zonder extra plugin?

Gebruik bij voorkeur plugins uit de officiële WordPress-pluginbibliotheek of van een betrouwbare leverancier. Download geen ‘premium’-plugins van onbekende of illegale websites.

💡 Plugin installeren en testen

1. Ga in het dashboard naar Plugins → Nieuwe plugin toevoegen.
2. Zoek naar de gekozen plugin en controleer de informatie uit de checklist.
3. Klik op Nu installeren en daarna op Activeren.
4. Open de instellingen van de plugin en configureer alleen wat je begrijpt en nodig hebt.
5. Test de functie in de frontend. Een geïnstalleerde plugin is pas nuttig wanneer de functie ook daadwerkelijk werkt.
6. Gebruik je de plugin niet meer? Deactiveer én verwijder hem. Een inactieve, ongebruikte plugin moet je niet bewaren.

📝 Voorbeeld: contactformulier

Een contactformulier is een bruikbare uitbreiding voor veel websites. Denk vooraf na over welke gegevens echt nodig zijn. Voor een eenvoudige contactvraag zijn naam, e-mailadres en bericht vaak voldoende. Vraag niet om privégegevens die je niet nodig hebt.

Test een formulier altijd met een eigen testbericht. Controleer zowel of de bezoeker een duidelijke bevestiging krijgt als of de e-mail werkelijk aankomt. Gebruik voor een schoolopdracht geen echte persoonsgegevens van anderen.

🤖 AI gebruiken bij pluginonderzoek

AI kan helpen om een functiewens om te zetten in selectiecriteria of om instellingen uit te leggen. Laat AI geen plugin “goedkeuren” zonder dat jij zelf de officiële pluginpagina, recente updates en privacy-informatie controleert.

Voorbeeldprompt:

Ik heb voor een kleine fictieve WordPress-site een contactformulier nodig. Geef een checklist met maximaal zes punten waarmee ik plugins zelf kan vergelijken op functionaliteit, onderhoud, privacy en veiligheid. Noem geen specifieke plugins; ik controleer de officiële WordPress-pluginpagina’s zelf.

🛠️ Opdracht – Voeg nuttige functionaliteit toe

1. Kies één concrete behoefte voor jouw website: een contactformulier, galerie, spambeveiliging of een andere functie die nog niet in WordPress of je thema aanwezig is.
2. Vergelijk minimaal twee plugins uit de officiële WordPress-pluginbibliotheek met de checklist uit deze les.
3. Kies één plugin en noteer waarom deze het beste past.
4. Installeer en activeer de plugin.
5. Stel de plugin in en voeg de functionaliteit toe aan een passende pagina.
6. Test de functie in de frontend. Bij een formulier verstuur je een testbericht met verzonnen testgegevens.
7. Maak een screenshot van de werkende functie én een screenshot van de actieve plugin in het dashboard.

🧠 Reflectie

• Welke functie heb je toegevoegd en waarom heeft jouw website die nodig?
• Welke twee plugins heb je vergeleken en op welke criteria heb je gelet?
• Hoe heb je getest dat de plugin werkt?
• Wat is het risico van verouderde of ongebruikte plugins?
• Als je AI hebt gebruikt: welke informatie heb je zelf gecontroleerd?

📤 Inleveren

1. 08-plugin-dashboard-jouwnaam.jpg: screenshot waarop de gekozen plugin actief zichtbaar is.
2. 08-plugin-werkt-jouwnaam.jpg: screenshot van de werkende functionaliteit in de frontend.
3. 08-plugin-keuze-jouwnaam.pdf of 08-plugin-keuze-jouwnaam.txt: vergelijking, keuze, testresultaat en antwoorden op de reflectievragen.

09 Beheer, veiligheid, privacy, SEO en performance

🎯 Leerdoelen

• Je kunt uitleggen waarom updates en back-ups nodig zijn.
• Je kunt basismaatregelen nemen voor een veilige WordPress-site.
• Je begrijpt waarom een formulier alleen noodzakelijke persoonsgegevens mag vragen.
• Je kunt basis-SEO toepassen zonder zoekwoorden te misbruiken.
• Je kunt enkele oorzaken van een trage website herkennen.

🔐 Beheer: updates en back-ups

Een WordPress-site is nooit helemaal ‘klaar’. WordPress zelf, thema’s en plugins krijgen updates voor nieuwe functies, fouten en beveiliging. Controleer regelmatig Dashboard → Updates.

Maak vóór een grotere update altijd een back-up. Een bruikbare back-up bevat zowel de WordPress-bestanden als de database. Controleer ook waar de back-up staat en hoe je die kunt terugzetten. Een back-up die je niet kunt terugvinden of herstellen, helpt niet bij een probleem.

Werk bij voorkeur eerst lokaal of op een testomgeving en pas daarna de live website aan. WordPress adviseert updates en een back-up vóór je een update uitvoert. [WordPress: Updating WordPress]

Basisveiligheid

• Gebruik een uniek, sterk wachtwoord en deel dit niet met anderen.
• Geef gebruikers alleen de rechten die zij nodig hebben.
• Verwijder ongebruikte plugins en thema’s.
• Installeer alleen uitbreidingen uit betrouwbare bronnen.
• Werk WordPress, plugins en thema’s bij en test na de update belangrijke functies.
• Gebruik op een live site altijd HTTPS.

⚖️ Privacy en formulieren

Een naam, e-mailadres, telefoonnummer en IP-adres kunnen persoonsgegevens zijn. Verzamel daarom alleen gegevens die je echt nodig hebt voor het doel van een formulier. Leg bezoekers in begrijpelijke taal uit welke gegevens je verwerkt, waarom je dat doet, hoe lang je ze bewaart en met wie je ze deelt.

Voor deze cursus gebruik je in formuliertests uitsluitend verzonnen testgegevens of je eigen schooltestadres. Zet geen echte persoonsgegevens van klasgenoten of klanten in een oefenomgeving. Een echte website heeft daarnaast een passende privacyverklaring nodig. De AVG is van toepassing zodra een organisatie persoonsgegevens verwerkt; raadpleeg bij twijfel de organisatie en de actuele informatie van de Autoriteit Persoonsgegevens.

🔎 SEO: vindbaar én nuttig

SEO staat voor zoekmachineoptimalisatie. Het doel is niet om zoekmachines te misleiden, maar om nuttige, duidelijke inhoud te maken die aansluit bij wat bezoekers zoeken.

• Geef elke pagina een duidelijke, unieke titel.
• Schrijf inhoud voor bezoekers, met logische koppen en korte alinea’s.
• Gebruik beschrijvende interne links, bijvoorbeeld Bekijk onze vakantiehuizen.
• Gebruik relevante afbeeldingen met zinvolle alt-teksten.
• Maak geen pagina’s vol herhaalde zoekwoorden. Dat is onprettig voor bezoekers en werkt tegen je.

Google gebruikt onder meer de inhoud rondom een afbeelding en de alt-tekst om te begrijpen waar de afbeelding over gaat. Schrijf daarom beschrijvend en in context. [Google Search Central: afbeeldings-SEO]

⚡ Performance: een snelle website

Een snelle website is prettiger voor bezoekers en gebruikt minder data. Grote, ongecomprimeerde afbeeldingen en een grote hoeveelheid plugins kunnen een site onnodig traag maken.

• Upload afbeeldingen op een passende afmeting en in een efficiënt formaat, zoals WebP of JPG.
• Gebruik alleen noodzakelijke plugins.
• Controleer na iedere nieuwe plugin of de website nog goed werkt en laadt.
• Gebruik eventueel caching op een live site, maar test altijd of wijzigingen zichtbaar blijven.

🤖 AI verantwoord gebruiken bij beheer

AI kan een onderhoudschecklist uitleggen of helpen een foutmelding te analyseren. Deel nooit wachtwoorden, databasegegevens, klantgegevens, back-ups of volledige configuratiebestanden in een AI-chat. Controleer technische adviezen altijd met officiële documentatie of je docent, vooral wanneer een advies bestanden, database of beveiligingsinstellingen verandert.

Voorbeeldprompt:

Ik beheer een kleine WordPress-site. Maak een maandelijkse onderhoudschecklist met maximaal acht veilige controles voor updates, back-ups, links en formulierwerking. Noem geen betaalde plugins en vraag mij om eerst een back-up te maken voordat ik grote wijzigingen uitvoer.

🛠️ Opdracht – Maak jouw site klaar voor beheer

1. Ga naar Dashboard → Updates en controleer of WordPress, jouw thema en actieve plugins bijgewerkt zijn. Voer in deze oefenomgeving alleen updates uit als je docent dat toestaat.
2. Maak een onderhoudschecklist met minimaal zes punten, waaronder updates, back-up, formulier, links en afbeeldingen.
3. Controleer jouw contactformulier uit stap 8. Verwijder velden die niet noodzakelijk zijn voor een eenvoudige contactvraag.
4. Maak een pagina met de titel Privacy. Zet hierin een kort oefenconcept: welke gegevens een formulier vraagt, waarom en hoe een bezoeker contact kan opnemen. Gebruik dit concept niet als juridisch document voor een echte organisatie.
5. Verbeter minimaal twee SEO-punten op jouw site, bijvoorbeeld paginatitels, koppen, linkteksten of alt-teksten.
6. Controleer jouw mediabibliotheek en vervang of verwijder minimaal één te grote, ongebruikte of onduidelijke afbeelding.
7. Test in de frontend: homepage, nieuws, menu, formulier en Privacy-pagina.

🧠 Reflectie

• Waarom moet een back-up uit bestanden én een database bestaan?
• Welke persoonsgegevens vraagt jouw formulier en waarom zijn die nodig?
• Welke twee SEO-verbeteringen heb je aangebracht?
• Welke actie kan jouw website sneller maken?
• Als je AI hebt gebruikt: welke gegevens heb je bewust niet gedeeld en hoe heb je een advies gecontroleerd?

📤 Inleveren

1. 09-privacy-jouwnaam.jpg: screenshot van de Privacy-pagina met zichtbare URL.
2. 09-checklist-jouwnaam.pdf of 09-checklist-jouwnaam.txt: jouw onderhoudschecklist en antwoorden op de reflectievragen.

10 Eindproject en livegang

🎯 Leerdoelen

• Je kunt een WordPress-website bouwen op basis van een opdrachtgeverbrief.
• Je kunt inhoud, vormgeving, navigatie en functionaliteit als één geheel opleveren.
• Je kunt een lokale WordPress-site veilig voorbereiden op een live server.
• Je kunt de website testen op inhoud, mobiel gebruik, toegankelijkheid en formulieren.
• Je kunt jouw keuzes toelichten in een korte presentatie.

📋 Opdrachtgeverbrief

Je bouwt een website voor het fictieve vakantiepark De Eekhoorn. Het park verhuurt vakantiehuizen aan gezinnen die rust, natuur en activiteiten zoeken. De opdrachtgever wil een rustige, betrouwbare en gebruiksvriendelijke website waarop bezoekers informatie kunnen vinden en een reserveringsaanvraag kunnen doen.

Werk met eigen, rechtenvrij of door de docent aangeleverd materiaal. Gebruik geen echte klantgegevens, echte reserveringen of persoonsgegevens van anderen in je testsite.

🛠️ Eisen voor de website

📄 Inhoud

• Home: duidelijke introductie, aantrekkelijke afbeelding, korte uitleg en een duidelijke vervolgstap.
• Over het park: informatie over ligging, faciliteiten en activiteiten.
• Woningtypes: minimaal drie typen vakantiehuizen met beschrijving, kenmerken en afbeeldingen.
• Nieuws: minimaal twee berichten met categorieën en tags.
• Contact / reserveringsaanvraag: een getest formulier met alleen noodzakelijke velden.
• Privacy: een eenvoudig oefenconcept dat uitlegt welke formuliergegevens worden gevraagd en waarom. Dit is geen juridisch document voor een echte organisatie.

🎨 Ontwerp en toegankelijkheid

• Gebruik een passend, betrouwbaar onderhouden WordPress-thema.
• Pas een consistente huisstijl toe: kleuren, lettertypen en knoppen passen bij elkaar.
• Gebruik informatieve afbeeldingen met alt-teksten.
• Gebruik een logische koppenstructuur en beschrijvende linkteksten.
• Zorg dat de site leesbaar en bruikbaar is op mobiel en desktop.

⚙️ Functionaliteit en beheer

• Maak een hoofdmenu met maximaal zes hoofdlinks en een footer met een Privacy-link.
• Gebruik minimaal één nuttige plugin die je kritisch hebt gekozen en getest.
• Gebruik duidelijke, leesbare permalinks.
• Controleer of WordPress, actieve plugins en het actieve thema bijgewerkt zijn, voor zover de docent dit toestaat.
• Maak een back-up van bestanden én database vóór de livegang.

🧭 Werkwijze

1. Plan: maak een eenvoudige sitemap met de verplichte pagina’s. Bepaal daarna jouw huisstijl en verzamel toegestane beelden.
2. Bouw lokaal: werk eerst in jouw lokale WordPress-installatie. Maak en test alle pagina’s, berichten, menu’s en plugins.
3. Laat testen: vraag minimaal één tester om twee taken uit te voeren, bijvoorbeeld “vind een woningtype” en “stuur een reserveringsaanvraag”. Verwerk minimaal één verbetering.
4. Maak back-up: maak een kopie van zowel de WordPress-bestanden als de database. Noteer waar de back-up staat.
5. Zet live: verplaats pas na toestemming van de docent de bestanden en database naar de aangewezen server of Plesk-omgeving.
6. Test live: controleer de volledige website opnieuw via de live URL.

🌐 Livegang: van lokaal naar live

Je bouwt de website dus niet opnieuw op de server. Je verhuist de bestaande lokale website: de WordPress-bestanden én de database.

1. Maak op de server een domein of subdomein, een database en een databasegebruiker aan.
2. Upload de WordPress-bestanden naar de juiste webmap.
3. Importeer de lokale database in de nieuwe serverdatabase.
4. Pas de databasegegevens in wp-config.php aan naar die van de server.
5. Vervang de lokale URL, bijvoorbeeld http://localhost/wp-jouwnaam, veilig door de live URL. Gebruik hiervoor een migratietool of WP-CLI; voer geen gewone zoek-en-vervangactie uit in phpMyAdmin, omdat WordPress-instellingen beschadigd kunnen raken.
6. Log in op de live site en sla via Instellingen → Permalinks de permalinkinstellingen eenmaal opnieuw op.
7. Schakel HTTPS in als de server dit aanbiedt en test de live website.

De officiële WordPress-handleiding waarschuwt dat een gewone database-zoek/vervangactie problemen kan veroorzaken met geserialiseerde gegevens. Gebruik daarom een veilige migratiemethode en maak eerst een back-up. [WordPress: site migreren]

🤖 AI in het eindproject

AI mag je gebruiken voor brainstormen, taalcontrole, feedback op structuur, een testplan of hulp bij een foutmelding. Jij blijft verantwoordelijk voor de inhoud, bronnen, toegankelijkheid, privacy en technische werking. Vermeld in je verantwoording kort waarvoor je AI hebt gebruikt en welke uitkomst je zelf hebt aangepast of gecontroleerd.

Deel nooit wachtwoorden, databasegegevens, FTP-inloggegevens, back-upbestanden of persoonsgegevens met een AI-tool.

✅ Eindcontrole vóór je inlevert

• Werken alle pagina’s, menu’s, interne links en externe links?
• Werkt het formulier met testgegevens en is de bevestiging duidelijk?
• Zijn de belangrijkste pagina’s goed leesbaar op mobiel?
• Hebben informatieve afbeeldingen alt-teksten en een toegestane bron?
• Is de Privacy-pagina bereikbaar via de footer?
• Zijn er geen wachtwoorden, echte persoonsgegevens of testinhoud zichtbaar?
• Heb je een back-up van bestanden én database?
• Werkt de website via HTTPS op de live URL, indien livegang onderdeel is van jouw opdracht?

📤 Inleveren

1. De URL van jouw live website. Als livegang niet mogelijk is, lever je de lokale URL plus een korte toelichting in volgens de afspraak met je docent.
2. 10-eindproject-jouwnaam.pdf: sitemap, gebruikte beeldbronnen, plugin-keuze, resultaat van de gebruikerstest, onderhoudschecklist en AI-verantwoording.
3. Een korte presentatie waarin je de website laat zien en jouw belangrijkste keuzes toelicht.

📊 Beoordeling

• Inhoud en structuur: pagina’s, berichten en navigatie zijn compleet en logisch.
• Vormgeving en toegankelijkheid: de site is consistent, leesbaar en bruikbaar op mobiel.
• Functionaliteit: de gekozen plugin en het formulier werken aantoonbaar.
• Beheer en professionaliteit: privacy, updates, back-up en testcontrole zijn aantoonbaar meegenomen.
• Onderbouwing: je kunt jouw keuzes, testresultaten en AI-gebruik helder uitleggen.

--