Baue deine Website: Der HTML-Stack, der noch öffnet
PAZ-Anleitung: Baue deine Website mit einem hand-geschriebenen index.html und VSCodium — der beständige, herstellerunabhängige Stack, der noch öffnet.
Shannon Kay schrieb eine Anfänger-Web-Anleitung für ihre 12-jährige Tochter, die damit ihr Schulprojekt ohne fremde Hilfe baute. Das ist das subversivste Engineering-Papier, das ich dieses Jahr gelesen habe. Kein Framework. Kein Build-Step. Kein npm install, das nach achtzehn Monaten bricht. Nur index.html, ein Text-Editor und die Markup-Sprache, die seit 1993 nicht stirbt.
←HEUTE: 2026: Eine hand-geschriebene HTML-Datei funktioniert in jedem Browser der Welt, ohne Toolchain. →3012: Die so gebauten Seiten sind die einzigen, die eine 25-Jährige noch ohne Emulator öffnen kann. Fulcrum: Der einfachste Stack ist auch der beständigste — Dauerhaftigkeit ist eine Gestaltungsentscheidung, die du beim Erstellen der Datei triffst.
Hier ist das, was niemand dem Bootcamp-Kurs erzählt: HTML ist laut WHATWG ein Living Standard — es gibt kein „HTML 6″, das deine Datei obsolet macht. Wie Wikipedias HTML-Artikel zeigt, hat sich das Format seit 1993 kontinuierlich entwickelt und bleibt dabei rückwärtskompatibel. freeCodeCamp nennt es „einen der grundlegendsten Bausteine jeder Website.” Einfachheit ist das Feature. Der Renderer trifft den Maurer, und der Maurer gewinnt immer.
Das Werkzeug: Der Protagonist hier ist VSCodium — der vollständig quelloffene, telemetrie-freie Build von VS Code, direkt in Kays Anleitung neben schlichten Editoren empfohlen. Es lohnt sich für einen Computationalen Gestalter, weil es der gleiche Editor ist, den du bereits für GHPython und Bonsai nutzt, ohne Lizenz-Zwänge. Kombinier ihn mit dem Browser, den du bereits hast, und das ist der gesamte Stack. Kein Webpack, kein Anbieter.
Setup:
mkdir -p ~/Websites/cats && cd ~/Websites/cats
# VSCodium (macOS/Homebrew gezeigt; Windows/Linux auf vscodium.com)
brew install --cask vscodium
codium . # öffnet diesen Ordner im Editor
# erstelle eine Datei namens index.html, füg das Gerüst ein, dann:
python3 -m http.server 8000 # besuche http://localhost:8000
Erste Schritte:
- Erstelle in VSCodium eine
index.html. Der Name zählt: Wie Kay erklärt, istindexdie Standard-Seite, die ein Browser für die Wurzel eines Ordners serviert — die gleiche Konvention, die dein Speckle-Viewer und dein Caddy-Server bereits befolgen. - Füg das Gerüst ein:
<!DOCTYPE html>, dann<html>, das einen<head>(mit<meta charset="UTF-8">, das Viewport-Meta und einen<title>) und einen<body>umschliesst. - Nutze in
<body>die semantischen Tags, die w3schools in seinem HTML-Tutorial übt:<header><h1>, dann<main>mit<section>-Blöcken, dann einen<footer>. Füg einen<a href="about.html">-Link hinzu — der Anker, der es zum Web macht. - Führe den Server-Befehl oben aus und aktualisiere. Du hast jetzt eine Website. Abhängigkeiten insgesamt: null.
Atelier: Eine Schweizer Praxis braucht das nicht für eine Marketing-Website — sie braucht es für die Projektübergabeseite, die 2050 noch rendern muss, wenn das Facility-Team des Kunden sie öffnet. Ein einzelnes statisches index.html, das den IFC-Export, das BEP-PDF und eine Fotoserie verlinkt, überlebt jedes proprietäre Projekt-Portal-Abonnement. Wir lehren das bei PAZ als den Unterbau des Archicad–Speckle–Bonsai-Stacks: Das letzte Lieferergebnis ist immer flach und lesbar.
Hack: Dieser Hack lehrt dich, deine Website genau so in der Vorschau zu sehen, wie ein Browser sie serviert — du findest gebrochene relative Links, bevor andere es tun. Das ist einfach ein Workflow-Move: Pythons eingebauter Server, keine Installation. Führe ihn aus deinem Website-Ordner aus.
# aus dem Ordner, der index.html enthält
python3 -m http.server 8000
# dann öffne http://localhost:8000 — Links werden wie in der Produktion aufgelöst
# Strg+C zum Beenden. Kein node_modules, kein Config, kein Vendor.
Der Kompromiss, klar gesagt: Hand-geschriebenes HTML skaliert schlecht über ein paar Dutzend Seiten hinaus — das ist, wenn sich ein Static-Site-Generator rechtfertigt. Aber fang hier an, weil du nicht debuggen kannst, was du nicht verstehst, und ein Generator schreibt nur das HTML, das du bereits lesen können solltest.
Die Gebäude, die in meiner Zeit am schlechtesten alterten, waren nicht die hässlichen — es waren die, die niemand öffnen konnte, weil das Format verschwand. Wähle die Tools dieses Quartals nach einer Frage: Wenn der Anbieter verschwindet, kann eine 25-Jährige die Datei noch öffnen? Ein einfaches index.html antwortet ja. Konkrete Aktion heute: erstelle einen Ordner, ein index.html, serviere es lokal, und spüre, wie wenig du eigentlich brauchtest.
Learn-it:
- Die Anleitung: Shannon Kay — Make Your Own Website: A beginner’s guide
- Referenzdokumentation: w3schools HTML Tutorial
- Was es ist: freeCodeCamp — What is HTML
- Kernkonzept: HTML — Wikipedia
- PAZ-Anmerkung: Das statische
index.htmlist der Beständigkeitsboden unter unserem Archicad–Speckle–Bonsai-Übergabe-Workflow — das Lieferergebnis, das jeden Anbieter überlebt.
Quelle: HN Learn
QUELLE · ↗