Ziele: (1) Lernen, wie man Code von W3Schools in HTML-Teil und CSS-Teil zerlegt; (2) Website hochladen auf den Tech-Lab-Server.
html
ein Unterverzeichnis upload-test
an.upload-test
und ändere HTML-Datei entsprechend.https://ofi.tech-lab.ch/2024
aus.index.html
einen Link zur Seite deines Sitznachbarn.index.html
um in index-original.html
upload-test
und kopiere seinen Inhalt (drei Dateien) in dein Verzeichnis auf dem Tech-Lab-Server.
Beachte: Alle Dateien deines Webprojekts sollten sich in einem eigenen Verzeichnis (und eventuell in Unterverzeichnissen davon) befinden; deine Hauptseite muss index.html
heissen.
Alle Pfadangaben zu Bildern und Videos etc. müssen relativ sein: Wenn du ein Bild (im selben Verzeichnis) mit einem Befehl wie <img src=“kanti.jpg” alt=“Kanti”>
einbindest, solllte dies klappen; vor dem Dateinamen “kanti.jpg” sollte nichts wie C:
oder Onedrive
o.ä. stehen (denn der Tech-Lab-Computer hat keinen Zugriff auf Dateien auf deinem Rechner oder deinem OneDrive).
Das Ziel ist nun, deine Website oder genauer gesagt dein gesamtes Webprojekt von deinem Rechner auf einen Rechner des Tech-Lab (= den Tech-Lab-Server) zu übertragen, so dass jede(r) sie im Schulnetz anschauen kann. Wir verwenden dazu das Programm Filezilla. Zuerst wird eine Verbindung zu dem Tech-Lab-Server hergestellt, danach kannst du wie im File Explorer Dateien verschieben.
Um Zugriff auf den Tech-Lab-Server (oder genauer ein Verzeichnis dort) zu erhalten, benötigst du einen Benutzernamen und ein Passwort, welche du von mir erhältst.
Bevor du den Inhalt deines Verzeichnisses auf den Tech-Lab-Server überträgst: Erstelle eine Sicherheitskopie des gesamten Verzeichnisses!
Grund: Wenn du Dein Verzeichnis bzw. deine Dateien mit Filezilla überträgst, kannst du mit wenigen Mausbewegungen deine Dateien löschen bzw. durch ungewünschte (alte) Dateien überschreiben (wenn du zum Beispiel in die falsche Richtung kopierst).
Dazu benötigst du ein Passwort, das du von mir erhältst.
Auf dem Papierstreifen befinden sich:
Achtung: Erstelle eine Sicherheitskopie des Verzeichnisses, das alle Dateien deines Webprojekts enthält.
(Du wärst nicht der erste, der aus Versehen sein Projekt (oder seine Matura-Arbeit oder seine Doktorarbeit etc.) löscht.)
https://ofi.tech-lab.ch/2024
gehört dir. Bisher befindet sich dort eine “Dummy-Datei” index.html.https://ofi.tech-lab.ch/2024/
aus.index.html
auf dem Server erhalten willst: Benenne in FileZilla die Datei index.html
auf dem Server (also rechts) um, etwa zu index-alt.html
(rechte Maustaste). index.html
.)