EN

Konsequenzen der Verzeichnisstruktur für die Organisation der Webseite

Die Markup-Dateien mit den Hauptinhalten der Webseite werden unter /content abgespeichert. Hugo erkennt anhand ihrer Dateiendung, welches Eingabeformat darin verwendet wird.

Zunächst ist es wichtig zu klären, über welche URLs unsere erstellten Inhalte auf der Webseite erreichbar sein werden. In der Regel entspricht jede Markup-Datei in diesem Verzeichnis einer eigenen Seite (page). Das Wort Seite ist hier in einem allgemeinen Sinne zu verstehen, der auch Dinge wie Blogbeiträge (blog posts) und Überblicksseiten für Kategorien oder Stichwörter umfasst.

Hugo wird als Generator für statische Webseiten (static site generator) bezeichnet. Damit ist gemeint, dass dabei statische Webseiten ausgehend von selbst geschriebenen Dateien generiert werden. Die zuvor besprochenen Markup-Dateien im content/-Verzeichnis dienen als Hauptinput für diesen Generierungsprozess. Die Ausgaben werden im Verzeichnis public/ abgelegt. Es sind die letztlich erzeugten Dateien, die Besuchern auf Anfrage als Webseite serviert werden.

Für das hier behandelte Theme ist vor allem relevant, wie die Build-Engine die statischen Ausgaben organisiert. Die Verzeichnisstruktur unter public/ entspricht exakt der Struktur unter content/. Wenn sich etwa eine Datei unter content/blog/post-1.md befindet, erstellt die Build-Engine beim Verarbeiten dieser Datei eine HTML-Ausgabe unter public/blog/post-1.html.

Praktisch bedeutet dies, dass die Komponenten von Dateipfaden eins zu eins den Komponenten der URLs entsprechen, über die dadurch erstellte Inhalte abgerufen werden. Ein Beispiel verdeutlicht diesen Zusammenhang: Wenn der Hauptinhalt einer Seite in Markdown geschrieben und in einer Datei unter content/blog/post-1.md gespeichert wurde, ist die Seite unter domain.com/blog/post-1/ erreichbar.

Dieses Grundprinzip wird von der offiziellen Dokumentation auf folgende Weise auf den Punkt gebracht:

Hugo assumes that the same structure that works to organize your source content is used to organize the rendered site.

Auf diese Weise vermeidet Hugo komplexe Routing-Definitionen, wie man sie möglicherweise von anderen Frameworks kennt. Für Endanwender gibt es somit eine Sache weniger, um die sie sich kümmern müssen.

Es ist prinzipiell möglich, eigene URLs für unsere Inhalte festzulegen. Dazu werden bestimmte Schlüssel in der Frontmatter oder der Hauptkonfiguration gesetzt. Das Vorgehen ist mit einigem Mehraufwand verbunden, kann aber in einigen Szenarien wichtig werden.

Neben den Hauptinhalten umfassen Webseiten weitere Komponenten und Informationen. Sie werden nicht unter content/, sondern unter layouts/ definiert. Ihr Hauptverwendungszweck liegt darin, Metadaten oder wiederverwendbare Komponenten wie Header und Footer in die finalen HTML-Dateien einzufügen.

Der Unterschied besteht somit darin, dass Hauptinhalte seitenspezifisch sind, während Layouts und Templates tendenziell wiederverwendet werden können. Bei der automatischen Organisation der Webseite kommt es einzig auf die Hauptinhalte und ihre Dateiorganisation an.

Artikel vom 27. September 2024.