Websites met stijl

Naslag: algemene elementen

Op dit naslagblad

Algemene elementen:

Algemene elementen

De hier genoemde elementen zijn 'grote' elementen.
Ze bevatten meestal een flink onderdeel van een webpagina en omvatten vaak zelf andere elementen zoals alinea's, afbeeldingen e.d.

Al deze elementen zijn blok-elementen, ze nemen in principe de hele beschikbare regel in.

Geen van de elementen heeft speciale attributen.

Article

Vorm:
<article>...</article>
Vereiste attributen:
geen
Functie:
Dit element bevat een artikel, een stuk tekst dat een geheel vormt.
Denk aan een forum artikel, een blog-tekst, een krantenartikel.
Opmerking:
In plaats van article kan ook het algemene element div gebruikt worden.
Gebruik van article heeft het voordeel dat zoekmachines dan 'weten' dat het element een artikel bevat.

Aside

Vorm:
<aside>...</aside>
Vereiste attributen:
geen
Functie:
Dit element bevat een neventekst, dat te maken heeft met de hoofdtekst, maar daar niet toe behoort.
Die tekst zou in een zijbak geplaats kunnen worden.
Opmerking:
In plaats van aside kan ook het algemene element div gebruikt worden.
Gebruik van aside heeft het voordeel dat zoekmachines dan 'weten' dat het element een neventekst bevat.

Body

Vorm:
<body>...</body>
Vereiste attributen:
geen
Functie:
Dit element bevat de hele inhoud van de webpagina: tekst, afbeeldingen, lijsten, hyperlinks enz.
De plaats van body blijkt uit de onderstaande figuur:
<html> <head> <title>titel van de webpagina</title> </head>
<body> inhoud van de webpagina... </body> </html>

Div

Vorm:
<div>...</div>
Vereiste attributen:
geen
Functie:
Het element div (division) is het algemene element voor een onderdeel van een webpagina.
Vroeger werd dit element heel veel gebruikt.
Sinds html5 worden in plaats van hiervan de nieuwe elementen article, aside, footer, header, main, nav en section gebruikt voor resp. een artikel, een neventekst, de hoofdtekst, het menu, een sectie.
Div wordt nu nog gebruikt in alle gevallen waarin niet een speciaal element beschikbaar is.

Vorm:
<footer>...</footer>
Vereiste attributen:
geen
Functie:
Dit element bevat de voettekst. Deze wordt geacht informatie te bevatten over het omsluitende element (het element waarin die voettekst staat), zoals informatie over de auteur, copyright, contact informatie, sitemap.
Opmerkingen:
In plaats van footer kan ook het algemene element div gebruikt worden.
Gebruik van footer heeft het voordeel dat zoekmachines 'weten' dat het element een voettekst is.
Er kunnen verschillende footer elementen in een webpagina voorkomen, bijvoorbeeld een voettekst voor de hele webpagina, een voettekst bij een artikel op de pagina.

Vorm:
<header>...</header>
Vereiste attributen:
geen
Functie:
Dit element bevat de koptest.
Deze wordt geacht inleidende informatie te bevatten of een aantal links naar onderdelen van de pagina, bv. een of meer koppen (h1..h6), logo, auteur.
Opmerkingen:
In plaats van header kan ook het algemene element div gebruikt worden.
Gebruik van header heeft het voordeel dat zoekmachines 'weten' dat het element een koptekst is.
Er kunnen verschillende header elementen in een webpagina voorkomen.

Main

Vorm:
<main>...</main>
Vereiste attributen:
geen
Functie:
Dit element bevat de hoofdtekst van de webpagina.
Opmerkingen:
In plaats van main kan ook het algemene element div gebruikt worden.
Gebruik van main heeft het voordeel dat zoekmachines 'weten' dat het element een hoofdtekst bevat.

Nav

Vorm:
<nav>...</nav>
Vereiste attributen:
geen
Functie:
Dit element bevat het menu, het blok met navigatie-links.
Opmerkingen:
In plaats van nav kan ook het algemene element div gebruikt worden.
Gebruik van nav heeft het voordeel dat zoekmachines 'weten' dat het element het (hoofd-)menu is.

Section

Vorm:
<section>...</section>
Vereiste attributen:
geen
Functie:
Dit element bevat een sectie.
Een sectie is een thematische groepering van inhoud, meestal met een titel.
Opmerking:
In plaats van section kan ook het algemene element div gebruikt worden.
Gebruik van section heeft het voordeel dat zoekmachines 'weten' dat het element een sectie bevat.