Übung 01

Das sind die Schritte für Übung 01:
Als weitere Hilfe können die Artikel Adobe Dreamweaver und und Teile von Eine Website programmieren – Schritte heranzgehogen werden.

  • Im Windows-Dateiexplorer den lokalen Stammordner für die Übung 01 anlegen: \uebung01
  • Im Ordner \uebung01 den Unterordner \fotos anlegen
  • Auf gleicher Ebene wie \uebung01 den Materialien-Ordner anlegen: \uebung01_materialien
    (Er dient dazu, Materialien für die Website zunächst zu sammeln, z. B. Fotos und Texte. Erst die vorbereiteten Fotos werden später im Ordner \fotos gespeichert.
  • Adobe Dreamweaver starten
  • Im Hauptmenü Site / Neue Site wählen
  • Unter Site-Name Übung01 eintragen
  • Unter Lokaler Site-Ordner mit dem Symbol Ordner suchen den Ordner \uebung01 auswählen und bestätigen und Speichern.
    Jetzt speichert DW automatisch im Ordner \uebung01.
  • Im Startfenster von DW eine leere HTML-Seite erstellen
  • Mit Strg+S sofort speichern/Namen vergeben: index.html
    Es muss darauf geachtet werden, dass die Dateiendung .html auch dort steht.
  • Text eingeben bzw. kopieren:
    Willkommen! – Enter für neuen Absatz
    Ein paar Sätze Dummy-Text einfügen (von der Website blindtextgenerator.com kopieren) – Enter für neuen Absatz
  • Namen für die Hyperlinks eingeben:
    Home | Über mich | Kontakt
  • Willkommen! als Überschrift 1 formatieren: im Eigenschaftsfenster unten links unter Format Überschrift 1 auswählen
  • In der Symbolleiste unter Titel den Titel der Seite eintragen: Willkommen!
  • Speichern nicht vergessen.
  • Die Seite uebermich.html erstellen
  • Überschrift: eigener Name (als Überschrift 1 formatieren)
  • Einen Einleitungssatz zu den eigenen Hobbies schreiben
  • Eine Aufzählung mit einigen Hobbies machen:
    Im Eigenschaftsfenster unten Ungeordnete Liste wählen und schreiben
  • Am Ende der Liste mit zweimaligem Enter die Liste beenden und so zum nächsten Absatz gelangen
  • Ein paar Sätze Dummy-Text einfügen
  • Die Namen für die Navigation einfügen
  • Die Seite kontakt.html erstellen
  • Überschrift: Kontakt
  • Dann Kontaktdaten einfügen: Name, Strasse, PLZ Ort, Telefon, Email
    Zwischen Strasse und PLZ Ort kommt eine neue Zeile: Umschalt+Enter, ebenso zwischen Telefon und Email
  • Schließlich wieder die Namen für die Hyperlinks

Verlinkung der drei Seiten

  • Mit der Seite index.html beginnen
  • Das Wort Home exakt markieren
  • Im Eigenschaftsfenster mit dem Symbol Auf Datei zeigen (Spule) auf die Datei index.html rechts im Dateien-Fenster ziehen und loslassen
  • Im Eigenschaftsfenster bei Ziel _self einstellen
  • Über mich markieren und mit der Spule zu uebermich.html ziehen und als Ziel _self auswählen
  • Schließlich noch Kontakt
  • Speichern nicht vergessen
  • Das Gleiche ist mit den zwei weiteren Seiten uebermich.html und kontakt.html zu tun