Projekt-interne Verweise sind Links auf andere Dateien derselben Website.
Mit einem Anker kann bei Projekt-internen Verweise auch auf eine bestimmte Stelle in einer solchen Datei verlinkt werden.
Bei Projekt-internen Verweisen wird empfohlen, relative
Angaben zu den Verweiszielen zu machen,
wie z.B. ./xyz.php
oder ../xyz.php
oder ../../xyz.php
etc.
Rekapitulation:
Wenn die Datei im selben Ordner ist, wird also ein Punkt geschrieben.
./
Wenn zuerst in den darüberliegenden Ordner geschaltet werden muss,
werden zwei Punkte geschrieben.
../
Bei noch höheren Ordnern wird je Stufe ../
zugefügt.
Das ergibt dann zum Beispiel: ../../
oder ../../../
http://www.uvw.xy
gemacht.
HTML: Grafiken in HTML-Seiten einbinden
Gleiches Verzeichnis = Ordnder in dem die vorliegende Datei, eventuell mit anderen Dateien (Dokumenten) enthalten ist.
Relativer Verweis = Nicht den ganzen Pfad der aufzurufenden Datei angeben,
nur wie die Adresse relativ von der vorliegenden Datei zu der Datei steht,
die aufgerufen werden soll.
1) Eintrag im Quelltext:
Variante 1: mit Punk und Schrägstrich:
./xyz
<p> Relativer Link: <a href="./referenz.php">Link zur Datei "Refernzieren" im gleichen Ordner wie diese Datei</a> </p>
Variante 2: ohne Punk und ohne Schrägstrich:
xyz
<p> Relativer Link: <a href="referenz.php">Link zur Datei "Refernzieren" im gleichen Ordner wie diese Datei</a> </p>
2) Anzeige im HTML-Dokument:
Variante 1: mit Punk und Schrägstrich:
Relativer Link: Link zur Datei "Refernzieren" im gleichen Ordner wie diese Datei
Variante 2: ohne Punk und ohne Schrägstrich:
Relativer Link: Link zur Datei "Refernzieren" im gleichen Ordner wie diese Datei
Bemerkungen:
Um Verweise auf andere Projektdateien zu definieren, empfiehlt es sich, relative Angaben zum Verweisziel zu machen (und nicht den ganzen Pfad mit http:// anzugeben).
Das Projekt bleibt dadurch flexibler, und die Verweise funktionieren auch in anderen Umgebungen (z.B. solange Sie das Projekt lokal auf Ihrem PC erstellen und austesten wollen, oder wenn Sie es mal auf CD-ROM präsentieren möchten).
Der relative Link geht in der Hierarchie der Verzeichnisse zwei Stufen höher:
1) Angabe im Quelltext:
<p> ⇒ Siehe "Internet-Grundlagen": <a href="../../grundlagen/normen/w3c.php> W3C - World Wide Web Consortium</a> </p>
2) Anzeige im HTML-Dokument:
⇒ Siehe "Internet-Grundlagen": W3C - World Wide Web Consortium
Der relative Link geht zwei Stufen höher.
In einer ersten Stufe vom Verzeichnis /verweise/
in des
Verzeichnis /html/
.
Dann in einer zweiten Stufe vom Verzeichnis /html/
in das
Stammverzeichniss /webbau/
.
Im Stammverzeichnis /webbau/
befindet sich ein
Unterverzeichnis /musik/
(das im HTML-Dokument nicht erscheint).
In diesem Unterverzeichnis /musik/
befindet sich die
Datei start.wav
.
Mit diesem realtiven internen Verweis wird also:
/webbau/html/verweise/intern.php
die Datei /webbau/musik/start.wav
aufgerufen.
1) Angabe im Quelltext:
<p> Relativer Link: <a href="../../musik/start.wav"> start.wav3</a> (Haben Sie etwas Geduld: das Laden dauert einige Sekunden) </p>
2) Angabe im HTML-Dokument:
Relativer Link:
start.wav3
(Haben Sie etwas Geduld: das Laden dauert einige Sekunden)
1) Angabe im Quelltext:
<p> Link auf das Stylesheet dieser Website: <a href="../../styles/allgemein.css.php"> allgemein.css.php</a> </p>
2) Anzeige im HTML-Dokument:
Bemerkungen zum Stylesheet:
Wie in dieser Website an entsprechender Stelle angegeben wird, werden in einer separaten PHP-Datei zuerst die Farben definiert und als Datei oben in das Stylesheet eingelesen.
Sie können innerhalb einer HTML-Datei Anker definieren. Dann können Sie Verweise zu solchen Ankern setzen, um einen Sprung genau an die Ankerstelle innerhalb der Datei zu veranlassen.
Der Verweis kann in der gleichen Datei stehen. Dann wird einfach ein Sprung innerhalb der angezeigten Seite ausgeführt.
Der Verweis kann aber auch in einer anderen Datei stehen. Dann wird die Zieldatei geladen, und der Browser springt, sobald er die Stelle mit dem Anker geladen hat, an die entsprechende Stelle innerhalb der Datei.
1) Im Abschnitt Farben muss ein Anker gesetzt werden:
Erklärungen:
Der Code des Ankers lautet:
<a name="mixer">"Name der aufgerufenen Stelle"</a>
Wenn der Anker <a name="mixer">
mit dem Code
mixer
in der entsprechenden Datei aufgerufen wird, springt
der Curser an die Stelle "Name der aufgerufenen Stelle"
und der entsprechende Bildschirm wird angezeigt.
In der vorliegenden Website ist als Name der aufgerufenen Stelle
ein unsichtbarer Strich
"<span style="visibility:hidden">-<br><br><br></span>"
der am oberen Bildschirmrand unter der Kopfzeile plaziert wird,
so dass einige Zeilen darunter der obere Rand des Textes unter der
Kopfzeile erscheint.
Im Normalfall (wenn die Website keine stehende Kopfzeile aufweist und der
Text an oberen Bildschirmrand beginnt) wird anstatt des Striches
-
der Titel der aufgerufenen Seite oder der
angerufenen Stelle angegeben.
Der Code könnte dann also so lauten:
<a name="mixer"><h3>Color-Mixer</h3></a>
<a name="mixer"><span style="visibility:hidden">-<br><br><br></span></a>
2) Mit folgendem Link wird nun auf diesen Anker gesprungen:
<p>⇒ Link: <a href="../farben/waehler.php#mixer"> Color-Mixer</a> </p>
⇒ Link: Color-Mixer