HTML står for Hyper Text Markup Language. En HTML fil er en tekst fil, der indeholder små markup tags. Markup tags fortæller browseren, hvordan den skal vise siden. En HTML fil skal have endelsen: .htm eller .html

Dette er en stor overskrift

Dette er en mindre overskrift

Med store eller små bogstaver?

De fleste browsere er i udgangspunktet ligeglad om du skriver din tags med stort, småt eller begge dele. <KOMMANDO>, <kommando> eller <KomMaNDO> vil give det samme resultat i browseren. 'Men det er god skik at skrive tags med småt. Det gør det også mere overskueligt, så du kan lige så godt vende dig til det fra starten.

Din første hjemmeside

Eftersom du læser her er du nok interesseret i at lave en hjemmeside eller i det mindste vide hvordan. Derfor vil jeg sætte dig igang

Hvordan?

For at lave en hjemmeside skal du bruge to ting; En teksteditor (f.eks. Notesblok/Notepad) og en browser (f.eks. Internet Explorer, Google Chrome, Mozilla Firefox)

Åben din teksteditor, som jeg for fremtidens skyld vil kalde Notepad for enkelthedens skyld. Så åben som sagt Notepad.

Hvad skal jeg lave? og Hvordan?

Lad os starte med noget simpelt. Her laver vi en hjemmeside der skriver "Dette er min allerførste hjemmeside" HTML kan godt lyde indviklet og besværligt, men når man først forstår det, er der en mening bag alt. Din browser læser HTML på samme måde som du læser en avis eller en bog: starter oppe i venstre og hjørne og slutter nede i højre). Derfor starter HTML-dokumenter altid med det der skal komme først på din side og sluttes - af samme grund - med det der kommer til sidst. Det allerførste du skal gøre er at fortælle browseren, at du har tænkt dig at skrive HTML. Det gør du simpelt nok ved at skrive <html>. Gå derfor ind i din Notepad og skriv <html>. Som du måske husker fra afsnittet om '''tags''' er <html> et åbnings tag og det skal derfor lukkes med </html>. Dette giver Browseren besked på at du nu er færdig med at skrive HTML. Gå derfor ind i din Notepad og skriv, nogle linjer nede, </html> Nu ved Browseren, hvad du skriver og hvornår du er færdig med det (indikeret af henholdsvis <html> og </html> Derfor skal alle tags - logisk nok - skrives mellem <html> og </html> Din side skal nu have et hoved og en krop. Endnu engang stråler det af logik, da hovedet (head) skal skrives over kroppen (body). Tilføj derfor lige under dit <html> følgende <head> og </head> og under </head> skal du nu skrive <body> og </body>.

Nu skulle din side se sådan ud:


<html>

<head>
</head>

<body>
</body>

</html>

Hvis det lykkedes for dig og dit dokument ligner ovenstående, så har du lige skabt din første hjemmeside. Ikke den drømme side du havde i tankerne, eftersom dette kun vil være en blank side. Men det du har lavet, er grundskabelonen for alle dine fremtidige sider.

Nu til en rigtig side

Din side har som nævnt to dele: et hoved (head) og en krop (body). I hovedet kan du gemme oplysninger om din side, men kroppen indeholder det, der udfører siden. Hvis du for eksempel vil fortælle browseren, hvad sidens titel er, ville det være naturligt at gøre det i <head>. Tag'et for en titel er <title>:

<title>Min første side</title><nowiki> Som jeg lovede skal vi have siden til at skrive "Dette er min allerførste hjemmeside". Det er altså det, vi vil have udført og derfor hører det som sagt til i ''kroppen'' (body): <nowiki> <p>Dette er min allerførste hjemmeside<p>

P'et i <p>-taget står for "Paragraph", som er engelsk og på dansk betyder "afsnit". Det er også meget logisk eftersom det vi lige har lavet er et afsnit for sig selv.

Med de nye tilføjelser skulle du gerne have følgende i din Notepad:


<html>

<head>
<title>Min første side</title>
</head>

<body>
<p>Dette er min allerførste hjemmeside</p>
</body>

</html>

Færdigt arbejde. Du har lavet din første rigtige side!

Nu skal den bare gemmes, så den kan åbnes i din browser. For nemhedens skyld nøjes vi i første omgang med at gemme siden på din egen computer og ikke på Internettet:

Vælg "Gem som..." under "Filer" i Notepad. Vælg "Alle filer" ("Alle Filer") i boksen "Gem som type" (Dette er meget vigtigt, da du ellers gemmer din side som et tekstdokument og ikke som en HTML-fil). Gem nu din side som f.eks. "side1.htm" (endelsen ".htm" fortæller, at det er en HTML-fil, men endelsen ".html" giver det samme resultat, så du kan selv bestemme, hvilken endelse du vil bruge).

Nu finder du det sted du har gemt din fil og åbner den.

Tillykke! Nu skulle der meget gerne stå "Dette er min allerførste hjemmeside" i din browser.

Begynd at eksperimentere

Nu er du allerede kommet et godt stykke af vejen. Du kender nu grundformen til en hjemmeside. Du ved hvordan man gemmer den rigtigt og du kender faktisk også en række tags du kan bruge.

<p>Bruges ved afsnit. Når du starter et nyt afsnit hopper du automatisk to linjer ned.</p>
<b>Skriver teksten med fed.</b>
<h1>Overskrift</h1>
<h2>Underoverskrift</h2>
<h3>Mindre underoverskrift</h3>

Nu bliver din opgave så at eksperimentere dig frem. Få prøvet alle disse tags. Altså skal du lave dit egen side, helt uden hjælp nu. Det er fuldstændig ligegyldigt hvad du skriver af tekst. Det vigtige er at du får prøvet nogle tags. Held og lykke!

Min opdatering af bogen er nået hertil indtil videre. --Krog99 17. jun 2009, 18:21 (CEST)

Hvad med lidt farve?

Baggrundsfarve:

Man kan give sin hjemmeside en baggrundsfarve ved at skrive: bgcolor=, efterfulgt af en farvekode sat i anførselstegn(""), eller farven skrevet på engelsk. F.eks. "green", "yellow" "red". Farvekoderne består af tal og bogstaver. En fordel ved at bruge farvekoder er, at man kan vælge imellem alverdens farver... En hurtig søgning via en søgemaskine giver hurtigt utallige skemaer over disse. Nedenfor er der et eksempel, tom farver sider grøn.

<html>

<head>
<title>Min første side, nu med farve<title/>
</head/>

<body bgcolor="green">
</body/>

</html>

Hvad er en hjemmeside uden links?

For at indsætte et link, skriver man følgende:


<a href="http://da.wikibooks.org/wiki/L%C3%A6r_HTML">Mit første link<a>

På en hjemmeside, vil det komme til at se sådan ud:

Mit første link

href er en attribut og er en forkortelse af Hypertext REFerence.

Lær HTML

Tags

Eksempler på tags