HTML5 introduktion

HTML5-exempel i varje kapitel

Exempel

<!DOCTYPE html>
<html>
<body>
<video width="420" controls>
  <source src="mov_bbb.mp4" type="video/mp4">
  <source src="mov_bbb.ogg" type="video/ogg">
 Din webbläsare stöder inte video-taggen.
</video>
</body>
</html>

Prova själv

Klicka på "Prova själv" för att se hur detta exempel körs.

Vad är HTML5?

HTML5 är den senaste HTML-standarden.

HTML5 är designad för att bära rika webbinnehåll utan behov av extra plugins.

HTML5 har nya semantiska, grafiska och multimedieelement.

De nya elementen och API:erna som HTML5 erbjuder förenklar byggandet av webbapplikationer.

HTML5 är plattformsoberoende och är designad för att köra på olika typer av hårdvara (PC, surfplattor, telefoner, televisioner och så vidare).

Kommentar:I de följande kapitlen kommer du att lära dig hur du "hjälper" gamla webbläsare att hantera HTML5.

Nya innehåll i HTML5?

Den nya dokumenttypsdeklarationen (DOCTYPE) i HTML5 är mycket enkel:

<!DOCTYPE html>
Den nya teckenkodningen (charset) deklarationen är också mycket enkel:
<meta charset="UTF-8">

HTML5-exempel:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Titel på dokumentet</title>
</head>
<body>
Innehållet i dokumentet......
</body>
</html>

Kommentar:Standardkarakterkodningen i HTML5 är UTF-8.

HTML5 - ny förteckningssyntax

HTML5-standard-gerar-4-typer-av-förteckningssyntax.

Detta exempel visar olika grammatiska strukturer som används i <input>-taggen:

Typ Exempel
Tom <input type="text" value="Bill Gates" disabled>
Ocitat <input type="text" value=Bill Gates>
Dubbel citattecken <input type="text" value="Bill Gates">
Enkel citattecken <input type="text" value='Bill Gates'>

I HTML5-standarden kan alla fyra grammatiska strukturer användas beroende på behovet av egenskaper.

HTML5 - nya egenskaper

Några av HTML5:s mest intressanta nya egenskaper:

  • Nya semantiska element, till exempel <header>, <footer>, <article> och <section>.
  • Nya formulärkontroller, till exempel nummer, datum, tid, kalender och reglag.
  • Kraftfullt stöd för bilder (genom <canvas> och <svg>)
  • Kraftfullt stöd för multimediatillägg (genom <video> och <audio>)
  • Kraftfulla nya API:er, till exempel att ersätta cookies med lokal lagring.

HTML5 - borttagna element

Följande HTML 4.01-element har tagits bort från HTML5:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>