del indholdKontakt migFå teksten læst opUdskriv indhold

HTML og XHTML

link

Hvad er HTML?

HTML er sproget, som gør det muligt at vise indhold på internettet, lige meget om du sidder ved en PC, Mac, linux maskine osv. HTML har eksisteret siden 1992. HTML står for Hyper Text Markup Language. Og hvad vil det så sige?

  • Hyper er det samme som links, og det er det, som gør WWW specielt i forholdt til at læse en bog, hvor du starter på side 1 og slutter på side 3000. På WWW kan du springe frem og tilbage, både på ét website, og mellem flere websites.

  • Text er bare tekst. Egentlig burde det hedde Media, da man også kan klikke på billeder osv, og ikke bare tekst som man kunne i starten.

  • Markup tags fortæller  webbrowseren, hvordan den skal vise indholdet. F.eks. <b> viser teksten fed, osv.

  • Language er et sprog, men ikke er programmeringssprog, da der ikke noget der skal programmeres, men det er blot tags om, hvordan siden skal vises.

For at se en websides HTML-kode, kan du højreklikke og i Internet Explorer vælge ’vis kilde’, i Firefox vælge ’vis sidens kildekode’.

Lav en HTML side

For at lave en HTML fil kan du bruge en grafisk editor som f.eks. Dreamweaver eller en tekst editor, hvor den mest simple er Notesblok i Windows. Det kan anbefales, at de selv prøver at skrive HTML-koden, så du lærer den korrekte syntax.

Prøv at skrive flg. I Notesblok (eller SimpleText, hvis du sidder ved en Mac), eller online på W3Schools editor.

<html>
<head>
<title>Sidens titel</title>
</head>
<body>
<h1>Velkommen</h1>
<b>Denne tekst er fed</b>
</body>
</html>

Gem siden som velkommen.html, og prøv at åbne den i en browser. Her vil du se, at Velkommen er skrevet som en overskrift, mens resten er skrevet med fed.

HTML tags

Html tags er omgivet af < og >. De kommer oftest i par, hvor den første <h1> kandes en start tag, mens den sidste </h1> kaldes en end tag. Dermed fortæller man browseren, at alt som er i mellem disse to tags, skal være en overskrift 1. Hvis de sidste tag ikke var der, ville browseren jo tro, at resten af siden også skulle være en overskrift. Teksten mellem de 2 tags er selve indholdet.

I nogle tilfælde kan man nøjes med en enkelt tag, f.eks. <br> betyder ny linie, og dette behøver ikke indeholde en end tag.

HTML tags er ikke case-sensitive, dvs. du kan både skrive <H1> og <h1>. Et tip er dog: brug altid små bogstaver til dine tags, da dette anbefales, når du skal have valideret dine sider for at se om de har en pæn syntax.

<html>, <head> og <body>

En HTML side starter altid med <html> for at fortælle browseren, hvad det er for et sprog, der skrives i, og slutter med </html>.

Herefter er der 2 dele i HTML-koden. Der er en HEAD-del, som indeholder oplysninger om siden. Det kan være sidens titel, metadata, reference til stylesheet, osv. Derefter er der en BODY-del, som indeholder det, du kan se i browseren, f.eks. tekst, links til billeder, osv.

HTML Online editor

Jeg har lavet en lille simpel online HTML-editor, hvor du kan skrive HTML kode og få det vist, som det vil se ud i en browser ved at klikke på 'Oversæt':


Oversigt over HTML tags

På HTML.dk er der en ganske god tutorial om HTML, og desuden er der en oversigt over alle HTML tags, hvor du kan læse mere om de enkelte tags placering, anvendelse og beskrivelse.

 

Gode råd når du skriver html

  • Hold struktur, når du skriver HTML, dvs. start- og end-tag skal være lette at genkende sammen. F.eks er:

    <body>
    <h1>En overskrift</h1>
    <p>tekst, tekst tekst, tekst</p>
    </body>

    bedre end:

    <body><h1>En overskrift
    </h1><p>tekst,
    tekst tekst, tekst</p></body>

    Det nederste er ikke forkert, bare svært at læse. Det er til gengæld forkert at skrive:

    <b><i>Velkommen</b></i>,

    da tags'ene er kædet ind i hinanden. Her skulle det korrekte være:

    <b><i>Velkommen</i></b>.

  • Overhold standarderne og validere din sider på W3C for at se om det er syntetisk korrekt.

  • Selvom HTML indeholder nogle formateringsmuligheder, f.eks. <b> for fed, er det bedre at lave al sin formatering i et stylesheet. Se i afsnittet om CSS.

Hvad er XHTML?

XHTML er blot en reformulering af HTML, og står for eXtensible HTML. XHTML er lavet for at kunne håndtere mange forskellige systemer og platforme, og skal derfor skrives efter en helt fast standard. XHTML betragtes som en mere 'clean' syntax end HTML. De største forskelle er:

  • i XHTML skal alle elementer afsluttes med en slut-tag
  • i XHTML skal alle elementer skrives med små bogstaver.
  • i XHTML skal værdien af atributter stå med anførelsestegn
  • i XHTML tillades minimerede atributter ikke
  • i XHTML bruges atributten "id" til identifikation

Du bliver bedre til at kode med XHTML end med HTML, som ser stort på minder fejl. XHTML er baseret på XML syntaxen som du kan læses mere om XML-siden. Når du opretter en ny HTML-side i Dreamweaver, er det i virkeligheden en XHTML-side som standard. Du kan godt ændre det til HTML, men det er der ingen grund til.