Website erstellen für Kinder: Tools, HTML & Sicherheit
Ein Kind, das seine erste eigene Website ins Netz stellt, lernt in einem Projekt gleich drei Dinge: strukturiert denken, gestalten und mit den eigenen Daten vorsichtig umgehen. Dieser Leitfaden zeigt konkret, welches Werkzeug zu welchem Alter passt, wie die erste HTML-Seite in wenigen Minuten entsteht, wo man sie kostenlos veröffentlicht und worauf Eltern beim Datenschutz achten müssen.
Zuerst eine wichtige Unterscheidung, weil das Thema zwei Dinge meinen kann:
- Eine Website, die ein Kind selbst baut (Schulprojekt, Hobby, Steckbrief der Lieblingstiere). Hier geht es ums Lernen und Ausprobieren.
- Eine Website mit Kindern als Zielgruppe (also für ein junges Publikum gestaltet). Hier zählen große Schaltflächen, klare Sprache und Barrierefreiheit.
Der größte Teil dieses Artikels dreht sich um den ersten Fall. Der Abschnitt zur Gestaltung deckt den zweiten mit ab.
Das passende Werkzeug nach Alter
Es gibt nicht das eine richtige Tool. Entscheidend ist, wie viel getippt und wie viel geklickt wird.
Etwa 5 bis 8 Jahre: geführt und visuell
In diesem Alter ist reines Coden noch zu abstrakt. Sinnvoller sind Baukästen, bei denen Bausteine per Maus zusammengezogen werden:
- Canva hat einen kostenlosen Website-Editor (Drag-and-drop). Ein Konto sollte hier ein Elternteil anlegen und begleiten.
- ScratchJr (Tablet-App, kostenlos) ist streng genommen kein Website-Tool, vermittelt aber spielerisch die Logik von „wenn ich hier klicke, passiert dort etwas“. Eine gute Vorstufe.
Etwa 8 bis 12 Jahre: erste eigene Seiten
Jetzt können Kinder eigenständig Inhalte anlegen und einfache Bausteine kombinieren:
- Google Sites ist kostenlos, funktioniert per Drag-and-drop und braucht keine Programmierkenntnisse. Es setzt ein Google-Konto voraus; das Mindestalter liegt in Deutschland bei 16 Jahren, jüngere Kinder brauchen ein über Family Link verwaltetes Konto.
- Code.org und Khan Academy bieten kostenlose, kindgerechte Kurse zu HTML und CSS. Ideal, um die Neugier vom Baukasten Richtung „echter“ Code zu lenken.
Ab etwa 12 Jahren: HTML und CSS von Hand
Wer verstehen will, was hinter einer Seite steckt, schreibt sie selbst. Man braucht dafür nur einen Texteditor und einen Browser – beides ist auf jedem Computer schon vorhanden. Für den Einstieg reicht der einfache Editor; angenehmer wird es mit Visual Studio Code (kostenlos), das Farben und Fehler direkt anzeigt. Wie das ohne teure Software geht, zeigt auch der Beitrag HTML-Website erstellen mit Notepad.
In 20 Minuten zur ersten HTML-Seite
Dieser Weg bringt das schnellste Erfolgserlebnis. Ihr Kind braucht nur einen Texteditor (unter Windows „Editor“, unter macOS „TextEdit“ im reinen Textmodus – dort vorher über „Format > In reinen Text umwandeln“ umstellen).
- Neue Datei anlegen und den folgenden Code hineinkopieren.
- Als
index.htmlspeichern (wichtig: Endung.html, nicht.txt). - Die Datei per Doppelklick im Browser öffnen.
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>Meine erste Website</title>
</head>
<body>
<h1>Hallo, ich bin Mia!</h1>
<p>Das ist meine allererste eigene Seite.</p>
<h2>Meine Hobbys</h2>
<ul>
<li>Fußball</li>
<li>Zeichnen</li>
<li>Minecraft</li>
</ul>
</body>
</html>
Sobald das funktioniert, probiert Ihr Kind aus: Überschriften ändern, mit <ul> Listen bauen, mit <a href="https://...">Text</a> Links setzen. Für Farben und Schrift kommt CSS dazu. Eine kleine Ergänzung im <head> genügt für den Anfang:
<style>
body { font-family: Verdana, sans-serif; background: #eef6ff; color: #16324f; }
h1 { color: #d6336c; }
</style>
Wichtig ist die Reihenfolge des Lernens: erst HTML (der Inhalt), dann CSS (das Aussehen). JavaScript für interaktive Spielereien kommt später und ist noch keine Voraussetzung.
Die Seite online stellen
Auf dem eigenen Rechner sieht nur das Kind die Seite. Für eine echte Adresse gibt es kostenlose Wege:
- Neocities (neocities.org): kostenloses Hosting speziell für selbst gebaute HTML-Seiten. Man lädt seine Dateien hoch und bekommt eine Adresse wie
name.neocities.org. Anfängerfreundlich und werbefrei im Gratis-Tarif. - GitHub Pages: ebenfalls kostenlos, aber technischer. Eher für ältere Jugendliche, die schon mit Git arbeiten.
Für Baukasten-Seiten (Google Sites, Canva) entfällt der Upload – dort wird direkt aus dem Editor veröffentlicht. Wer ganz ohne Anmeldung testen will, findet Alternativen im Artikel eigene Website kostenlos erstellen ohne Anmeldung.
Kindgerecht gestalten
Ob die Seite von einem Kind stammt oder sich an Kinder richtet – ein paar Gestaltungsregeln machen sie deutlich besser:
- Große, klar unterscheidbare Schaltflächen. Kleine Kinder treffen kleine Ziele schlecht.
- Hoher Kontrast und einfache Sprache. Kurze Sätze, wenige Fachwörter.
- Gut lesbare Schrift. Statt der viel diskutierten Comic Sans eignen sich Schriften, die gezielt für Leseanfänger entworfen wurden, etwa Andika (kostenlos). Sie unterscheiden ähnliche Buchstaben wie „a“ und „o“ deutlicher.
- Übersichtliche Navigation. Ein Menü mit drei bis fünf Punkten reicht.
Interaktive Elemente wie ein kleines Quiz oder eine Bildergalerie steigern den Spaß – bauen Sie sie aber erst ein, wenn die Grundstruktur steht.
Sicherheit und Datenschutz
Das ist der Punkt, an dem Eltern und Lehrkräfte mitreden sollten, denn eine veröffentlichte Seite ist weltweit sichtbar.
Diese Daten gehören nicht auf eine Kinder-Website: voller Nachname, Wohnadresse, Schulname, Telefonnummer, Standort in Echtzeit sowie Gesichtsfotos, auf denen das Kind eindeutig erkennbar ist. Ein Vorname oder ein Fantasiename reicht völlig.
Rechtlicher Rahmen in Deutschland: Nach Art. 8 DSGVO liegt das Alter für eine wirksame Einwilligung in die Datenverarbeitung in Deutschland bei 16 Jahren. Jüngere Kinder brauchen also die Zustimmung der Eltern, wenn ein Dienst personenbezogene Daten verarbeitet – das betrifft schon die Anmeldung bei vielen Plattformen. Sobald eine Seite über den rein privaten Rahmen hinausgeht, greift außerdem die Impressumspflicht (§ 5 DDG, der frühere § 5 TMG). Eine reine, nicht-kommerzielle Hobbyseite ist ein Grenzfall – im Zweifel legt ein Elternteil ein kurzes Impressum an.
Formulare mit Bedacht: Ein Kontaktformular oder ein Kommentarbereich sammelt automatisch Daten anderer Menschen. Für den Anfang ist eine reine Info-Seite ohne Datenerfassung der sicherste Weg.
Typische Fehler und wie man sie löst
- Die Datei öffnet sich als Textdokument statt als Website. Ursache: Sie wurde als
.txtgespeichert. Lösung: beim Speichern „Alle Dateien“ wählen und den Namen exaktindex.htmlschreiben. - Umlaute erscheinen als kryptische Zeichen. Ursache: fehlendes
<meta charset="utf-8">. Lösung: die Zeile in den<head>setzen und die Datei als UTF-8 speichern. - Bilder werden nicht angezeigt. Ursache: falscher Pfad. Lösung: das Bild in denselben Ordner wie die HTML-Datei legen und exakt schreiben, z. B.
<img src="katze.jpg" alt="Meine Katze">– auf Groß- und Kleinschreibung achten. - Alles verrutscht auf dem Handy. Lösung:
<meta name="viewport" content="width=device-width, initial-scale=1">in den<head>ergänzen.
FAQ
Ab welchem Alter kann ein Kind eine Website bauen? Mit Baukästen wie Canva oder Google Sites klappt es begleitet ab etwa 8 Jahren. Eine Seite von Hand in HTML zu schreiben, gelingt vielen Kindern ab 11 bis 12 Jahren, weil hier genaues Tippen und etwas Geduld gefragt sind.
Braucht man zum Lernen kostenpflichtige Software? Nein. Der bereits installierte Texteditor und ein Browser reichen für HTML und CSS vollständig aus. Kostenlose Kurse gibt es bei Code.org und Khan Academy, kostenloses Hosting bei Neocities.
Ist es sicher, die Seite eines Kindes zu veröffentlichen? Ja, wenn keine identifizierenden Daten (voller Name, Adresse, Schule, Gesichtsfotos) darauf stehen und ein Elternteil den Inhalt vorher prüft. Für ein Schulprojekt kann eine nur intern geteilte Seite die bessere Wahl sein – Ideen dazu im Beitrag Schulprojekt Website erstellen: Ideen.