Is een semantische HTML code belangrijk voor de SEO van je website?Door Jacco van Lith - 15 October 2014

Het is al weer een tijd geleden dat ‘het internet’ is overgestapt van HTML4 naar HTML5. Hierbij zijn een aantal grote maar vooral goede veranderingen doorgevoerd. Een deel hiervan ligt in de codes die de websites opbouwen.

Voorheen maakte de webbouwer voornamelijk gebruik van

tags. Hiermee werden verschillende divisies aangeduid die allemaal een eigen onderdeel van de website bevatten. Denk hierbij aan header, top, bottom, footer, menu, navigation, main, container, content, article, sidebar, enzovoort.. Een divisie kreeg dan bijvoorbeeld detag mee om gaan te geven dat dat deel van de pagina de header bevatte. Helaas gebruikte niet iedere webbouwer dezelfde id’s en werd het delen van content tussen verschillende platformen of websites steeds lastiger. Ook werd het op deze manier voor zoekmachines zoals Google bijna onmogelijk om de correcte pagina content te identificeren.

 

Met HTML5 hebben ze het internet recht getrokken en gezorgd voor een duidelijke en eenduidige indeling die voor iedere website zou gelden. In plaats van zelf een id te bedenken, werden deze div elementen hun eigen tag, bijvoorbeeld:

,

,,,, enzovoort.. Hierdoor wisten zowel de zoekmachines als andere websites welke content ze waar kunnen vinden.

 

Naast deze hoofdondedelen van een website zijn er ook nog de tags die hierbinnen horen. Zoals de H1- tot H6-tags, paragraph-tags, img-tags, link-tags, enzovoort.. Semantiek speelt een grote rol als je met jouw website een hoge positie in Google wil bemachtigen. Er wordt bijvoorbeeld meer waarde gehecht aan de inhoud van een kop, dan aan die van een paragraaf.

Helaas zien de experts van DBOM het nog té vaak mis gaan. Zo komen wij vaak pagina’s tegen die geen H1-tag hebben. Dit is te vergelijken als een boek zonder hoofstukken. Voor een zoekmachine is het één grote lap tekst zonder begin. Deze tag wordt ook vaak gebruikt als opmaak van bijvoorbeeld de links in het menu. Zo krijgt een pagina opeens 6 H1-tags, welke geen van alle een goede beschrijving van de pagina geven.

Ook is het logisch om na een H1-tag verder te gaan met een H2-tag voor bijvoorbeeld een tussenkopje. Toch komt het nog vaak voor dat een pagina van H1 naar H3 gaat, wat in de ogen van een zoekmachine hetzelfde is als een hoofdstuk van een boek eruit scheuren en dan nog verwachten dat Google weet waar de pagina over gaat.

En last but not least, de img-tag. De img-tag wordt gebruikt om een afbeelding in een website te plaatsen. Google heeft geen ogen en kan niet zien wat er op een afbeelding staat. Daarom is het de taak van de webbouwer om hier tekst en toelichting bij te voegen middels de attributen van de tag. Door gebruik te maken van het ALT-attribuut kan je aan de zoekmachine laten lezen waar de afbeelding over gaat. Ook helpt de tekst die in de buurt van de afbeelding staat met identificatie proces.

Bijvoorbeeld: zwarte ronde salontafel voor binnen

Wil je meer weten over de juiste semantiek voor je website? Neem dan een kijkje bij W3schools. Hier wordt stap voor stap uitgelegd hoe deze tags werken en wat de juiste nesting is.