Links
Links
Embedded Files
Auf jeder Webseite gibt es Links, meistens in Form einer Navigation, welche das einfache Springen von einer zur nächsten Seite ermöglicht.
Links werden auch Hyperlinks genannt und waren die grosse Neuerung bei der Einführung von HTML im Jahre 1993.
Dadurch wurde es möglich, einfach auf entfernte, nicht auf dem gleichen Rechner abgelegte Dokumente zuzugreifen.
Heute können neben HTML-Dokumenten auch E-Mail-Adressen, Telefonnummern und anderen Dokumente (PDFs) verlinkt werden.
Ziele:
Ziele:
G5: Ich kann unterschiedliche Medienformate aufzählen und kann erklären, für welche Art von Inhalt sich diese eigenen.
F5: Ich kann unterschiedliche Medienformate in eine Webseite integrieren (z.B. Bild, Video, Audio)
E5: Ich kann meine Webseite mit unterschiedlichen Medien anreichern (z.B. Layout- und Inhaltsbilder, Multimedia)
Relative Links:
Relative Links:
In Webseiten werden immer relative Links verwendet. Sie kennen die Struktur Ihrer Webseite, wissen aber nicht, ob der Webserver auf einem Unix-System, Mac oder Windows-Rechner läuft.
Deshalb verwenden wir auch immer:
Dateinamen ohne Umlaute, Sonderzeichen oder Leerzeichen.
Datei- und Ordnernamen werden immer kleingeschrieben.
Relative Links starten immer am aktuellen Ort der Verzeichnisstruktur.
.. navigiert eine Hierarchiestufe hoch in der Verzeichnisstruktur
[Ordnername] navigiert eine Hierarchiestufe runter in der Verzeichnisstruktur
/ trennt Hierarchiestufen voneinander
Absolute Links:
Absolute Links:
Absolute Links verwenden wir immer dann, wenn wir auf Dateien einer anderen Domain zugreifen wollen.
Ein absoluter Link ist folgendermassen aufgebaut:
[Protokoll][HOST].[DOMAIN].[TLD]/[PFAD]/[DATEI]?[QUERYPARAMETER][Fragment]
https://www.bbzbl.ch/stundenplan/index.php?standort=&lehrer=12#sp
Verzeichnisstruktur:
Verzeichnisstruktur:
Wenn ich mich in der Ordnerstruktur aus dem unterunterordner2 in den unterunterordner1 bewegen will, muss ich mich zuerst drei Hierachiestufen hoch und dann wieder drei Hierarchiestufen in der Verzeichnisstruktur runterbewegen:
../../../ordner1/unterordner1/unterunterordner1
Funktionen von Links:
Funktionen von Links:
Verlinken auf ein anderes Dokument
<a href="projektarbeit.html">Projektarbeit</a>
Verlinken auf ein Dokument eine Hierarchiestufe höher in der Verzeichnisstruktur
<a href=../projektarbeit.html">Projektarbeit</a>
Verlinken auf ein Dokument eine Hierarchiestufe tiefer in der Verzeichnisstruktur
<a href=html/projektarbeit.html">Projektarbeit</a>
Verlinken auf eine andere Webseite
<a href="https://www.google.com">Google</a>
Verlinken auf eine Textstelle im selben Dokument. Diese Textstelle muss mit ebenfalls mit einem Anker definiert werden. Der Anker hat ein Attribut id mit einem eindeutigen Namen:
<a href="../links.html#links">zu den Links</a>
<a id="links">Links</a>
Verlinken einer E-Mailadresse, damit der Benutzer direkt eine neue E-Mail schreiben kann
<a href="mailto:d.brodbeck@gibmit.ch">d.brodbeck@gibmit.ch</a>
Verlinken einer Telefonnummer, damit auf mobilen Geräten direkt diese Nummer angerufen werden kann.
<a href="tel:0615529595">Rufen Sie an</a>
Zudem können Links so programmiert werden, dass Sie in einem neuen Fenster aufgehen.
<a href="https://www.google.com" target="_blank">Google (neues Fenster)</a>
Video:
Video:
Weiterführende Informationen:
Weiterführende Informationen:
Links:
Page updated
Report abuse