Ziel ist es, innerhalb einer Woche eine Website im Internet zu veröffentlichen. Die Website soll einfach
strukturiert sein und ohne Javascript oder Frameworks und mit möglichst wenig CSS auskommen. Es geht nur um die
Basics, nichts anderes. Trotzdem soll die Webseite halbwegs ansprechend aussehen und die grundlegenden
Möglichkeiten von HTML5 aufzeigen. Die Webseite ist nicht für Handys optimiert, soll aber auch auf Smartphones
funktionieren.
Um dieses Projekt einfach zu gestalten, gibt es kein ausgefeiltes Tutorial. Der Quelltext kann mit
Strg+U
angesehen und in den eigenen Editor kopiert werden.
Was benötigen wir:
Es gibt zahlreiche Webeditoren und -hoster. Phoenix habe ich verwendet, weil sich der Editor im Browser bedienen
lässt. Eine Installation entfällt dadurch. Alternativ lässt sich der Editor auch auf der Festplatte als Programm
installieren.
Bei der Wahl des Webhosters war für mich eine einfache Oberfläche zum Hochladen der Dateien ausschlaggebend. Für
diesen Kurs ist ein Webhoster nicht zwingend erforderlich. Phoenix kann eine Website via Link befristet im
Internet bereitstellen.
Die vielen HTML-Infoseiten im Internet bieten ausgezeichnete Möglichkeiten für ein tiefergehendes Studium. Wer
z.B. komplexe Bildergalerien verwenden will, findet zahlreiche Beispiele.
Für dieses einfache Projekt habe ich zwei Webauftritte besonders angesehen, einige Beispiele wurden in Anlehnung
der dort veröffentlichten Tutorials abgeleitet. Zum einen Mozilla MDN Webdocs, welches direkt mit dem
Phoenix-Editor verlinkt ist und eine ausgezeichnete Referenz für HTML-Elemente darstellt, zum anderen selfhtml,
eine deutschsprachige Webdokumentation, die viele Beispiele bietet. Beide Webseiten haben Tutorials, die eine
direkte Eingabe des Quelltexts und Anzeige des Ergebnisses ermöglichen. Eine dritte sehr übersichtliche Webseite
mit Online-HTML-Editor ist Tutorial Republic, die ich ebenfalls empfehlen kann.
Diese Webseite ist rein privater Natur, richtet sich an Freunde und Bekannte und verfolgt keinerlei kommerzielle Zwecke. Ein Impressum entfällt daher. Namensnennung - Weitergabe unter gleichen Bedingungen gemäß CC BY-SA 4.0
Wenn euch die Webseite gefällt, könnt ihr sie gerne teilen.
P.S. Wer eine Alternative zu Phoenix sucht, wird im Internet schnell fündig. Zum Ausprobieren und ohne Anspruch auf Vollständigkeit: Stackblitz, Replit, Sublime Text, Visual Studio Code, Android Studio...
Quellen für den Einstieg in HTML:
selfhtml Tutorial Republic Mozilla Webdocs