{"id":6,"date":"2006-11-29T00:28:41","date_gmt":"2006-11-28T23:28:41","guid":{"rendered":"https:\/\/dev.frontaal.net\/2006\/11\/achterhaalde-elementen-deel-1\/"},"modified":"2019-08-29T18:32:35","modified_gmt":"2019-08-29T16:32:35","slug":"achterhaalde-elementen-deel-1","status":"publish","type":"post","link":"https:\/\/dev.frontaal.net\/en\/200611\/achterhaalde-elementen-deel-1\/","title":{"rendered":"Achterhaalde HTML-elementen, deel 1"},"content":{"rendered":"<p>In de <abbr title=\"HyperText Markup Language\">HTML<\/abbr>-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 <abbr title=\"Cascading Style Sheets\">CSS<\/abbr>-alternatieven.<\/p>\n<h3>Inhoud<\/h3>\n<ul>\n<li><a href=\"#opmaak\">Gebruik <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> voor layout en (tekst)opmaak<\/a><\/li>\n<li><a href=\"#afgekeurd\">Welke elementen zijn afgekeurd?<\/a>\n<ul>\n<li><a href=\"#html-center\"><code>Center<\/code><\/a><\/li>\n<li><a href=\"#html-font\"><code>Font<\/code><\/a><\/li>\n<li><a href=\"#html-u\"><code>U<\/code><\/a><\/li>\n<\/ul>\n<\/li>\n<li><a href=\"#vervolgd\">Wordt vervolgd<\/a><\/li>\n<\/ul>\n<h3 id=\"opmaak\">Gebruik <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> voor layout en (tekst)opmaak<\/h3>\n<p>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 <abbr title=\"HyperText Markup Language\">HTML<\/abbr> of <abbr title=\"eXtensible HyperText Markup Language\">XHTML<\/abbr>. Hoewel (X)<abbr title=\"HyperText Markup Language\">HTML<\/abbr> 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\u00e2\u20ac\u2122s te regelen: Cacading Style Sheets, kortweg <abbr title=\"Cascading Style Sheets\">CSS<\/abbr>. Door nalatigheid van browserfabrikanten heeft het nog jaren geduurd voordat <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> goed gebruikt kon worden, maar daar is anno 2006 geen excuus meer voor: iedereen heeft tegenwoordig een browser die met <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> om kan gaan (tenzij je met speciale soft- of hardware op internet surft). Het <abbr title=\"World Wide Web Consortium\">W3C<\/abbr>, het instituut dat de <abbr title=\"HyperText Markup Language\">HTML<\/abbr>-specificaties maakt, heeft dan ook <a href=\"http:\/\/www.w3.org\/TR\/html4\/index\/elements.html\" rel=\"external\">besloten om elementen te schrappen<\/a> (&#8216;<span lang=\"en\">deprecated<\/span>&#8216;) die door <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> geregeld kunnen (en zouden moeten) worden.<\/p>\n<h3 id=\"afgekeurd\">Welke elementen zijn afgekeurd?<\/h3>\n<p>De afgekeurde elementen zijn <!--more--> <code>applet<\/code>, <code>basefont<\/code>, <code>center<\/code>, <code>dir<\/code>, <code>font<\/code>, <code>isindex<\/code>, <code>menu<\/code>, <code>s<\/code>, <code>strike<\/code> en <code>u<\/code>. Hiervan bespreek ik de meestgebruikte.<\/p>\n<h4 id=\"html-center\"><code>Center<\/code><\/h4>\n<p><code>center<\/code> wordt gebruikt om elementen horizontaal te centreren. <abbr title=\"HyperText Markup Language\">HTML<\/abbr> is echter niet bedoeld voor layoutdoeleinden, daar is <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> voor. Horizontaal centeren doe je in <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> met <code>margin<\/code>. Heb je een <code>div<\/code> in de <code>body<\/code>, dan centreer je de <code>div<\/code> binnen <code>body<\/code> als volgt:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"css\">div {margin: 0 auto}<\/pre>\n<p>Vergeet de <code>div<\/code> 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 <code>div<\/code> van 400 pixels.<\/p>\n<p>Het kan voorkomen dat je site dan nog steeds niet gecentreerd is. Een mogelijke oorzaak kan zijn, dat je de site bekijkt <abbr title=\"Internet Explorer 5\">IE5<\/abbr>, maar die gebruikt tegenwoordig niemand meer. Een meer plausibele verklaring is dat je geen valide <code>doctype<\/code> gebruikt. Wanneer je met <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> werkt, is een correct <code>doctype<\/code> essentieel. Lees elders op deze site over <a href=\"\/en\/200611\/doctype-wat-moet-ik-ermee\/\">het nut van een <code>doctype<\/code><\/a> en <a href=\"\/en\/200612\/doctype-welke-moet-ik-kiezen\/\">welk <code>doctype<\/code> je dan zou moeten kiezen<\/a>.<\/p>\n<h4 id=\"html-font\"><code>Font<\/code><\/h4>\n<p><code>font<\/code> 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 <code>font<\/code>-elementen. Da\u00e2\u20ac\u2122s niet overzichtelijk, niet handig om te onderhouden en bovendien achterhaald. <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> to the rescue.<\/p>\n<p>Wil je alle alinea&#8217;s in Arial, dan regel je dat als volgt:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">p {font-family: Arial, sans-serif}<\/pre>\n<p>Ik heb een voorbeeld gemaakt waarin alle alinea&#8217;s in Arial worden weergegeven en alle andere elementen in het standaardfont van je browser (meestal Times New Roman).<\/p>\n<h4 id=\"html-u\"><code>U<\/code><\/h4>\n<p><code>u<\/code> staat voor underline, het onderstrepen van elementen. Dit is met <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> te regelen via <code>text-decoration: underline<\/code>, 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. <a href=\"http:\/\/www.useit.com\/alertbox\/20040510.html\" rel=\"external\">Onderstreep dus nooit tekst die geen link is<\/a>!<\/p>\n<h3 id=\"vervolgd\">Wordt vervolgd<\/h3>\n<p>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.<\/p>\n<p>Je kunt meer lezen over overbodige metatags in het artikel <a href=\"\/en\/200801\/de-zin-en-onzin-van-metatags\/\">De zin en onzin van metatags<\/a>.<\/p>\n<p><em>Wijziging 28 januari 2008<\/em>: <abbr title=\"Internet Explorer 5\">IE5<\/abbr>-specifieke <abbr title=\"Cascading Style Sheets\">CSS<\/abbr> verwijderd, aangezien er niet meer met <abbr title=\"Internet Explorer 5\">IE5<\/abbr> wordt gesurft.<\/p>","protected":false},"excerpt":{"rendered":"<p>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.<\/p>","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[2],"tags":[21,20],"class_list":["post-6","post","type-post","status-publish","format-standard","hentry","category-xhtml","tag-html","tag-markup"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Achterhaalde HTML-elementen, deel 1 - Frontaal.net<\/title>\n<meta name=\"description\" content=\"Diverse HTML-elementen zijn officieel afgekeurd, maar worden tegenwoordig helaas nog toegepast. Welke worden afgeraden en wat zijn de alternatieven?\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/dev.frontaal.net\/en\/200611\/achterhaalde-elementen-deel-1\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Achterhaalde HTML-elementen, deel 1 - Frontaal.net\" \/>\n<meta property=\"og:description\" content=\"Diverse HTML-elementen zijn officieel afgekeurd, maar worden tegenwoordig helaas nog toegepast. Welke worden afgeraden en wat zijn de alternatieven?\" \/>\n<meta property=\"og:url\" content=\"https:\/\/dev.frontaal.net\/en\/200611\/achterhaalde-elementen-deel-1\/\" \/>\n<meta property=\"og:site_name\" content=\"Frontaal.net\" \/>\n<meta property=\"article:published_time\" content=\"2006-11-28T23:28:41+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-08-29T16:32:35+00:00\" \/>\n<meta name=\"author\" content=\"Roger\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Roger\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/200611\\\/achterhaalde-elementen-deel-1\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/200611\\\/achterhaalde-elementen-deel-1\\\/\"},\"author\":{\"name\":\"Roger\",\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/#\\\/schema\\\/person\\\/e8631cdfacdde87e6de7132844853afe\"},\"headline\":\"Achterhaalde HTML-elementen, deel 1\",\"datePublished\":\"2006-11-28T23:28:41+00:00\",\"dateModified\":\"2019-08-29T16:32:35+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/200611\\\/achterhaalde-elementen-deel-1\\\/\"},\"wordCount\":582,\"commentCount\":0,\"keywords\":[\"html\",\"markup\"],\"articleSection\":[\"(X)HTML\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/dev.frontaal.net\\\/200611\\\/achterhaalde-elementen-deel-1\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/200611\\\/achterhaalde-elementen-deel-1\\\/\",\"url\":\"https:\\\/\\\/dev.frontaal.net\\\/200611\\\/achterhaalde-elementen-deel-1\\\/\",\"name\":\"Achterhaalde HTML-elementen, deel 1 - Frontaal.net\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/#website\"},\"datePublished\":\"2006-11-28T23:28:41+00:00\",\"dateModified\":\"2019-08-29T16:32:35+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/#\\\/schema\\\/person\\\/e8631cdfacdde87e6de7132844853afe\"},\"description\":\"Diverse HTML-elementen zijn officieel afgekeurd, maar worden tegenwoordig helaas nog toegepast. Welke worden afgeraden en wat zijn de alternatieven?\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/dev.frontaal.net\\\/200611\\\/achterhaalde-elementen-deel-1\\\/\"]}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/#website\",\"url\":\"https:\\\/\\\/dev.frontaal.net\\\/\",\"name\":\"Frontaal.net\",\"description\":\"Gedachten over UX research, webanalytics, toegankelijkheid en front-end webdevelopment\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/dev.frontaal.net\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/#\\\/schema\\\/person\\\/e8631cdfacdde87e6de7132844853afe\",\"name\":\"Roger\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/dev.frontaal.net\\\/wp-content\\\/litespeed\\\/avatar\\\/df9c94ef6fd365a989d62c475f7602c4.jpg?ver=1775969713\",\"url\":\"https:\\\/\\\/dev.frontaal.net\\\/wp-content\\\/litespeed\\\/avatar\\\/df9c94ef6fd365a989d62c475f7602c4.jpg?ver=1775969713\",\"contentUrl\":\"https:\\\/\\\/dev.frontaal.net\\\/wp-content\\\/litespeed\\\/avatar\\\/df9c94ef6fd365a989d62c475f7602c4.jpg?ver=1775969713\",\"caption\":\"Roger\"},\"sameAs\":[\"https:\\\/\\\/dev.frontaal.net\"],\"url\":\"https:\\\/\\\/dev.frontaal.net\\\/en\\\/author\\\/roger\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Achterhaalde HTML-elementen, deel 1 - Frontaal.net","description":"Diverse HTML-elementen zijn officieel afgekeurd, maar worden tegenwoordig helaas nog toegepast. Welke worden afgeraden en wat zijn de alternatieven?","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/dev.frontaal.net\/en\/200611\/achterhaalde-elementen-deel-1\/","og_locale":"en_US","og_type":"article","og_title":"Achterhaalde HTML-elementen, deel 1 - Frontaal.net","og_description":"Diverse HTML-elementen zijn officieel afgekeurd, maar worden tegenwoordig helaas nog toegepast. Welke worden afgeraden en wat zijn de alternatieven?","og_url":"https:\/\/dev.frontaal.net\/en\/200611\/achterhaalde-elementen-deel-1\/","og_site_name":"Frontaal.net","article_published_time":"2006-11-28T23:28:41+00:00","article_modified_time":"2019-08-29T16:32:35+00:00","author":"Roger","twitter_misc":{"Written by":"Roger","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/dev.frontaal.net\/200611\/achterhaalde-elementen-deel-1\/#article","isPartOf":{"@id":"https:\/\/dev.frontaal.net\/200611\/achterhaalde-elementen-deel-1\/"},"author":{"name":"Roger","@id":"https:\/\/dev.frontaal.net\/#\/schema\/person\/e8631cdfacdde87e6de7132844853afe"},"headline":"Achterhaalde HTML-elementen, deel 1","datePublished":"2006-11-28T23:28:41+00:00","dateModified":"2019-08-29T16:32:35+00:00","mainEntityOfPage":{"@id":"https:\/\/dev.frontaal.net\/200611\/achterhaalde-elementen-deel-1\/"},"wordCount":582,"commentCount":0,"keywords":["html","markup"],"articleSection":["(X)HTML"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/dev.frontaal.net\/200611\/achterhaalde-elementen-deel-1\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/dev.frontaal.net\/200611\/achterhaalde-elementen-deel-1\/","url":"https:\/\/dev.frontaal.net\/200611\/achterhaalde-elementen-deel-1\/","name":"Achterhaalde HTML-elementen, deel 1 - Frontaal.net","isPartOf":{"@id":"https:\/\/dev.frontaal.net\/#website"},"datePublished":"2006-11-28T23:28:41+00:00","dateModified":"2019-08-29T16:32:35+00:00","author":{"@id":"https:\/\/dev.frontaal.net\/#\/schema\/person\/e8631cdfacdde87e6de7132844853afe"},"description":"Diverse HTML-elementen zijn officieel afgekeurd, maar worden tegenwoordig helaas nog toegepast. Welke worden afgeraden en wat zijn de alternatieven?","inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/dev.frontaal.net\/200611\/achterhaalde-elementen-deel-1\/"]}]},{"@type":"WebSite","@id":"https:\/\/dev.frontaal.net\/#website","url":"https:\/\/dev.frontaal.net\/","name":"Frontaal.net","description":"Gedachten over UX research, webanalytics, toegankelijkheid en front-end webdevelopment","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/dev.frontaal.net\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/dev.frontaal.net\/#\/schema\/person\/e8631cdfacdde87e6de7132844853afe","name":"Roger","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/dev.frontaal.net\/wp-content\/litespeed\/avatar\/df9c94ef6fd365a989d62c475f7602c4.jpg?ver=1775969713","url":"https:\/\/dev.frontaal.net\/wp-content\/litespeed\/avatar\/df9c94ef6fd365a989d62c475f7602c4.jpg?ver=1775969713","contentUrl":"https:\/\/dev.frontaal.net\/wp-content\/litespeed\/avatar\/df9c94ef6fd365a989d62c475f7602c4.jpg?ver=1775969713","caption":"Roger"},"sameAs":["https:\/\/dev.frontaal.net"],"url":"https:\/\/dev.frontaal.net\/en\/author\/roger\/"}]}},"_links":{"self":[{"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/posts\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":7,"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/posts\/6\/revisions"}],"predecessor-version":[{"id":848,"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/posts\/6\/revisions\/848"}],"wp:attachment":[{"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/media?parent=6"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/categories?post=6"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dev.frontaal.net\/en\/wp-json\/wp\/v2\/tags?post=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}