Hvis du vil pifte sin profil lidt op på diverse hjemmesider, har sin egen blog eller lignende, så er der et par grundlæggende HTML tags du bør kunne. Dem vil jeg her beskrive, sammen med en kort introduktion til hvad HTML egentlig er.

HTML betyder Hypertext Mark-up Language, og kan på dansk beskrives som en masse tags, der fortæller en browser noget om hvordan en given hjemmesides indhold er. Du kan se HTML koderne for en hjemmeside, ved at klikke “Funktioner > Sidens kildekode” (i FireFox), eller “Vis > Kilde” ( i Internet Explorer). Mere behøver vi ikke vide nu, så lad os straks springe til det første tag.

Overskrift – Headline

Lad os starte med at angive en overskrift. Til det skal du bruge tagget <h1>, der står for headline niveau 1. Dette tag er også vigtigt i forhold til søgemaskineoptimering, så det bør være meget sigende omkring indholdet på siden. Lad os se på et eksempel:

Som vi kan se, så skal man starte tagget, samt afslutte det igen. Den “omkransede” tekst, er så den der angives som en overskrift. Der bør kun være 1 overskrift1 (<h1>) på en side. Hvis du har brug for flere overskrifter, kan du med fordel niveauinddele overskrifterne med de lignende tags <h2> til <h6>, altså overskrift i niveau 2 til 6.

Afsnit – Paragraph

Lad os fortsætte med at skrive et afsnit med noget tekst. Dertil skal du benytte tagget <p>, som står for paragraph. Her er et eksempel på brugen:

Som du kan se, så starter og afslutter man koden, ved at angive et start tag: <p> og et slut tag: </p>. Når man afslutter tagget og begynder et nyt, vil det vises som ca. halvanden linjeskift. Ønsker du et enkelt linjeskift, så kig med på det det næste tag.

Linjeskift – Linebreak

Undertiden kan man have brug for at lave et linjeskift, inde i et afsnit. Det gøres relativt simpelt, blot ved at indsætte koden <br />, som står for break, eller linebreak. Tager vi udgangspunkt i ovenstående eksempel, ser det sådan ud:

Dette tag er lidt anderledes end <p> tagget, da det ikke har et start og et slut tag, men blot afsluttes “i sig selv”. Det kan også bruges udenfor et afsnit, hvis du ønsker mere plads mellem det ovenstående og nedenstående i forhold til tagget. Ellers synes jeg det taler for sig selv.

Link – Anchor

Det næste vi vil kigge på, er hvordan du kan lave et link til en hjemmeside, en fil eller hvad du måtte have lyst til at lave et link til. Det gøres ved hjælp af tagget <a>, som dog skal have angivet minimum én attribut, nemlig adressen til hjemmesiden, filen eller lignende. Denne attribut kaldet href (Hypertext reference), og angives href=”URL”. Eksempel følger:

Dette tag adskiller sig lidt fra de andre. Først startes det, sammen med en attribut der angiver referencen, eller målet for det link man laver. Dernæst følger en tekst, et billede eller lignende, hvorefter <a> tagget afsluttes igen. Dette tag kan som nævnt “omkranse” både tekst, billeder mm.

Billede – Image

Når vi nu snakker om billeder, så lad os kigge på hvordan man indsætter et billede. Det gøres ikke så meget forskelligt fra link tagget, med et <img> tag (kort for image), samt to attributter. Den første attribut, kaldet src, angiver kilden (source) for selve billedfilen. Den anden attribut, kaldet alt (kort for alternate text), er en alternativ tekst, i fald billedet ikke kan vises, siden læses op (f.eks. for en blind bruger) eller lignende. Lad os se på et eksempel:

Kode	Resultat
<img src=”https://www.dslj.dk/eksempel.gif” alt=”Billed-eksempel” />

Igen ser vi at tagget afsluttes “i sig selv”, ligesom linjeskift. Det man skal huske med billeder er, at stien skal være tilgængelig for alle. Det hjælper ikke man lægger et billede ud med stien “C:\Dokumenter\Billeder\Sommerhus.jpg” – da det vil kræve at alle brugere skal have et billede i deres billedemappe, kaldet Sommerhus.jpg. Husk derfor altid at lægge billeder op på din hjemmeside, Flickr eller lignende – så alle har adgang til det.

Konklusion

Du har nu lært at lave overskrifter, afsnit, linjeskift, links og vise billeder. Det skulle give dig en god start. Selvfølgelig er der meget meget mere i det end det jeg har skrevet her. Har du fået blod på tanden, kan jeg anbefale at du leder efter tutorial til html. Er man til engelsk, kan man prøve en tutorial ved w3schools.com. Du er også velkommen til at skrive spørgsmål herinde på bloggen, så skal jeg svare så godt jeg kan.

Sidst men ikke mindst, så held og lykke med brugen af HTML. Skulle der være stemning for det, så skriver jeg gerne en mere uddybende artikel til hvert punkt, samt måske en masse andre tags – skriv bare en kommentar hvis du synes det er noget du ville kunne bruge.