Das <base> Tag

Hin und wieder findet man im <head> einer Website das <base> Tag. Dort können die Attribute href und target alleine oder zusammen definiert werden. Das <base> Tag sollte möglichst zu Beginn des <head> definiert werden, sodass es für alle folgenden Elemente genutzt werden kann. Die dort definierte URL wird für alle folgenden URLs genutzt. Dies gilt für normale <a href= aber beispielsweise auch für <img src= oder <script src=. Auch in modernen CMS wie TYPO3, Drupal oder WordPress lässt sich in den Einstellungen die Base oder BaseURL definieren, weshalb es nicht mehr notwendig ist das <base> Tag selbst einzufügen.

Doch welche Auswirkungen hat die Verwendung des Tags?

In diesem Beispiel

<head>
<base href="http://www.example.tld/verzeichnis/">
</head>

werden alle folgenden Links relativ zu verzeichnis angegeben. template.php würde zu http://www.example.tld/verzeichnis/template.php aufgelöst werden. Dies wäre natürlich auch der Fall, wenn die gesamte Website eigentlich in einem anderen Unterverzeichnis läge.

Wann ergibt es Sinn eine <base> zu definieren?

Es gibt diverse Anwendungsbeispiele für dieses Element von denen hier nur einige gezeigt werden.

Beispiel 1:
Für den Fall, dass an einer Website kurzzeitig lokal gearbeitet werden soll, man hierfür aber nicht alle Assets wie CSS, JS, Bilder etc herunterladen möchte, kann die URL der Website als <base> definiert werden. Durch

<base href="http://www.example.tld/">

können die Assets direkt vom Server geladen werden.

Beispiel 2:
Sind alle Assets beispielsweise in einem Verzeichnis „theme“ gespeichert, können alle Links durch

<base href="http://www.example.tld/theme/">

auf dieses Verzeichnis geleitet werden.

Beispiel 3:
Wenn die gesamte Website in ein anderes Unterverzeichnis auf dem Server verschoben wird, kann durch

<base href="http://www.example.tld/unter/verzeichnis/">

dieses definiert werden, wodurch auch alle relativen Links wieder funktionieren.

Zusätzlich zu href kann auch das Attribut target definiert werden.

<base target="_blank">

sorgt dafür, dass alle Links, für die nicht explizit ein target definiert ist, in einem neuen Fenster geöffnet werden.

Die Schattenseite der <base>

Die Nachteile dieser Methode liegen auf der Hand. Sobald die <base> explizit definiert wurde, richten sich alle Links nach dieser Angabe. Wäre wie in Beispiel 2 ein Theme-Verzeichnis definiert, könnte nicht mehr einfach von einer Seite auf eine andere verlinkt werden. Anstatt <a href=“seite2.html“> müsste die absolute URL angegeben werden, da der Link ansonsten auf http://www.example.tld/theme/seite2.html zeigen würde. Das kann insbesondere zu Problemen mit Links führen, auf die man selbst keinen Einfluss hat (z.B. Links in einem Plugin o.ä.). Zudem lässt sich die <base> nur einmal definieren, es ist nicht möglich unterschiedliche URLs für verschiedene Fälle anzugeben.

Ein Kommentar zu “Das <base> Tag

  1. Pingback: Umstellen einer Website auf HTTPS | k-webs tech blog

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.