Syntaks

Hva

HTML5 innebærer en forenkling av doctype angivelse. Vi slipper å si om dokumentet er xhtml-strict, xhtml-transient og hva det var for noe alt sammen.

Dersom vi skal lage vellformet kode må vi ha en eller annen funksjonell referanse. Jeg bruker W3C's Markup Validation Service [1] . De kommenterer selv at den kan være litt ustabil og at den ikke alltid er ajour.

Doctype

Følgende er en syntaktisk riktig HTML5 side og validere uten feil hos W3C [1]

<!DOCTYPE html>
<html>
<head>
    <title>mypage</title>
    <meta charset="UTF-8" />
</head>
<body>
<p> hello</p>
</body>
</html>

Vi ser at mønsteret er akkurat det samme som når vi skriver en XML-side, bortsett fra at vi mangler en første linje (med encodingsinformasjon):

<?xml version="1.0" encoding="utf-8"?>

En fil med denne XML-linja ville ikke passere HTML5 validatoren uten feil.

Elementformat

På den annen side ville følgende også være en syntaktisk riktig og validerbar HTML5 side:

<!DOCTYPE html>
<html>
<head>
    <title>mypage</title>
    <meta charset="UTF-8">
</head>
<body>
<p> hello</p>
</body>
</html>

altså uten å lukke meta-elementet.

Dette er gjennomgående i tillatt HTML5-syntaks. Vi kan skrive en rekke elementer uten å avslutte dem, typisk  , <hr>, <img src="a.png" alt="a">. Dette gjelder tagger som ikke forventer noe eksplisitt innhold. Hvis vi imidlertid går inn og inspiserer den dynamiske DOM'en slik den presenteres i utviklingsverktøy i nettleseren, ser vi at elementet er beskrevet med en eksplisitt slutt-tag:   .

Alle de tre formene   ,   og   vil validere. Jeg bruker systematisk   for å opprettholde en enkelt parsbar form på kildefilene mine slik at jeg kan bruke mitt CMS1 Content Management System-verktøy for å bygge sider.

En del andre elementer i HTML5 er litt mer problematiske. Vi kan f.eks skrive:

<p contenteditable >hallo</p>

Vi bruker altså en attributt uten verdi. Dette er et klart brudd på XML-syntaksen, men godkjennes altså som HTML5. Uansett hva vi skriver

<p contenteditable >hallo</p>
<p contenteditable="true" >hallo</p>
<p contenteditable="false" >hallo</p>
<p contenteditable="" >hallo</p>

så vil tilstedeværelsen av contenteditable angi at paragrafen kan editeres. Igjen vil vi se at den dynamiske DOM'en i nettleserverktøyet viser elementet som den siste versjonen ovenfor, altså som korrekt XML. Når jeg har ambisjoner om å skrive vellformet HTML5 bruker jeg denne formen i kildekoden. Og det validerer.

Content Management System

Referanser

Markup Validation Service W3C validator.w3.org/ 01-02-2014

HTML5 w3.org dev.w3.org/html5/spec/Overview.html 14-03-2011