HTML, CSS und JavaScript — die drei Bausteine des Webs

Alle Websites, von der einfachsten Landingpage bis zur großen Webanwendung, ruhen auf denselben drei Technologien. Jede hat ihre eigene Aufgabe, und es ist eine gute Gewohnheit, sie getrennt zu halten: Inhalt für sich, Aussehen für sich und Verhalten für sich.

HTML (HyperText Markup Language) beschreibt den Inhalt und seine Struktur: Überschriften, Absätze, Listen, Links, Bilder und Formulare. Semantisches HTML bedeutet, dass man Elemente nach ihrer Bedeutung auswählt — eine Überschrift muss ein Überschriftenelement sein, nicht einfach nur Text, der per Styling groß gemacht wurde. Das hilft sowohl Suchmaschinen als auch Screenreadern, die Seite zu verstehen.

CSS (Cascading Style Sheets) steuert, wie der Inhalt aussieht: Farben, Schriften, Abstände, Layout und responsives Design. Der Name 'cascading' verweist darauf, dass Regeln einander nach bestimmten Prioritätsregeln vererben und überschreiben können. Modernes Layout wird typischerweise mit Flexbox und Grid gebaut, die eine Anpassung an verschiedene Bildschirmgrößen ermöglichen.

JavaScript macht die Seite interaktiv: Es reagiert auf Klicks, holt Daten, aktualisiert den Inhalt, ohne die Seite neu zu laden, und validiert Formulare. Während HTML und CSS statische Beschreibungen sind, ist JavaScript eine vollwertige Programmiersprache, die im Browser läuft und die Seite verändern kann, während der Benutzer sie benutzt.

Eine robuste Webseite funktioniert in ihrer Grundlage ohne JavaScript und wird dann dort verbessert, wo es sinnvoll ist. Denk Barrierefreiheit von Anfang an mit: verwende semantische Elemente, sorge dafür, dass alles per Tastatur bedienbar ist, gib Bildern einen Alternativtext, und sorge für ausreichenden Kontrast. Das ist keine Zusatzarbeit am Ende — es ist Teil des Handwerks.

“HTML sind die Knochen, CSS ist die Haut, und JavaScript sind die Muskeln. Eine gute Seite funktioniert schon, bevor die Muskeln dazukommen.”

— Gängige Faustregel in der Webentwicklung