HTML Introduktion

HTML exempel:

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

Exempelförklaring:

  • DOCTYPE förklaringen definierar dokumentets typ
  • Texten mellan <html> och </html> beskriver webbsidan
  • Texten mellan <body> och </body> är det synliga sidoinnehållet
  • Texten mellan <h1> och </h1> visas som en rubrik
  • Texten mellan <p> och </p> visas som en paragraf

Vad är HTML?

HTML är ett språk som används för att beskriva webbsidor.

  • HTML står för Hyper Text Markup Language
  • HTML är ett märkspråk
  • Ett märkspråk är en uppsättning av märktaggar
  • Taggarna beskriver dokumentinnehåll
  • HTML dokument innehåller HTMLtaggar och enkel text
  • HTML dokument kallas även för webbsidor

HTML element

Inom HTML så är de flesta elementen skriva med en start tagg (t.ex. <p>) och en slut tagg (t.ex. </p>), med innehållet i mitten:

<p>Det här är en paragraf.</p>

<tagname>innehåll</tagname>

Webbläsare

Syftet med en webbläsare (som Google Chrome, Internet Explorer, Firefox, Safari) är att läsa HTML dokument och visa dem som webbsidor.

Webbläsaren visar inte HTMLtaggarna, utan använder taggarna för att avgöra hur innehållet från HTML-sidan ska presenteras/visas för användaren:

HTML sidostruktur

Nedanför är en visualisering av en HTML-sidostruktur:

HTML versioner

Sedan nätets tidiga dagar så har det funnits många versioner av HTML:

<!DOCTYPE> förklaringen

<!DOCTYPE> förklaringen hjälper webbläsaren att visa en webbsida på rätt sätt.

Det finns många olika sorters dokument på nätet, och en webbläsare kan bara visa en HTML-sida 100% rätt om den vet HTML-versionen och typanvändningen.

Vanliga förklaringar:

HTML5

<!DOCTYPE html>

HTML 4.01

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>

XHTML 1.0

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>