Inhoud

HTML en semantiek

In het template dat dat ik later zal presenteren worden HTML tabellen gebruikt voor de positionering van elementen op de pagina. HTML tabellen lenen zich hier heel goed voor, bovendien is het eenvoudige HTML die makkelijk uit te leggen is. Ideaal! Je kunt er echter over discussiëren of HTML tabellen hier ook echt voor bedoeld zijn. Veel HTML professionals vinden dat HTML tabellen verkeerd gebruikt worden als je ze voor de opmaak van een hele webpagina gebruikt. Tabellen zijn bedoeld om 'tabulaire' informatie in op te nemen, zoals loonoverzichten, prijstabellen of vergelijkingstabellen. Daar is wat voor te zeggen als je het begrip "semantiek" bij de zaak betrekt.

HTML is niet alleen bedoeld om een webpagina op een bepaalde manier weer te geven in de browser. Met veel HTML tags kun je ook iets zeggen over de informatie die ze omsluiten. Zulke tags geven betekenis (semantiek) aan hetgene ze omsluiten. Zo moeten de <table> </table> tags eigenlijk tabulaire data omsluiten. Tekst in een (nieuws)artikel moet opgedeeld zijn in <p>paragrafen</p> en een lijstje met links moet met een HTML lijst (<ul> of <ol>) gemaakt zijn.

Op de eerste pagina zag je een voorbeeld van de <b>bold</b> tag. Als je deze gebruikt bedoel je alleen dat de tekst binnen de tags dik gedrukt moet zijn in de browser. De <strong> </strong> tags hebben in de meeste browsers hetzelfde effect: de tekst wordt dik gedrukt. Echter, de <strong> tag zegt meer dan de <b> tag. Als je <strong> gebruikt wil je de nadruk leggen op een bepaald woord in de tekst. Een client programma die de webpagina bekijkt weet daardoor meer over een webpagina dan alleen hoe hij eruit ziet. Tekst die tussen <strong></strong> tags staat is blijkbaar belangrijk.

Samengevat: Sommige tags voegen betekenis toe aan een document. Voorbeelden zijn <h1>header</h1>, <p>paragraaf</p>, <strong>strong</strong> en <em>emphasize</em>. Sommige tags die betekenis toevoegen hebben tegenhangers die géén betekenis toevoegen, maar alleen een weergave-functie hebben., bijvoorbeeld <strong> en <b>. Voor de opmaak van een pagina bevelen profi webmasters vaak het gebruik van DIV en CSS aan in plaats van tabellen. Je kunt met deze technieken pagina-elementen site-breed op de pagina positioneren en styleren vanuit een centraal CSS document.

In deze uitleg maken we een website met tabellen. Het is makkelijk en het werkt en dat is nu even het uitgangspunt. Houd als je zelf een website gaat maken wel het begrip semantiek in je achterhoofd, omdat het ook van invloed is op hoe zoekmachines de inhoud van een pagina beoordelen. In een perfecte wereld bestaan er alleen semantisch correcte webpagina's met geldige HTML. Maar de wereld is niet perfect, dus je bent niet verloren met een tabellen-opmaak. Tekstenuitleg is er ook mee opgegroeid.