Achterhaalde HTML-elementen, deel 1

In de HTML-specificaties zijn in de loop der tijd diverse elementen afgekeurd. Door het gebruik van achterhaalde bronnen zie je tegenwoordig op internet helaas nog veel afgekeurde elementen terug. Ook hebben sommigen nog elementen in gebruik die helemaal nooit zijn goedgekeurd. Welke elementen worden afgeraden en wat zijn de alternatieven? In deel 1: afgekeurde elementen met CSS-alternatieven.

Inhoud

Gebruik CSS voor layout en (tekst)opmaak

Een internetpagina bestaat vaak uit plaatjes, geluid of andere multimediale elementen (objecten), tekst, scripts, opmaak en een taal die het allemaal aan elkaar verbindt (markup). Deze taal is meestal HTML of XHTML. Hoewel (X)HTML ook gebruikt kan worden om de opmaak van de pagina te regelen, bestaat er sinds 1996 een taal die nadrukkelijk bedoeld is om de opmaak van internetpagina’s te regelen: Cacading Style Sheets, kortweg CSS. Door nalatigheid van browserfabrikanten heeft het nog jaren geduurd voordat CSS goed gebruikt kon worden, maar daar is anno 2006 geen excuus meer voor: iedereen heeft tegenwoordig een browser die met CSS om kan gaan (tenzij je met speciale soft- of hardware op internet surft). Het W3C, het instituut dat de HTML-specificaties maakt, heeft dan ook besloten om elementen te schrappen (‘deprecated‘) die door CSS geregeld kunnen (en zouden moeten) worden.

Welke elementen zijn afgekeurd?

De afgekeurde elementen zijn applet, basefont, center, dir, font, isindex, menu, s, strike en u. Hiervan bespreek ik de meestgebruikte.

Center

center wordt gebruikt om elementen horizontaal te centreren. HTML is echter niet bedoeld voor layoutdoeleinden, daar is CSS voor. Horizontaal centeren doe je in CSS met margin. Heb je een div in de body, dan centreer je de div binnen body als volgt:

 div {margin: 0 auto} 

Vergeet de div niet een bepaalde breedte mee te geven; iets centreren dat een onbekende breedte heeft, is namelijk niet te centreren. In het voorbeeld van horizontaal centreren met margins centreer ik een div van 400 pixels.

Het kan voorkomen dat je site dan nog steeds niet gecentreerd is. Een mogelijke oorzaak kan zijn, dat je de site bekijkt IE5, maar die gebruikt tegenwoordig niemand meer. Een meer plausibele verklaring is dat je geen valide doctype gebruikt. Wanneer je met CSS werkt, is een correct doctype essentieel. Lees elders op deze site over het nut van een doctype en welk doctype je dan zou moeten kiezen.

Font

font wordt gebruikt om de tekstopmaak te regelen. Zoals je wellicht zelf al gemerkt hebt, komt als je niet oplet na verloop van tijd je document vol te staan met font-elementen. Da’s niet overzichtelijk, niet handig om te onderhouden en bovendien achterhaald. CSS to the rescue.

Wil je alle alinea’s in Arial, dan regel je dat als volgt:

 p {font-family: Arial, sans-serif} 

Ik heb een voorbeeld gemaakt waarin alle alinea’s in Arial worden weergegeven en alle andere elementen in het standaardfont van je browser (meestal Times New Roman).

U

u staat voor underline, het onderstrepen van elementen. Dit is met CSS te regelen via text-decoration: underline, maar ook dat is niet aan te raden. Het onderstrepen van elementen die geen links zijn, schept op internet namelijk veel verwarring onder websitebezoekers. Men denkt dan vaak ten onrechte dat er op te klikken valt. Onderstreep dus nooit tekst die geen link is!

Wordt vervolgd

In deel 2 ga ik verder in op elementen die niet zijn afgekeurd, maar waar wel een beter alternatief voor is. Ook behandel ik elementen die je wel eens tegenkomt, maar nooit tot de specificaties hebben behoord.

Je kunt meer lezen over overbodige metatags in het artikel De zin en onzin van metatags.

Wijziging 28 januari 2008: IE5-specifieke CSS verwijderd, aangezien er niet meer met IE5 wordt gesurft.