Wij maken gebruik van Cookies. Bekijk ons privacy policy

HTML

Wat is HTML?

HTML is de afkorting voor HyperText Markup Language. Het is de taal waarin de structuur van een website geschreven wordt. Het is de basis voor iedere pagina op een website. Deze taal wordt dan door je browser, zoals bijvoorbeeld Google Chrome of Mozilla Firefox vertaald naar een geheel dat iedereen makkelijk kan lezen.

HTML is dus een gestructureerde manier om data voor te stellen. Je kan er bijvoorbeeld titels, tekst, lijsten, tabellen, formulieren, data types en veel meer mee opmaken.

HTML is geen programmeertaal maar valt onder de statische talen. Het zet een basis structuur uit die data bevat. Met HTML kan je voor een stukje ook de vormgeving van een pagina in orde brengen, maar dit wordt voornamelijk met CSS gedaan.

 

De HTML van een pagina bekijken

Je kan voor iedere website de HTML code bekijken door ergens op de pagina rechts te klikken. Afhankelijk van je browser kies je voor een van de volgende opties:

  • Google Chrome: inspecteren
  • Mozilla Firefox: element inspecteren
  • Safari: toon paginabron

HTML pagina bekijken

Je krijgt nu de broncode van de pagina te zien:

HTML pagina

 

Hoe werkt HTML?

Bij HTML wordt er gebruik gemaakt van tags, elementen en attributen. Door de tags, elementen en attributen op de juiste plaats rond de tekst te plaatsen, zorg je ervoor dat een tekst duidelijker leesbaar wordt als iemand hem opent in een browser.

HTML-tags

Om een pagina op te maken met HTML gebruik je HTML-tags. Je hebt openingstags en sluitingstags. Tussen deze twee tags komt de inhoud van de pagina. Om een duidelijke webpagina te maken, zal je gebruik moeten maken van meerdere HTML-tags met daartussen telkens een deel van de inhoud.

Samen vormen de openingstag, de inhoud en de sluitingstag een HTML-element.

HTML-attributen

Naast tags heb je ook HTML-attributen. Deze kan je toevoegen aan een HTML-element. De HTML-attributen bevatten extra informatie over een element. Een voorbeeld van zo’n attribuut is “width”, met dit attribuut kan je aangeven hoe breed een element (bijvoorbeeld een afbeelding) moet zijn. HTML-attributen staan altijd in het openingsgedeelte van de tag.

Kort samengevat heb je dus een HTML-element, dat bestaat uit HTML-tags en de inhoud van de pagina. Aan zo’n element kan je extra informatie toevoegen door middel van een HTML-attribuut.

 

De belangrijkste HTML-elementen

Elke pagina bestaat uit een aantal basis HTML-elementen. De standaard opbouw van een pagina ziet er zo uit:

HTML voorbeeld

 

  • <!doctype html> geeft aan dat een pagina gemaakt is op basis van HTML5, dit de laatste versie van HTML en tegenwoordig dus de standaard.
  • <html> en </html> tags geven het begin en einde van het HTML-document aan.
    Het attribuut lang=”nl” geeft aan welke taal (lang = language) gebruikt wordt op de pagina. Je vindt dit attribuut terug vlak onder de doctype maar het kan ook in de tekst gebruikt worden wanneer een of meerdere zinnen in een tekst in een andere taal geschreven zijn.
  • Tussen de <head> en </head> tag staan de belangrijkste gegevens van de pagina. Dit zijn onder andere de titel (tussen <title> en </title>), de beschrijving en de gebruikte tekenset.
  • Het HTML-element dat bestaat uit de <body> en </body> tag geeft de inhoud weer die getoond zal worden. Binnen dit element plaats je dus de tekst, waarbij je gebruik maakt van andere HTML-tags om de leesbaarheid te optimaliseren.

De leesbaarheid van je tekst verbeteren met HTML

Om ervoor te zorgen dat je tekst makkelijk leesbaar is, maak je gebruik van titels en paragrafen. Welk stukje tekst een titel is en welk een paragraaf, geef je aan met bepaalde HTML-tags.

Om duidelijk te maken aan de webbrowser dat je tekst een gewone paragraaf is, plaats je de <p> tag voor het blok met tekst. Je sluit het blok af met </p>.

Om een titel aan te geven, plaats je title tags voor en na de tekst. De title tags gaan van <h1> tot en met <h6>. Daarbij is <h1> de belangrijkste titel. Je sluit de tag door achteraan de sluitingstag van hetzelfde titelniveau te gebruiken.

De titel van dit stukje tekst ziet er in HTML zo uit: <h3> De leesbaarheid van je tekst verbeteren met HTML </h3>.

Daarnaast zijn er nog een heleboel andere tags die je kunnen helpen om je tekst meer gestructureerd en beter leesbaar te maken. Zo kan je HTML-tags gebruiken om tabellen te maken, een quote toe te voegen of om een stukje tekst te onderlijnen, doorstrepen of in het vet te zetten. Ook voor afbeeldingen en video’s worden specifieke HTML-tags met bijhorende attributen gebruikt.

 

Welke kennis van HTML heb ik nodig?

Om een simpele webpagina te maken, heb je geen uitgebreide HTML-kennis nodig. Het volstaat vaak om de basisprincipes zoals hierboven uitgelegd onder de knie te hebben. Uiteraard kan je met die basis geen wonderen verrichten. Maar wanneer je kleine aanpassingen wil doen aan een pagina, kom je hier al een heel eind mee.

Daarnaast kan je voor specifieke problemen altijd wel een how-to of tutorial terugvinden op het internet. Zoals wel eens gezegd wordt: Google is your best friend!

 

HTML voor SEO

Heeft HTML invloed op je SEO? Ja! Zoekmachines gebruiken de HTML-tags om jouw website te begrijpen. Het is dus belangrijk dat je ze correct gebruikt, zodat de crawlers kunnen achterhalen hoe je pagina in elkaar zit en waar hij over gaat.

De volgende tags zijn belangrijk voor SEO:

Al deze HTML-tags dragen bij aan je on-page SEO en heb je dus zelf in de hand.

Inhoudsopgave