Webseiten erstellen Browser zeigen das Web Viele einzelne Publikationen Text ist die Basis Blick auf bits und bytes HTML beschreibt das Web Bau einer HTML-Seite Ihre erste HTML-Seite Ihr eigenes Mini-CMS Ausgestaltung von HTML-Befehlen Bilder einbinden Bildformate beachten Bilder aus dem Internet Seitengestaltung mit CSS Einfache Dynamik mit JavaScript AJAX im Web 2.0 HTML-Editoren

Ihr eigenes Mini-CMS

Nachdem Sie nun Ihre erste eigene HTML-Seite erstellt haben, wird es Zeit, diese zu verschönern. Hierzu erstellen sie an Ihrem Computer mit drei einfachen Fenstern ein Mini-CMS. Die Abkürzung „CMS“ steht dabei für „Content Management System“, eine Bezeichnung die vorwiegend für Online-Bearbeitungshilfen von Webseiten genutzt wird.

Für Ihr Mini-CMS benötigen Sie drei Bereiche: Ein Bearbeitungsfenster, ein Vorschaufenster und eine Dateiliste. Diese drei Bereiche haben Sie in diesem Workshop bereits genutzt. Den Texteditor, den Webbrowser und Ihre Ordner-Ansicht. Ordnen Sie diese drei Fenster nun am Bildschirm so an, wie auf der rechten Seite gezeigt.

Nun können Sie eine HTML-Datei auf der Dateiliste einfach zur Bearbeitung in den Editor ziehen. Klicken Sie dazu die Datei an, halten Sie die Maustaste gedrückt und ziehen Sie sie so in das Editor-Fenster. Ebenso ziehen Sie die Datei in das Fenster des Webbrowsers, um die Webdarstellung zu sehen. Um die Ansicht im Webbrowser zu sehen, klicken Sie einfach auf die Taste „Neu laden“ des Webbrowsers.

Versuchen Sie nun, auf diesem Web Ihre Datei index.html im Editor und im Webbrowser zu öffnen. Ändern Sie dann den Text etwas ab, speichern Sie die Datei und laden Sie sie im Webbrowser neu, um das Ergebnis zu sehen.

Die Webseite bearbeiten

Auf der rechten Seiten finden Sie eine Liste mit HTML-Befehlen, die Sie auf Ihre Webseite anwenden können. Versuchen Sie, diese Befehle anzuwenden und so Ihre erste Webseite weiter auszubauen.

Neue Text-Absätze fügen Sie zwischen „<p>“ und „</p>“ ein. Einfache Zeilenumbrüche erzeugen Sie, indem Sie in Ihrem Text ein „<br />“ einfügen. Normale Zeilenumbrüche im Text, mehrfache Leerzeichen oder Tab-Stopps werden vom Browser nicht dargestellt. Sie benötigen jeweils den HTML-Befehl hierfür.