Was spricht für Hugo?

Web-Frameworks gibt es wie Sand am Meer. Daher stellt sich die Frage, warum die Wahl auf Hugo fallen sollte. Hugo wurde gezielt für bestimmte Arten von Webseiten entwickelt und ist optimal auf diese Anforderungen abgestimmt.

Im Folgenden werden einige Merkmale besprochen, die Hugo für das umgrenzte Anwendungsgebiet auszeichnen. Seine überschaubare Komplexität macht es nicht nur zu einem praktischen Werkzeug, sondern auch zu einer ausgezeichneten Lernplattform. Abschließend werden einige hilfreiche Funktionen vorgestellt, die Hugo von ähnlichen Frameworks abheben.

Spezielles Anwendungsgebiet

Hugo zeichnet sich vor allem durch zwei Hauptmerkmale aus. Erstens generiert es statische Webseiten, was in der Praxis deutlich schnellere Ladezeiten zur Folge hat. Zweitens liegt Hugos Fokus klar auf textbasierten Inhalten. Hauptinhalte werden benutzerfreundlich in Markdown oder ähnlichen Formaten verfasst, was Hugo ideal für persönliche Webseiten, Blogs, Dokumentationen, Portfolios und Magazine macht.

Seiten dieser Art präsentieren ihre Inhalte häufig auf übersichtlichen Überblicksseiten. Ein Blog etwa zeigt typischerweise Titel, Veröffentlichungsdatum und Auszug eines Beitrags an. Solche Layouts sind ein zentraler Bestandteil von Hugo und lassen sich leicht den individuellen Bedürfnissen anpassen.

Hugo vermeidet Komplexität

Die angeführten Merkmale bedeuten im Umkehrschluss: Mit Hugo kann man viele Dinge nicht tun, für die man üblicherweise auf ein Web-Framework zurückgreifen würde. Dies kann jedoch als Vorteil betrachtet werden – besonders aus der Perspektive von Einsteigern in die Webentwicklung.

Webseiten sind für gewöhnlich das Ergebnis eines komplexen Zusammenspiels verschiedener Technologien. Auf der sichtbaren Seite – dem sogenannten Frontend – werden Inhalte mit HTML verfasst und strukturiert, mit CSS gestaltet und mit JavaScript um dynamische Möglichkeiten ergänzt. Technologien wie AJAX ermöglichen außerdem interaktive Inhalte.

Weitere Technologien sind nötig, wenn Benutzerdaten gespeichert oder verarbeitet werden. In Web-Anwendungen wie Social-Media-Plattformen oder Online-Shops müssen Benutzer sich anmelden und einloggen können; dazu werden Informationen auf Servern in Datenbanken gespeichert. Solche Datenverarbeitungen erfordern Software für das serverseitige Backend. Die dazu verwendeten Programmiersprachen folgen typischerweise einem objektorientierten Ansatz der Softwareentwicklung.

Andere Frameworks helfen der Komplexität der angeführten Zwecke zu begegnen, stellen aber wiederum ihre eigenen Anforderungen. Ruby on Rails oder Laravel zwingen ihren Anwendungen eine Architektur auf, bei denen verschiedene Konstrukte der objektorientierten Programmierung auf vordefinierte Weise ineinander greifen. Natürlich muss auch dieses Entwurfsmuster verstanden werden.

Für Einsteiger kann dies überwältigend sein. Viele greifen zu Tutorials, deren Spielzeugbeispiele die notwendigen Kenntnisse zu vermitteln versuchen. Hugo hingegen ermöglicht es, das eigentliche Ziel sofort anzugehen. Nicht nur sind damit vergleichsweise schnell Webseiten erstellt. Während der Einarbeitungsphase wird man sich Konzepte und Fähigkeiten aneignen, die auch für komplexere Projekte vorausgesetzt sind.

Hugo als Lernplattform

Die Maintainer von Hugo versprechen, dass sich einfache Webseiten innerhalb weniger Minuten aufsetzen lassen. Das Grundgerüst kann dabei Schritt für Schritt erweitert werden, um die Webseite nach eigenen Vorstellungen anzupassen.

Die verschiedenen Komponenten des Systems lassen sich weitgehend als Module verstehen, die separat erlernt werden können. Mithilfe der Dokumentation lässt sich schnell erkennen, welche Änderungen wo vorgenommen werden können. Das neu erworbene Wissen kann unmittelbar angewendet werden, um Aspekte der gerenderten Webseite anzupassen und zu verbessern.

Durch Hugos Fokus auf statische Seiten ist das Frontend für Entwickler vereinfacht: JavaScript entfällt komplett. Wer HTML oder CSS vermeiden möchte, kann auf Themes zurückgreifen. Auf der offiziellen Webseite findet man eine sehr gute Auswahl ansprechender Designs. So kann man sich beim Einstieg auf das Schreiben der Inhalte in Markdown konzentrieren.

Selbst wer bei Null anfängt, wird schon an diesem Punkt einiges gelernt haben. Der Prozess beinhaltet den Umgang mit Kommandozeilen-Befehlen, Textdateien und die Grundlagen der Markdown-Syntax. Vielleicht hat man auch das erste mal mit einem Texteditor gearbeitet und einen ersten Eindruck von seinen Funktionen bekommen.

Für ein fundierteres Verständnis ist es natürlich notwendig, eigenen Code zu schreiben. Ein umfassendes und responsives Design zu entwerfen, ist keine leichte Aufgabe. Allerdings kann man durch eigene Style-Regeln kleinere Anpassungen am bestehenden Theme-Design vornehmen. Mit den DevTools des Browsers kann man zudem die Deklarationen der Elemente analysieren und besser verstehen, was das Layout ausmacht.

HTML spielt eine unmittelbare Rolle beim Erstellen von Templates, ein weiteres Feature, das man sich früher oder später anschauen möchte. Das bietet einen guten Anlass, um etwas über Best Practices beim Erstellen von Webseiten zu lernen. Beispielsweise darüber, welche Informationen in den Head einzelner Seiten aufgenommen werden sollten und wie man diesen Anforderungen mithilfe von Base-Templates gerecht wird.

Wie bereits erwähnt folgen Backend-Sprachen zumeist dem objektorientierten Programmierparadigma. Auch wenn Hugo keine serverseitige Datenverarbeitung unterstützt, eignet es sich für einen sanften Einstieg ins objektorientierte Denken. Denn mit Go wird im Template-Kontext eine Sprache genutzt, die Komponenten wie Einzelseiten, Ressourcen oder die Webseite selbst als Objekte modelliert.

Die im Kontext eines Templates verfügbaren Daten werden automatisch erstellt und müssen nicht explizit als Klassen definiert oder als Objekte instanziiert werden. Ein Verständnis dieser Begriffe wird daher nicht vorausgesetzt. Anwender müssen lediglich wissen, wie der Kontext funktioniert und wie man Daten mithilfe vordefinierter Methoden abruft.

Mit diesen Werkzeugen können professionelle Webseiten erstellt werden. Auch wenn Hugo nicht für alle Webseitenarten geeignet ist, lassen sich viele der gewonnenen Kenntnisse auf komplexere Frameworks übertragen.

Weitere Hilfsmittel

Zusätzlich zu seinen Kernfunktionen bietet Hugo eine Reihe von Hilfsmitteln, die auch bei anderen Static Site Generators wie Jekyll oder Pelican nicht selbstverständlich sind. In diesem Zusammenhang sind zunächst die enthaltenen Kommandozeilenwerkzeuge zu nennen.

Damit lässt sich ein Live-Reloading-Server starten, der Änderungen erkennt und die im Browser geöffneten Seiten automatisch aktualisiert. Ein weiteres hilfreiches Feature ist das Archetypen-System, mit dem neue Inhaltsdateien vorab mit Metadaten und einer passenden Struktur für verschiedene Inhaltstypen befüllt werden können.

Darüber hinaus bietet Hugo umfassende Unterstützung für die Lokalisierung (l10n) von Inhalten, was es ideal für mehrsprachige Websites macht. Verschiedene Funktionen und Methoden, die in den Templates verwendet werden können, ermöglichen zudem automatische Anpassungen, um regionale Unterschiede in der Darstellung und Formatierung zu berücksichtigen.