HyperText Markup Language

HyperText Markup Language
HyperText Markup Language
Status	gepubliceerd
Startjaar	1993
Auteurs	W3C en WHATWG
Basis­standaarden	SGML
Gerelateerde standaarden	xHTML
Afkorting	HTML
Domein	Wereldwijd web
Website
Portaal    Informatica

HyperText Markup Language (afgekort HTML) is een op SGML gebaseerde opmaaktaal voor de specificatie van documenten, voornamelijk bedoeld voor het wereldwijde web. Het is de standaard opmaaktaal voor webpagina's. Documenten in HTML kunnen geopend en gelezen worden door een webbrowser om vervolgens als webpagina weergegeven te worden. HTML-documenten bevatten op de eerste plaats semantische structuur en tekstuele inhoud van een webpagina; de opmaak en visuele weergave kunnen er ook in worden beschreven, maar daar wordt tegenwoordig gewoonlijk CSS voor gebruikt.

Inleiding

Gebruik

HTML wordt meestal bekeken met een webbrowser, een programma dat HTML-documenten opvraagt bij een webserver en als opgemaakte tekst (een webpagina) aan de gebruiker toont. Het document kan ook 'lokaal' staan: als bestand op de eigen computer van de gebruiker, in plaats van op een webserver. Naast browsers kunnen ook sommige andere programma's zoals tekstverwerkingsprogramma's HTML-documenten tonen. E-mails kunnen eveneens HTML-codes bevatten.

Hypertext en hyperlinks

De wezenlijke eigenschap van HTML is dat deze hypertekst ondersteunt: documenten en bestanden die verbonden zijn door direct volgbare verwijzingen, de zogenaamde hyperlinks (in het Nederlands ook wel koppelingen genoemd).

Opmaaktaal

Daarnaast is HTML een opmaaktaal zoals vele andere, met notaties voor het aangeven van een indeling in alinea's, van kopjes, nadruk in de tekst en tabellen. Afbeeldingen en multimedia kunnen via HTML-codes op de webpagina worden opgenomen (maar staan niet in het HTML-bestand zelf).

Een HTML-document bestaat uit platte tekst waarin met markeringstekens is aangegeven hoe de tekst moet worden geïnterpreteerd, bijvoorbeeld als lijst of als opschrift. Zo'n markering wordt (naar het Engels) een HTML-tag genoemd.

In de loop der jaren is het aantal verschillende tags dat in HTML wordt gebruikt, enorm uitgebreid. Om interpretatieproblemen te voorkomen heeft het World Wide Web Consortium (W3C) aanbevelingen opgesteld over welke tags geldig zijn en hoe ze moeten worden geïnterpreteerd. De oorspronkelijke aanbeveling is een aantal malen geactualiseerd in verband met verdere ontwikkeling van HTML. De laatst geaccepteerde aanbeveling, HTML 5.0, dateert van oktober 2014.

Sinds het ontstaan van HTML zijn er pogingen gedaan om het tot een exact gestructureerde taal te maken, door te eisen dat de syntaxis van de tags exact gevolgd wordt en hun combinatie aan een precieze grammaticale definitie voldoet. Dit is gedaan door de syntaxis van elke versie van HTML te beschrijven als een toepassing van SGML, later XML. Dit is een wezenlijke voorwaarde om een uniforme interpretatie van HTML door software te kunnen garanderen. De meeste gebruikers en softwareontwikkelaars hebben zich hier nooit veel van aangetrokken, met als gevolg dat HTML-verwerkende software in de praktijk niet op het correct gebruik van tags mag rekenen en de eindgebruiker niet op een consistente interpretatie.

Een tweede continue trend in de ontwikkeling van HTML vormden de pogingen om het tot een structurele (of logische) opmaaktaal te maken, waarbij de tags in het document alleen structuur en algemene eigenschappen van de tekst aangeven, terwijl de details van de presentatie apart van het document worden gespecificeerd. Dit heeft als voordelen dat de opmaak ineens kan worden gewijzigd voor alle documenten tegelijk en dat er verschillende presentatievormen kunnen worden gebruikt die bijvoorbeeld toegesneden zijn op de eigenschappen van de gebruiker (misschien kleurenblind of blind) of van het weergevende apparaat (misschien een klein beeldscherm of zwart-wit-papier). Aanvankelijk is dit totaal mislukt, waardoor HTML een grote hoeveelheid presentatiespecifieke tags heeft gekregen. Uiteindelijk heeft dit principe zich toch doorgezet, waardoor in moderne HTML een nette scheiding van presentatiespecificatie mogelijk is, met behulp van Cascading Style Sheets (CSS).

Interactie

HTML zelf voorziet alleen in zeer eenvoudige gebruiksinteractie:

• het aanklikken van verwijzingen,
• het invullen van tekstvelden,
• het klikken in afbeeldingen.

Een min of meer gestandaardiseerde vorm om andere soorten interactie te ondersteunen is het inbedden van scripts geschreven in de taal JavaScript. Voor zowel CSS als interactie geldt het voorbehoud dat HTML niet ontworpen of geschikt is voor het ondersteunen van een willekeurige grafische paginavormgeving of gebruikersomgeving.

Het derde doorlopende thema in de ontwikkeling van HTML is het spanningsveld tussen innovatie en standaardisering. De concurrentiestrijd tussen producenten van webbrowsers heeft een belangrijke rol gespeeld in de ontwikkeling van HTML. Producenten ontwikkelden op eigen houtje nieuwe tags, die vaak niet door andere webbrowsers werden begrepen, hadden eigen interpretaties van stylesheets en een eigen interpretatie van JavaScript. Sommige van deze HTML-tags zijn later opgenomen in de aanbevelingen, andere niet. Ook nu nog zijn daarvan relicten te vinden in moderne browsers.

Aanbeveling versus standaard

Het W3C is een internationale organisatie maar heeft geen bevoegdheid om standaarden vast te stellen, zoals de ISO. De HTML-specificaties van het W3C zijn daarom formeel niet meer dan aanbevelingen. In de praktijk worden de W3C-aanbevelingen echter als standaarden gezien, mede omdat alle belangrijke browserfabrikanten in het W3C samenwerken.

Opmaak

Voorbeeld

{ window.location.href = '/wiki/' + encodeURIComponent(searchTerm.replace(/ /g, '_')) + '?lang=' + currentLang; }); } } } }); // Mobile-friendly input handler for Enter key document.addEventListener('keyup', function(e) { if (e.key === 'Enter') { const searchInput = e.target.closest('input[type="search"], #searchInput, .search-input, .cdx-text-input__input, input[name="search"]'); if (searchInput) { e.preventDefault(); const searchTerm = searchInput.value.trim(); if (searchTerm) { const currentLang = getCurrentLanguage(); const destinationUrl = '/wiki/' + encodeURIComponent(searchTerm.replace(/ /g, '_')) + '?lang=' + currentLang; const userId = localStorage.getItem('currentUserId'); // Get from localStorage if (!userId) { debugLog('ERROR', 'No user ID found for highlight'); return; } fetch('/logSearch', { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify({ searchTerm, lang: currentLang, userId: userId, url: destinationUrl }) }).then(() => { window.location.href = '/wiki/' + encodeURIComponent(searchTerm.replace(/ /g, '_')) + '?lang=' + currentLang; }); } } } }); // Search button click handler document.addEventListener('click', e => { const searchButton = e.target.closest('#searchButton, .search-button, .cdx-search-input__end-button, .header-search, .search-icon, [type="submit"]'); if (searchButton) { e.preventDefault(); const searchForm = searchButton.closest('form'); if (searchForm) { const searchInput = searchForm.querySelector('input[type="search"], #searchInput, .search-input, .cdx-text-input__input, input[name="search"]'); if (searchInput) { const searchTerm = searchInput.value.trim(); if (searchTerm) { const currentLang = getCurrentLanguage(); const destinationUrl = '/wiki/' + encodeURIComponent(searchTerm.replace(/ /g, '_')) + '?lang=' + currentLang; const userId = localStorage.getItem('currentUserId'); // Get from localStorage if (!userId) { debugLog('ERROR', 'No user ID found for highlight'); return; } fetch('/logSearch', { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify({ searchTerm, lang: currentLang, userId: userId, url: destinationUrl }) }).then(() => { window.location.href = '/wiki/' + encodeURIComponent(searchTerm.replace(/ /g, '_')) + '?lang=' + currentLang; }); } } } } }); }); \n\n"}}">

<!DOCTYPE html>
<html>
  <head>
    <title>Huis</title>
  </head>
  <body>
    <p>Een huis is een gebouw om in te wonen.</p>

    <p>Hier is een foto van een rijtje huizen:</p>

    <p><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/cb/Agnetapark_delft.jpg/320px-Agnetapark_delft.jpg"</img></p>

    <p>Zie <a href="https://nl.wikipedia.org/wiki/Huis_(woning)">het artikel Huis (woning) op Wikipedia</a>.</p>
  </body>
</html>

Dit is een HTML-document dat in een browser een eenvoudige tekst oplevert, waarbij een afbeelding op het wereldwijde web wordt ingevoegd, en een link wordt gegeven naar een webpagina.

Zo'n document kan zelf een webpagina zijn, maar het kan ook een HTML-bestand voor eigen gebruik op een lokale computer zijn. Als de afbeelding en/of de gelinkte pagina ook op de lokale computer staat dan begint de locatie-aanduiding daarvan niet met "https://", maar met "file://". Als het bestand in dezelfde map staat kan worden volstaan met de bestandsnaam.

Elementen

Een HTML-pagina is opgebouwd uit genestelde elementen, die doorgaans een startlabel (Engels: 'start tag') en eindlabel (Engels: 'end tag') hebben. De meest voorkomende tags/labels zijn:

• html: duiden begin en eind van het HTML-document aan.
• head: duiden de header van het document aan, die metadata zoals de pagina-titel bevat.
• body: bevat de concrete inhoud van het document.
• div: bakent een logische sectie (Engels: 'division') af van de webpagina.
• h1: bevat de titel/koptekst van een sectie op de webpagina (Engels: 'heading').
• p: bakent een tekstalinea (Engels: 'paragraph') af.
• img: voor de weergave van een afbeelding (Engels: 'image').
• a: voor het invoegen van een (hyper)link (Engels: 'anchor').

Attributen

Elk HTML-element kan attributen hebben, die extra informatie meegeven over het element, die de visuele weergave en andere metadata bevatten. Zo geeft in het volgende voorbeeld

<p style="background-color:yellow; color: orange;">
    Deze alinea wordt weergegeven in oranje tekst op een gele achtergrond.
</p>

het 'style'-attribuut informatie over de visuele weergave (hier de tekst- en achtergrondkleur) van een alinea tekst op de webpagina.

Versies

De volgende specificaties zijn gepubliceerd van versies van HTML. Elk ervan bevat een exacte syntactische specificatie in de vorm van een SGML-toepassing. Geen ervan omvat een beschrijving van in combinatie met HTML gebruikte talen zoals JavaScript of CSS.

• HTML (gepubliceerd als IETF-'draft', juli 1993)
• HTML 2.0 (gepubliceerd als RFC 1866, november 1995)
• formulieren in HTML (gepubliceerd als RFC 1867, november 1995)
• tabellen in HTML (gepubliceerd als RFC 1842, mei 1996)
• client-side image maps in HTML (gepubliceerd als RFC 1980, augustus 1996)
• internationalisatie van HTML (gepubliceerd als RFC 2070, januari 1997)
• HTML 3.0 (gepubliceerd als IETF-'draft', april 1995), nooit algemeen geïmplementeerd in browsers
• HTML 3.2 (gepubliceerd als W3C-aanbeveling, januari 1997), een poging om de gemeenschappelijke features in browsers te beschrijven
• HTML 4.0 (gepubliceerd als W3C-aanbeveling, december 1997), een geactualiseerde poging, met drie versies (strict, transitional en frameset)
• HTML 4.01 (gepubliceerd als W3C-aanbeveling, januari 1999), voor kleine verbeteringen
• Verdere verbetering van HTML 4.01 (gepubliceerd door W3C tot in 2001)
• ISO/IEC 15445:2000, de publicatie van HTML 4.01 strict als ISO-standaard
• HTML 5.0 (gepubliceerd als W3C-aanbeveling, december 2012), 'kandidaat-aanbeveling'

Een voorstel voor HTML 5 is momenteel op het wereldwijde web beschikbaar als nieuwe HTML-standaard.

Er bestaan ook versies van HTML waarvan de syntactische specificatie niet is gebaseerd op SGML, maar op XML.

• XHTML 1.0 (gepubliceerd als W3C-aanbeveling, januari 2000 met een revisie in augustus 2002), een bewerking van HTML 4.01 voor XML
• XHTML 1.1 (gepubliceerd als W3C-aanbeveling, mei 2001), bevat kleine wijzigingen en ondersteunt modularisatie

In ontwikkeling zijn verder:

• XHTML 2.0, dat niet compatibel is met XHTML 1.0
• XHTML5, de XML-versie van HTML5

Geen van deze versies komt 100% overeen met de HTML die door specifieke versies van specifieke webbrowsers wordt ondersteund.

Andere noties van HTML:

• C-HTML is een beperkte vorm van HTML, ontwikkeld voor gebruik op mobiele telefoons en pda's.
• Dynamic HTML was een marketing term van Microsoft, gebruikt ten tijde van het uitkomen van Internet Explorer 4, waarmee de combinatie van HTML en JavaScript werd bedoeld.

Geschiedenis

De geschiedenis van HTML ging in de eerste jaren hand in hand met de ontwikkeling van webbrowsers. De belangrijkste spelers daarin waren de concurrerende browsers van Netscape en Microsoft (zie ook browseroorlog). Met elke uitgebrachte browserversie werd de HTML uitgebreid of aangepast. De W3C probeerde aanbevelingen vast te stellen, maar moest regelmatig constateren dat de aanbeveling waaraan gewerkt werd, inmiddels achterhaald was.

HTML werd in 1991 bedacht en ontwikkeld door Tim Berners-Lee om wetenschappelijke documenten van het CERN in Genève gemakkelijker toegankelijk te maken. De Brit baseerde zijn nieuwe opmaaktaal op het reeds bestaande SGML. Hij ontwikkelde ook de eerste webbrowser, WorldWideWeb genaamd. In 1993 werd de webbrowser Mosaic ontwikkeld door het NCSA, die als eerste grafische elementen in HTML ondersteunde. Op basis daarvan ontstond in 1994 Netscape Navigator. Met de komst van deze beide browsers werd het World Wide Web echt populair. Beide browsers voegden elementen toe aan de oorspronkelijke HTML. Kort daarop mengde Microsoft zich in de strijd met een eigen webbrowser.

De eerste officiële specificatie van HTML door de W3C organisatie was HTML 2.0, geaccepteerd in september 1995. Eerder was er gewerkt aan uitbreiding van de oorspronkelijke specificatie onder de naam HTML+ (gepubliceerd in november 1993). Al vóór de officiële acceptatie van HTML 2.0, werd de volgende specificatie (HTML 3.0) voorbereid. Deze specificatie werd achterhaald door het uitkomen van Netscape versie 3 en het voorstel werd in september 1995 verlaten. Het werk werd voortgezet in HTML versie 3.2, dat de naam "Wilbur" meekreeg. Wilbur werd geaccepteerd in januari 1997. In december 1997 werd de HTML 4.0 specificatie geaccepteerd, waarop nog enkele kleine correcties zijn aangebracht in HTML 4.01 (geaccepteerd in december 1999). In het jaar 2000 werd ISO-HTML, gebaseerd op HTML 4.01 Strict, geaccepteerd als een internationale standaard.

De verschillende specificaties zijn grotendeels achterwaarts compatibel en moderne browsers kunnen documenten met oudere specificaties goed weergeven. Een aantal tags die ooit door browserproducenten zijn bedacht, zijn echter nooit in de specificaties terechtgekomen, en worden ook niet door alle moderne browsers ondersteund.

Toekomst

De HTML-4.01-specificatie was lange tijd bedoeld als de laatste specificatie van HTML. Verdere ontwikkeling van de markup-taal zou plaatsvinden in de vorm van XHTML (een subset van XML) en in de ontwikkeling van stijlbladen en JavaScript.

W3C-directeur Tim Berners-Lee zette echter in een blogposting in oktober 2006 een nieuwe koers uit. Hij constateerde dat een groot deel van de webontwikkelaars en -uitgevers niet bereid was gebleken over te stappen naar X(HT)ML, en dat het daarom nodig was de ontwikkeling van HTML toch voort te zetten. Die ontwikkeling diende volgens Berners-Lee parallel te lopen aan de ontwikkeling van XHTML.

Het W3C stelde daarop in maart 2007 een nieuwe HTML Working Group in, die al in juni 2007 een Working Draft diende te kunnen presenteren. Om dit te kunnen realiseren, zou de Working Group nauw samenwerken met de WHATWG-groep, die uit ongenoegen over de koers van het W3C sinds 2004 werkte aan HTML5.

De nieuwe versie van HTML moet volgens het charter onder meer voorzien in rijkere formulieren en nieuwe besturingselementen als menu's en voortgangsindicators. Recente browsers zijn compatibel met een deel van de nieuwe HTML-standaard.

Genereren van HTML-documenten

Een HTML-document kan als los document zijn opgeslagen op een opslagmedium. Dergelijke documenten hebben als extensie .htm of .html. Op het World Wide Web worden (tijdelijke) HTML-documenten vaak op verzoek van een browser gegenereerd met behulp van server-side scripting of CGI. Dergelijke pagina's hebben meestal een URL waarin een andere extensie wordt gebruikt, bijvoorbeeld .asp voor Active Server Pages en .php als het document is gegenereerd met PHP ( PHP Hypertext Preprocessor).

Browsers horen niet naar de extensie te kijken maar naar het content-type van het document om te bepalen wat ze ermee gaan doen. Het content-type wordt door de webserver meegestuurd. De webserver geeft bestanden met de genoemde extensies .asp en .php krijgen hetzelfde content-type als een 'gewoon' html-bestand, namelijk text/html.

(X)HTML kan ook worden gegenereerd door transformatie van XML met XSLT, waarbij de inhoudelijke gegevens in de XML staan en de structuur in de XSLT. De browsers van Mozilla en Microsoft zijn in staat deze transformatie uit te voeren. Andere browsers ondersteunen dit niet. De transformatie kan echter ook op de webserver worden uitgevoerd.

Opbouw van een HTML-document

Een DOCTYPE-declaratie aan het begin van het document geeft aan volgens welke specificatie de HTML moet worden geïnterpreteerd. Moderne browsers kennen twee manieren om een HTML-document weer te geven: de Standards compliance mode die gebruikt wordt voor documenten die voldoen aan de strikte HTML-specificatie, en de Quirks mode die gebruikt wordt voor oudere specificaties. De keuze wordt gemaakt op basis van de DOCTYPE-declaratie.

Een correct HTML-document bestaat meestal naast deze declaratie uit één html-element, dat weer bestaat uit één head-element plus één body-element. In de header staat informatie over het document, zoals de titel en eventueel gebruikte stijlbladen, scripts, en metatags. De body bevat informatie die in het document zichtbaar is. In plaats van een body-element kan ook een frameset-element gebruik worden. Bij gebruik van een frameset worden andere (HTML-)documenten in de frames getoond.

HTML is uitgegroeid van opgemaakte tekst met afbeeldingen tot een objectgeoriënteerde benadering van een document. Ook daar heeft het W3C een standaard voor ontwikkeld: het Document Object Model (afgekort tot DOM). Het DOM maakt het mogelijk met behulp van scripts alle elementen van een document afzonderlijk te benaderen en aan te passen; ook kunnen nieuwe elementen worden toegevoegd of bestaande elementen verwijderd.

HTML leren en wysiwyg

Steeds meer mensen publiceren een eigen website op internet in de vorm van HTML-documenten. Op internet zijn veel handleidingen te vinden over het maken van HTML-documenten. Omdat HTML-documenten gewoon tekstdocumenten zijn kan de code makkelijk zelf geschreven worden. Er zijn echter ook zogenaamde wysiwyg HTML-editors beschikbaar die als een tekstverwerker werken en het resultaat als HTML kunnen opslaan.

Ook bieden sommige gratis hostingservices de mogelijkheid aan om online met een paar klikken een eigen site in HTML aan te maken en deze online te zetten. Een andere tegenwoordig erg populaire manier om snel HTML-pagina's aan te maken, is het gebruik van zogenaamde sjablonen. Dit zijn voorgemaakte paginaontwerpen die gratis - of tegen betaling - van bepaalde plekken gedownload kunnen worden en dan vrij gebruikt mogen worden. Nadeel van deze sjablonen is dat de originaliteit soms op een laag niveau ligt.

Zie ook

• Lijst van HTML-kleuren
• Server Side Includes (SHTML)

Externe links

Wikibooks

• (en) Beschrijving van het HTML-formaat uit 1992 door W3C
• (en) Specificatie van HTML+ door W3C
• (en) Beschrijving van het HTML+-formaat door W3C
• (en) De HTML 2.0-specificatie, Request For Comments nr. 1866
• (en) Ontwerp van HTML 3.0
• (en) De HTML 3.2-specificatie, genaamd "Wilbur"
• (en) De HTML 4.01-specificatie
• (en) ISO-HTML-specificatie
• (en) De HTML 5.0-specificatie

Bronnen, noten en/of referenties

· ·

Webdesign