Tre teknologier – ét website

Moderne hjemmesider bygges typisk med tre grundlæggende teknologier: HTML, CSS og JavaScript.

• HTML beskriver indhold og struktur
• CSS styrer design og layout
• JavaScript skaber interaktivitet og funktionalitet

HTML – struktur og indhold

HTML bruges til at beskrive, hvad en side indeholder. Det kan være overskrifter, tekst, billeder, links, formularer og meget mere.

<h1>Min hjemmeside</h1>
<p>Velkommen til min side.</p>
<button>Klik mig</button>

Uden CSS og JavaScript vil siden stadig fungere, men den vil være meget simpel og uden interaktivitet.

CSS – design og layout

CSS bruges til at bestemme, hvordan HTML-elementerne ser ud og placeres på siden.

h1 {
  color: #4caf50;
}

button {
  background: #222;
  color: white;
  padding: 10px 16px;
}

CSS ændrer ikke indholdet – kun præsentationen.

JavaScript – interaktivitet

JavaScript gør siden levende. Det bruges til at reagere på brugerens handlinger og ændre indhold dynamisk.

const button = document.querySelector('button');

button.addEventListener('click', () => {
  alert('Du klikkede på knappen!');
});

JavaScript kan læse og ændre både HTML og CSS mens siden kører.

En simpel analogi

• HTML er skelettet på kroppen
• CSS er tøjet og udseendet
• JavaScript er musklerne og bevægelsen

Alle tre er nødvendige for at skabe en moderne, brugbar hjemmeside.

Hvordan arbejder de sammen?

Når en browser åbner en hjemmeside, sker der typisk følgende:

1. HTML indlæses og opbygger sidens struktur.
2. CSS anvendes for at style elementerne.
3. JavaScript tilføjer dynamik og interaktion.