Skip to main content

Hypertext Markup Language (HTML)

TL;DR

HTML(HyperText Markup Language) er et sprog, der bruges til at oprette websider. Nogle sider kan skrives direkte i HTML, mens andre kan bruge sidebyggere eller andre værktøjer til at lave websider, der også producerer HTML-output, som igen kan læses af browsere.

Hvad betyder HTML?

HTML står for HyperText Markup Language, og det er det sprog, der bruges til at oprette websider. Den bruger markeringer til at definere og style elementer. For eksempel kan den definere skrifttyper, farver, position, links osv. Selvom de fleste webstedsbyggere ikke skriver direkte i HTML, er de endelige output, der læses og fortolkes af webbrowsere, i HTML-format. Det er derfor, når du højreklikker på en webside og vælger "Se sidekilde", skal den første tekstlinje i det resulterende vindue være <!doctype html>.

Hvad er strukturen på en HTML-side?

Selvom strukturer kan variere, er nogle af de elementer, du bør finde i enhver HTML, følgende (med forklaringer i kursiv). Tjek dette på en hvilken som helst webside ved at højreklikke hvor som helst og vælge "Se sidekilde":

<!DOCTYPE html> - dette viser webbrowseren, at dette er en HTML-fil, den kan læse

<html lang="da"> - dette viser det sprog, som websiden er skrevet på

<head> - dette markerer begyndelsen af hovedafsnittet, hvor generelle koder er placeret

<title>Titel på siden</title> - dette er et metatag, der viser titlen på siden, som vises på browserfanen

<meta name="description" content="..." /> - dette bruges til at beskrive, hvad siden handler om, for søgemaskiner

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, user-scalable=0" /> - dette er en kommando, der fortæller, hvordan websiden skal vises på forskellige skærmstørrelser

<meta name="robots" content="index,follow" /> - dette fortæller de bots, der crawler siden, at de kan indeksere den og tilføje den til søgemaskinens resultater

<link rel="stylesheet" type="text/css" href="/css/style/style.css”> - dette forbinder HTML til en CSS-fil, hvor mere detaljeret styling af teksten er placeret

<script src="/js/random.js" type="text/javascript"></script> - dette forbinder til en JavaScript-fil, der bruges til at køre en handling på websiden

<link rel="canonical" href="https://yourpage.com"/> - hvis der er sider med lignende indhold, eller siden kan findes på mere end én URL, viser dette crawlere, hvilken URL der skal tages ind i konto til myndighedsformål

</head> - dette lukker hovedsektionen

<body> - dette åbner kropssektionen, hvor det faktiske sideindhold er placeret

<div class="container"> - dette åbner en sektion kaldet container, som normalt skaber rammen for indhold

<a href="https://yoursiteshomepage.com"><img class="navbar-brand-logo-normal" src="/images/logo.svg" alt="alt text" height="52" width ="180"></a> - dette er en måde at placere et logobillede på, som linker til din hjemmeside

<div class=”first-text”>Dette er de første ord, der rent faktisk vises på dit websted</div> - noget tekst, der kan styles i den tilsluttede CSS-fil

...

</body>