Als u de structuur van uw HTML-documenten zorgvuldig plant, kunt u computers helpen betekenis te krijgen voor uw inhoud . Een goede syntaxis is zeker belangrijk, maar biedt in feite alleen parsers, zoekmachines en ondersteunende techologieën met een betekenisloze hoeveelheid gegevens.
Als u uw front-endworkflow verbetert door aandacht te besteden aan semantiek, kunt u inhoud van hogere kwaliteit maken die meer bezoekers trekt. Semantiek is de studie van betekenis, in een bredere context is het een tak van logica en linguïstiek .
In de wereld van webontwikkeling praten we over semantische inhoud wanneer computers de structuur van een document begrijpen en de rollen van de elementen erin . Als we de juiste semantiek willen creëren, moeten we de structuur van onze inhoud en de mogelijkheden van frontend-technologieën grondig begrijpen .
Dus wat zijn de tastbare voordelen? Een goede semantiek betekent een meer doorzoekbare inhoud die leidt tot een betere positie in de zoekmachine . We vergroten ook de toegankelijkheid, omdat ondersteunende technologieën zoals schermlezers de betekenis van onze inhoud beter kunnen interpreteren .
Er zijn veel verschillende front-end ontwikkelingstechnieken waarmee ontwikkelaars een semantische paginastructuur kunnen realiseren. Dit bericht geeft u een korte introductie van semantische HTML-tags en het concept van de documentomtrek.
Semantische en niet-semantische HTML-tags
Het concept van de semantiek is niet zo nieuw als het lijkt, het bestond al ruim voor het tijdperk van HTML5. De term semantisch web werd al in 2001 bedacht door Sir Tim Berners-Lee. Onder 'semantisch web' bedoelde hij een web van gegevens dat door machines kan worden verwerkt.
Dit betekent in de eerste plaats dat afzonderlijke HTML-elementen hun onderscheiden structurele rollen moeten hebben . Volgens de definitie van W3C "beschrijft een semantisch element duidelijk de betekenis ervan voor zowel de browser als de ontwikkelaar".
Semantische elementen vóór HTML5
Semantische elementen bestonden ook vóór HTML5, maar in de meeste gevallen wisten ontwikkelaars niet dat sommige van de tags die ze gebruikten, eigenlijk semantisch waren . Denk maar aan de
of de -tags.
Hun rollen zijn duidelijk voor ons en de user-agent: