Wat is HTML? Hypertext markup language simpel uitgelegd

HTML staat voor HyperText Markup Language. Het is een cruciale bouwsteen voor de meeste websites. Echter, bedenk dat HTML niet wordt beschouwd als een programmeertaal omdat het geen dynamische functionaliteit kan genereren.

In dit artikel gaan we kijken naar wat HTML precies is, hoe het werkt, hoe je HTML kunt leren, en nog veel meer.

Wat is HTML?

HTML (Hypertext Markup Language) is een computertaal die terug kunt vinden in de meeste webpagina’s en online applicaties. Hypertext is een tekst die wordt gebruikt om naar andere stukken tekst te refereren, terwijl markup language verwijst naar een serie markeringen die webservers de structuur en stijl van een document duidelijk maakt.

HTML wordt gebruikt voor veel verschillende doeleinden:

Web development. Developers gebruiken HTML code om een browser te vertellen hoe het verschillende webpagina elementen moet tonen, zoals tekst, hyperlinks en media bestanden.
Internet navigatie. Gebruikers kunnen eenvoudig pagina’s navigeren dankzij hyperlinks die via HTML geplaatst worden.
Web documentatie. HTML maakt het eenvoudig om op een consistente manier documenten te formatteren en organiseren.

Hoe werkt HTML?

De meeste websites bevatten meerdere HTML pagina’s. De home pagina, contact pagina en verschillende blog artikelen hebben allemaal hun eigen HTML bestanden.

HTML documenten zijn bestanden die eindigen met .html of .htm. Een web browser leest deze bestanden en toont de content op zo’n manier dat website bezoekers het kunnen zien en begrijpen.

Iedere HTML pagina bestaat uit een serie van HTML elementen: tags en attributen. Dit zijn de bouwstenen van een pagina. Een tag vertelt de webbrowser waar een element begint en eindigt, terwijl een attribuut de karakteristieken van een element beschrijft.

Hieruit bestaat een HTML element:

Opening tag. Dit wordt gebruikt om aan te geven waar een element begint. Bijvoorbeeld, <html> is de tag die wordt gebruikt om het begin van de HTML pagina aan te geven.
Content. Dit is de wat website bezoekers zien.
Closing tag. Dit is hetzelfde als de opening tag, maar nu staat er een schuine streep voor de naam van het element. Bijvoorbeeld: </html> om het einde van de HTML pagina aan te geven.

Wanneer je deze 3 elementen met elkaar combineert, krijg je een HTML element. Dat kan er bijvoorbeeld zo uit zien:

<h1>Zo voeg je een pagina titel toe in HTML</h1>

Meest gebruikte HTML tags en elementen

Op het moment van schrijven zijn er 142 HTML elementen beschikbaar waarmee je verschillende elementen kunt creëren. Als je interesse hebt in web development, is het nuttig de belangrijkste van deze elementen te kennen.

In deze sectie gaan we kijken naar de meest gebruikte HTML tags en de twee hoofdelementen: block-level elementen en inline elementen.

Block-level elementen

Block-level elementen zijn even breed als de pagina zelf. Deze beginnen altijd met een nieuwe regel binnen een document. Bijvoorbeeld, een heading element bevindt zich altijd in een andere regel dan een paragraaf element.

Iedere HTML pagina bestaat altijd uit de volgende 3 tags:

<html> tag geeft aan dat het document een HTML document is.
<head> tag bevat meta details zoals de titel van de pagina.
<body> tag bevat alle content die op de pagina verschijnt.

Dit zijn nog een aantal andere populaire block-level tags:

Heading tags. Deze lopen van <h1> tot <h6>. H1 is de grootste en fungeert als de titel van de pagina. H2 tot H6 fungeren als subtitels.
Paragraaf tags. Tekst paragrafen worden gemaakt met de <p> tag.
Lijst tags. Om genummerde (<ol>) en bullet-point (<ul>) lijstjes te maken.

Inline elementen

Inline elementen zijn van toepassing op de content binnen block-level elementen. Denk hier bijvoorbeeld aan het dikdrukken van tekst of het toevoegen van links. Bijvoorbeeld, om tekst dik te drukken kun je de <strong> tag gebruiken.

De volgende stap binnen HTML: HTML5

De eerste versie van HTML had 18 tags. Elke daaropvolgende versie bevatte er meer. De meest omvattende nieuwe versie was HTML5, die werd geïntroduceerd in 2014.

Het belangrijkste verschil tussen HTML en HTML5 is dat HTML5 nieuwe vormen van controles ondersteunt. Daarnaast introduceerde HTML5 ook verschillende semantic tags die duidelijk de soort content aangeven, zoals, <header>, <footer> en <article>.

Hoe werkt HTML samen met JavaScript en CSS?

Met HTML voeg je tekst elementen toe aan een pagina en structureer je de content. HTML op zichzelf is echter niet voldoende om een volwaardige website mee te ontwikkelen. HTML wordt praktisch altijd gebruikt in samenwerking met CSS (Cascading Style Sheets) en JavaScript om website content de lucht in te krijgen.

Met CSS kun je dingen doen zoals achtergrond kleuren aanpassen, randen aan afbeeldingen toevoegen, ruimte tussen verschillende elementen toevoegen en animaties maken. JavaScript is verantwoordelijk voor dynamische functionaliteit zoals foto galerijen, pop-ups en sliders.

Samen vormen HTML, JavaScript en CSS de fundering van front-end web development.

HTML leren

Als je geïnteresseerd bent in web development is het leren van HTML een must. Gelukkig barst het internet van de HTML resources.

Een goede eerste stap is het volgen van gratis YouTube tutorials. Bevalt dit, dan zou je kunnen kijken naar de HTML cursussen van Codeacademy. Codeacademy biedt gratis beginner cursussen HTML en biedt gevorderde cursussen voor $19,99 per maand.

Lees hier meer over HTML leren.

Veelgestelde vragen

Waar wordt HTML voor gebruikt?

HTML (Hypertext Markup Language) is de code die wordt gebruikt om een webpagina en de inhoud ervan te structureren. Inhoud kan bijvoorbeeld worden gestructureerd via een stel alinea's, een lijst met bullet points, of met afbeeldingen en tabellen.

Moet je HTML begrijpen om een site te kunnen ontwikkelen?

Vroeger was dit wel het geval, maar tegenwoordig niet meer. Je kunt bijvoorbeeld een website maken met WordPress zonder ook maar enige HTML kennis.

Dat gezegd hebbende is het wel handig enige basiskennis van HTML te hebben wanneer je een website bouwt.

Is het moeilijk om HTML te leren?

Voor de meeste mensen niet. HTML is geen programmeertaal, maar een taal die de opmaak van een pagina bepaald. Dit maakt het relatief eenvoudig op te pikken voor beginners. Je kunt de basics van HTML in een uurtje onder de knie krijgen. Zodra je de tags begrijpt, kun je direct al je eigen HTML pagina’s in elkaar zetten.