de sitefabriek.

Blog / Websitekwaliteit

Een goede 404-pagina maken: help bezoekers verder bij een ontbrekende URL

Maak een bruikbare 404-pagina met duidelijke uitleg en werkende links. Leer wanneer een redirect past en hoe je inhoud én HTTP-status controleert met Claude Code.

· De Sitefabriek

Een bezoeker opent een oude link of maakt een tikfout in een webadres. Wat gebeurt er dan op jouw website? Een goede 404-pagina legt begrijpelijk uit dat de pagina niet gevonden is en biedt een logische uitweg. Tegelijk moet de technische reactie passen bij de ontbrekende URL.

In deze gids maak je een plan voor die pagina, bepaal je wanneer een redirect nodig is en formuleer je een controleopdracht voor Claude Code. Het doel is dat iemand verder kan, ook wanneer het oorspronkelijke adres niet werkt.

Eigen schematisch voorbeeld van een 404-pagina met een begrijpelijke melding, links naar homepage en aanbod en een bijpassende HTTP-status

1. Begrijp wat een 404 betekent

De HTTP-status 404 betekent dat de server de gevraagde bron niet kan vinden. Een tikfout, een verwijderde pagina of een verkeerd opgebouwde link kan daar bijvoorbeeld toe leiden. De status zelf zegt niet of die afwezigheid tijdelijk of permanent is. (MDN: 404 Not Found)

Je kunt bij zo’n reactie een eigen pagina tonen met uitleg en navigatie. Het uiterlijk en de technische status zijn verschillende onderdelen die je allebei controleert. Een fraai ontworpen scherm is nog geen bewijs dat de server ook de bedoelde status teruggeeft.

Begin daarom met de vraag waarom de URL ontbreekt. Hoort de pagina nog te bestaan, dan onderzoek je de route of publicatie. Is de informatie naar een andere plek verhuisd, dan kijk je naar een passende redirect. Is er geen relevante vervanging, dan kan een echte 404-reactie de juiste uitkomst zijn.

Neem eerst de link over waarmee je het probleem tegenkomt en noteer waar die staat. Vergelijk het adres met de bedoelde bestemming. Een fout in je eigen menu kun je vaak bij de bron oplossen door de link correct te maken.

Gebruik deze drie situaties als beslishulp:

  • De pagina hoort op dit adres te bestaan. Controleer de route, de publicatiestatus en de juiste websiteversie. Herstel de toegang tot de bedoelde inhoud.
  • De inhoud is verplaatst. Leg vast welk oud adres bij welke nieuwe bestemming hoort. Kies de redirect die bij een tijdelijke of permanente verhuizing past.
  • De inhoud bestaat niet meer en heeft geen passende opvolger. Toon een begrijpelijke niet-gevondenpagina met relevante mogelijkheden om verder te gaan.

Een permanente serverredirect gebruikt bijvoorbeeld status 301 of 308. Google beschrijft het verschil met tijdelijke redirects en adviseert een type te kiezen dat de situatie weergeeft. (Google Search Central: redirects)

Stuur niet ieder onbekend adres automatisch naar de homepage. Een bezoeker die een specifieke handleiding verwacht, komt daarmee misschien op een pagina die zijn vraag niet beantwoordt. Bepaal de bestemming op basis van de inhoud die werkelijk is verhuisd.

De gids over websitenavigatie en interne links helpt je om de verwijzingen binnen je website daarna bij te werken.

3. Schrijf een korte melding en bied een echte uitweg

Zet bovenaan wat er aan de hand is. “Deze pagina vinden we niet” is voor veel bezoekers begrijpelijker dan alleen een groot getal. Een korte vervolgzinsnede kan uitleggen dat het adres mogelijk gewijzigd is of niet klopt, zonder te doen alsof je de precieze oorzaak kent.

Een eigen tekstvoorbeeld:

Herbruikbare briefing
Deze pagina vinden we niet.

Het adres is mogelijk gewijzigd of niet correct.
Ga naar de homepage of bekijk het dienstenoverzicht.

Koppel de aangeboden mogelijkheden aan echte, werkende bestemmingen. Kies wat past bij je site: de homepage, een dienstenoverzicht, een artikelenoverzicht of een bestaande zoekfunctie. Bied geen zoekveld aan als er geen werkende zoekfunctie achter zit.

Houd rekening met iemand die rechtstreeks via een externe link op de foutpagina komt. Een knop “Terug” is dan niet altijd de meest behulpzame enige optie. Geef minstens een duidelijke route naar nuttige inhoud binnen je website.

Gebruik de bestaande vormgeving en herkenbare naam van je site. Een illustratie mag helpen om het scherm leesbaar en herkenbaar te maken, maar de uitleg en links moeten op zichzelf bruikbaar blijven.

4. Controleer de HTTP-status naast de zichtbare pagina

Vraag bij de technische uitvoering expliciet om de reactie van de ontbrekende URL te controleren. Laat niet alleen de foutmelding bekijken. Een pagina die ontbrekende inhoud meldt maar een successtatus teruggeeft, kan door Google als een soft 404 worden behandeld. (Google: HTTP-statuscodes en soft 404)

Je kunt de status bijvoorbeeld bekijken in het netwerkpaneel van de browser bij het documentverzoek. Let erop dat je het antwoord van de pagina zelf leest, niet dat van een los plaatje of script. Noteer ook de uiteindelijke URL wanneer er een redirect plaatsvindt.

Gebruik een klein controlesetje:

  1. Een bestaande pagina die gewoon moet werken.
  2. Een verzonnen URL die niet bij de site hoort.
  3. Een oud adres waarvoor bewust een redirect is ingesteld, als zo’n adres bestaat.

Het pad /voorbeeld-bestaat-hier-niet is een fictief voorbeeld voor een niet-bestaand adres. Controleer eerst dat jouw website dat pad niet werkelijk gebruikt. Een foutpagina onder een apart adres openen vertelt niet vanzelf hoe een willekeurig ontbrekend adres wordt afgehandeld.

Google gebruikt de inhoud van URLs met een 4xx-reactie niet voor indexering in Google Search. Gebruik een 404 daarom voor ontbrekende inhoud, en controleer dat belangrijke bestaande pagina’s niet per ongeluk zo reageren. (Google over 4xx-reacties)

5. Geef Claude Code een afgebakende opdracht

Laat eerst onderzoeken hoe je project ontbrekende routes nu afhandelt. Het juiste bestand en gedrag hangen af van het gebruikte framework en de hosting. Geef de gewenste tekst, bestemmingen en controle mee, en laat bestaande pagina’s en toegangsregels behouden.

Onderstaande eigen briefing kun je aanpassen:

Herbruikbare briefing
Verbeter de niet-gevondenpagina van dit websiteproject.
Lees eerst de projectafspraken en relevante frameworkdocumentatie.
Onderzoek hoe ontbrekende routes nu worden afgehandeld.

Gewenste zichtbare inhoud:
[korte melding en uitleg]

Bied deze bestaande bestemmingen aan:
[linkteksten en gecontroleerde URLs]

Gebruik de bestaande stijl en toegankelijke bedieningen.
Maak de pagina leesbaar op desktop en mobiel.
Verander geen bestaande routes of toegangsregels.
Voeg geen algemene redirect van alle onbekende URLs toe.

Controleer vóór oplevering:
- een bestaande pagina blijft bereikbaar;
- een echte ontbrekende route toont de bedoelde pagina;
- de HTTP-reactie past bij het bedoelde gedrag;
- de aangeboden links werken;
- eventuele afgesproken redirects eindigen op de juiste bestemming.

Rapporteer de gecontroleerde URLs en de uitkomst.

Pas deze opdracht aan als je probleem juist een verplaatste pagina betreft. Geef dan een lijst met oude en nieuwe adressen en laat de betrokken verwijzingen beoordelen. Voor werk aan een bestaande site kun je het stappenplan voor aanpassen met Claude Code gebruiken.

6. Controleer vóór en na publicatie

Test de uitvoering eerst in de afgesproken lokale of previewomgeving. Controleer na publicatie ook de publieke URLs. De inrichting van je hosting kan invloed hebben op de afhandeling van routes, dus een lokale controle alleen is niet het volledige antwoord.

  • ☐ Een ontbrekend adres toont een begrijpelijke melding.
  • ☐ De aangeboden bestemmingen bestaan en werken.
  • ☐ De pagina is leesbaar op een smal scherm.
  • ☐ Links en knoppen zijn met het toetsenbord bereikbaar.
  • ☐ De technische reactie is gecontroleerd voor een ontbrekende URL.
  • ☐ Een bestaande pagina blijft de bedoelde inhoud tonen.
  • ☐ Afgesproken redirects hebben een relevante eindbestemming.
  • ☐ Verkeerde interne links zijn bij de bron hersteld.

Bewaar een korte lijst met gecontroleerde adressen en open punten. Combineer dit met de SEO-checklist voor een nieuwe website voor andere controles rond vindbaarheid. Wil je de verbetering als duidelijke bouwopdracht voorbereiden? Gebruik dan de gratis briefing voor Claude Code.