Hoe maak je een eigen 'Error 404'-pagina?

Laatste aanpassing op: Ma, 1 Aug, 2016 at 5:00 PM


Je bent er vast wel eens ooit eentje tegengekomen. Zo'n standaard witte errorpagina met de melding "HTTP-fout 404 - Bestand niet gevonden". Deze wordt weergegeven als een pagina niet gevonden kan worden (error code 404).

Het zou natuurlijk mooi zijn als deze qua design en uitstraling overeen zou komen met jouw site. Wat je zou kunnen doen is gebruikmaken van de standaard pagina's van jouw hostingprovider en deze aanpassen naar eigen inzicht.

Zo heeft Alphamega een viertal errorpagina's ter beschikking gesteld en één daarvan correspondeert met de 404-foutmelding, namelijk not_found.html. Deze errorpagina's zijn ondergebracht in de directory error_docs in jouw webruimte. Wil je deze aanpassen dan moet je ze eerst downloaden, daarna wijzigen en vervolgens opnieuw uploaden naar dezelfde directory. Let op! In deze directory mogen geen andere bestanden staan dan deze 4 errorpagina's. Ook mag je de naam van de bestanden niet veranderen. De webserver zoekt namelijk naar een pagina met een bepaalde naam indien hij een error tegenkomt en hiervoor de errorpagina wil tonen.

Je kunt er ook voor kiezen om zelf je eigen errorpagina's te maken. Hiervoor heb je een .htaccess-bestand nodig. Als errorpagina's van belang zijn voor je website, dan is dit de methode die wij jou aanraden, omdat de mogelijkheden van deze manier wat meer uitgebreid zijn. Waar we ons in dit artikel mee bezig gaan houden is het aanmaken van een error 404-pagina. De volgende stappen zijn hiervoor nodig. Let op! Dit werkt alleen op Apache webservers! (Alle Alphamega hosting servers draaien Apache.) 

Je eigen error 404-pagina maken:
Ontwerp je eigen errorpagina met behulp van je favoriete HTML-editor (bijv. Dreamweaver). Als je tevreden bent over het resultaat, sla je hem op onder een herkenbare naam, bijv. fout404.html. De extensie .html mag natuurlijk ook .htm, .php of .cgi zijn. Upload deze vervolgens naar jouw webruimte. Je zou bijv. je eigen errorpagina kunnen opslaan in een directory 'errors'.
N.B. Microsoft Internet Explorer verwacht een error 404-pagina van minimaal 512 bytes. Is dit niet het geval, dan blijft deze de standaard error 404-pagina tonen.

Het aanmaken van het .htaccess-bestand:
Om je eigen error 404-pagina te kunnen gebruiken heb je een .htaccess-bestand nodig. Dit kun je aanmaken met een simpele tekst-editor, zoals Kladblok (start -> Uitvoeren / Zoeken -> Kladblok of Notepad). In dit bestand geef je dan aan dat jouw eigen error 404-pagina getoond moet worden, indien een pagina niet gevonden kan worden. De inhoud van het .htaccess-bestand ziet er dan ook als volgt uit: ErrorDocument 404 /errors/fout404.html

Heb je de error 404-pagina niet ondergebracht in een directory errors maar in de root van de directory waar ook jouw site staat dan ziet de code er als volgt uit: ErrorDocument 404 /fout404.html
 
Sla het bestand op als ".htaccess". Je mag de aanhalingstekens niet vergeten, anders kan Kladblok het bestand namelijk niet opslaan. Upload ten slotte het .htaccess-bestand in ASCII-mode naar de root directory van jouw webruimte. Bij Alphamega is dit de directory httpdocs. Na het uploaden van het .htaccess-bestand is het mogelijk dat dit niet zichtbaar is als je met jouw FTP-programma jouw webruimte bekijkt. Toch is het aanwezig. Probeer het maar eens met FileZilla en dan zul je merken dat het .htaccess-bestand wel te zien is.

Je eigen error 404-pagina testen: Als het goed is moet de door jou gemaakte error 404-pagina nu werken. Je kunt dit testen door een foutieve URL in de adresbalk van je browser te typen, bijvoorbeeld http://www.jouwdomein.com/blabla.htm. Als het goed is krijg je nu jouw eigen error 404-pagina te zien. Er zijn natuurlijk ook nog andere errors die je zou kunnen krijgen. Elk van deze fouten heeft zijn eigen nummerieke errorcode (bv. 401,403, 500). Je kunt dus voor elk van deze codes je eigen error-pagina maken, op de zelfde manier zoals hierboven is beschreven. Je voegt dan voor elke errorpagina een extra regel toe in het .htaccess-bestand. Een overzicht van alle voorkomende errors is te vinden op w3.org Veel succes!


Vond je dit antwoord nuttig? Ja Nee

Kun je aangeven hoe we dit artikel kunnen verbeteren?
Excuses voor het Engelstalige formulier