Es kann nur ein base-Tag geben
Das HTML base-Element darf nur einmal gesetzt werden und muss immer zwischen dem öffnenden und schließenden head-Tag stehen.
<base href="https://www.mediaevent.de/javascript/" />
Nützlich ist das base-Tag beim Anlegen und Testen von Webseiten. Wenn Bilder und Scripte nicht mit der vollen URL – z.B.
https://meineSeite.de/img/meinBild.png
angesprochen werden, sondern mit einer relativen Adresse
img/meinBild.png
wird diese URL immer um das Verzeichnis aus dem href-Attribut des base-Tags ergänzt. Liegen Seiten für Tests oder während der Entwicklung auf dem lokalen Rechner oder einem Verzeichnis im Netzwerk, findet der Browser ansonsten Ressourcen wie dieses Bild nicht.
Würden z.B. alle Medien und Links einer Seite in ein versioniertes Verzeichnis verschoben, müsste nur <base href="2017-10/"> in den Kopf der Seite eingefügt werden.
base-Tag für Webseiten-Tests auf dem lokalen Rechner
Durch <base href="https://meineSeite.de/" /> wird der Browser alle URLs, die nicht voll durch http:// bzw. https:// und den Domainnamen qualifiziert sind, durch die base-URL ersetzen und sich das Bild aus dem Webverzeichnis laden.
So muss das Verzeichnis /img nicht ebenfalls zum Testserver kopiert werden, Formulare, die auf dem Testserver u.U. nicht ausführbar sind, wären während der Tests genauso verfügbar wie Javascript-Dateien und CSS-Dateien.
Für dieses Szenario müssen alle Verweise auf dem selben Level sein … wird z.B. https://meineSeite.de/blog als Base für alle Verweise eingesetzt, müssen auch alle Links von diesem Verzeichnis ausgehen.
Bei Umzügen der Seiten in eine andere Domaine wird die base-Angabe allerdings zu einem Hindernis. Das base-Tag hat zudem einen großen Teil seiner Bedeutung durch den Einsatz von Content Management Systemen verloren.
Attribute für das base-Tag
- href
- Das Attribut href ist erforderlich. Es definiert die Basis-URL.
- target
- target ist der vorgegebene Name eines Frames oder eines Fensters, in dem alle Zielseiten erscheinen sollen, wenn ein Link auf Ihrer Seite geklickt wurde. Die vier reservierten Namen sind
_blank öffnet alle Links in einem neuen Fenster,
_parent öffnet Links im übergeordneten Frame,
_self öffnet Links im selben Fenster
_top öffnet Links direkt im Browserfenster und nicht als Frame der verlinkenden Seite.
Wird das target-Attribut auf _blank gesetzt, würde jeder Klick auf einen Link eine neue Seite öffnen. Damit geht man besser ausgesprochen vorsichtig um, denn viele Benutzer werden dieses Verhalten ablehnen. Wenn Links schon in einem neuen Tab geöffnet werden sollen – dann über ein target-Attribut im jeweiligen Link-Tag oder per Javascript.
base Tag mit target-Attribut
Wenn der Besucher über einen Link von einer anderen Webseite auf die aktuelle Seite kam, kann das target-Attribut absichern, dass die aktuelle Seite nicht als Frame der linkenden Seite erscheint – also immer das obere Fenster ist.
Frames und Framesets gehören nicht mehr zu HTML5 und sind so gut wie ausgestorben.
Beispiel für den Einsatz des base-Tags
Um eine Seite auf dem lokalen Rechner zu testen und anstelle der lokalen Adresse 127.0.0.1 mit der »wahren« Adresse zu arbeiten:
<head>
<base href="https://www.mediaevent.de/css/" />
</head>
<body>
<img src="meinPng.png" />
...
Der Link im body-Element wird aufgelöst zu:
//www.mediaevent.de/css/meinPng.png
Während wir bei Links das Protokoll nicht vor die URL schreiben müssen, sondern der doppelte Schrägstrich // schon zur Kennzeichnung einer absoluten Adresse reicht, braucht base allem Anschein nach das Protokoll https oder http im href-Attribut.
base-Tag und Anker
Das base-Tag verändert auch einfache Anker-Links. Ein base-Tag überschreibt die Adresse eines internen Links <a href='#anchor1'>Anker</a>.
