Eine einfaches Projekt, das 2 HTML-Dateien mit einander verlinkt
-
Erstelle einen neuen Ordner:
uebung_1 -
Öffne deinen HTML-Editor, zB. Sublime Text.
-
Erstelle 2 neue Dokumente („File – New File“ oder "Datei - Neue Datei").
-
Speichere das erste unter dem Namen
index.htmlim Ordneruebung_1ab. -
Speichere deinen Fortschritt auch während der Arbeit regelmässig, besonders vor dem Testen.
-
Speichere das zweite unter dem Namen
unterseite.htmlim Ordneruebung_1. -
In Datei
index.html, schreibe den Text „Gehe zur Unterseite“ -
In Datei
unterseite.html, schreibe den Text „Wieder zur Startseite“ -
Jetzt wollen wir den Text „Unterseite“ mit der angelegten
unterseite.htmlund den Text „Startseite“ mit der angelegtenindex.htmlverlinken. Die Verlinkung (=Verknüpfung) wird mit einem der wichtigsten HTML-Tags gemacht, dem Anchor-Element<a> -
Während du dich in
index.htmlbefindest, schreibe vor den Text „Unterseite“<a href="unterseite.html"> -
Schreibe den Schlusstag
</a>direkt hinter den Text „Unterseite“. -
Nun tu das gleiche in
unterseite.html, um einen Link zurück zuindex.htmlzu erzeugen. -
Nun ziehe eine der Dateien, die du erstellt hast in den Browser deiner Wahl, zB. Chrome. Klicke auf den verlinkten Text. Wie du siehst, springst du nun zwischen den zwei Dateien hin und her.
Herzlichen Glückwunsch, du hast deine erste Website erstellt! Sie sieht noch nicht besonders gut aus, aber ein Verständnis, wie Links funktionieren ist essenziell für die Arbeit an einer Website.
Die veranschlagte Bearbeitungszeit für diese Aufgabe beträgt ca. 30 Minuten.
Die Abgabe dieser Aufgabe ist nicht vorgesehen und dient lediglich deiner eigenen Übung.
- Sublime Text (Editor)
- Zed (Editor)
- Chrome (Browser)