Was ist Hugo und wie funktioniert es?

Wenn Sie vorhaben, eine einfache, inhaltsorientierte Website zu erstellen, möchten Sie wahrscheinlich nicht zu viel Zeit damit verbringen, sie zu programmieren. Dies kann der Fall sein, wenn Sie eine Unternehmenswebsite, einen Blog oder ein persönliches Portfolio erstellen.

Statische Site-Generatoren zielen auf diese Art von Szenarien ab. Sie ermöglichen es Ihnen, eine Website zu erstellen, mit der Sie sich auf Ihre Inhalte und ihr Design konzentrieren können.

Hugo ist ein Beispiel für einen statischen Site-Generator. Es bietet Unterstützung für Themen, Authoring in Markdown und andere Vorteile.

Was ist Hugo?

Hugo ist ein statischer Website-Generator, mit dem Sie eine Website mit wenig bis gar keinem Code erstellen können. Statische Site-Generatoren ermöglichen es Ihnen normalerweise, Ihre Inhalte in a zu schreiben einfache Auszeichnungssprache wie Markdown.

Der Static-Site-Generator konvertiert dann Ihre Inhalte in statische HTML-Dateien. Es wendet alle Vorlagen oder Stile auf Ihre Seiten an, bevor es dem Benutzer bereitgestellt wird.

Mit Hugo können Sie aus einer Bibliothek mit Themen und Website-Designs auswählen, die andere bereits erstellt haben. Sobald Sie ein Design heruntergeladen haben, können Sie mit dem Schreiben Ihrer Inhalte beginnen. Hugo akzeptiert verschiedene Formate, in denen Sie Ihre Inhalte schreiben können.

Was sind Hugo-Themes?

Sie können die Liste von besuchen Hugo-Themen um einen zu finden, mit dem man anfangen kann. Sie können auch ein Thema basierend auf verschiedenen Kategorien auswählen und Designs filtern, die speziell für Blogs, Portfolios und mehr erstellt wurden.

Sie können auf ein Thema klicken, um weitere Informationen anzuzeigen. Hier können Sie das Design herunterladen, um mit der Arbeit daran zu beginnen. Sie können auch eine Vorschau anzeigen, wie das Design nach der Bereitstellung aussehen würde.

Die meisten Themen haben Dummy-Daten als Platzhalter. Wenn Sie das Thema ändern, können Sie diese Details nach Belieben ändern.

Was ist die Struktur einer Hugo-Site?

Die Verwendung eines Designs ermöglicht es Ihnen, Ihre Inhalte mit wenig bis gar keinen Änderungen am Code hinzuzufügen. Sie können jedoch immer noch in den Code eintauchen, wenn Sie Änderungen an seiner Struktur vornehmen möchten. Hugo verwendet Go-Vorlagen, um Variablen und Platzhalter in Ihren HTML-Dateien zu verwenden.

Beim Erstellen eines Hugo-Projekts auf Ihrem Computer werden automatisch die für das Projekt erforderlichen Standarddateien generiert.

Zu den Hauptkomponenten des Projekts gehören:

• Archetypen: Hier können Sie Vorlagen hinterlegen, die beliebige Formatierungen oder zusätzliche Daten für jede Seite definieren können. Wenn Sie eine neue Seite erstellen, basiert diese auf einer Vorlage.
• Vermögenswerte: Hier können Sie alle Assets wie Ihre CSS-Stylesheet-Dateien speichern.
• Inhalt: Hier können Sie die Inhalte für Ihre Website hinterlegen. Sie können jede Seite in einer separaten Datei speichern. Wenn Sie beispielsweise einen Blog erstellen, würden Sie für jeden Beitrag eine Markdown-Datei verwenden.
• Grundrisse: Hier können Sie kurze, wiederverwendbare HTML-Codeschnipsel, sogenannte Shortcodes, speichern. Sie können diese in Ihren Inhaltsdateien verwenden.
• öffentlich: Dies enthält die Dateien und Ordner, die Sie hochladen und auf einem Webserver verwenden können, wenn Sie Ihre Site hosten.
• Themen: Alle Themen, die Sie von Hugo heruntergeladen haben, werden hier angezeigt.

Was sind die Vorteile der Verwendung von Hugo?

Da Hugo recht leichtgewichtig ist und statische Webseiten generiert, können Ihre endgültige Website und ihr Inhalt sehr schnell geladen werden. Dies bedeutet, dass Benutzer beim Surfen auf Ihrer Website nur wenig Wartezeit haben.

Der gesamte Inhalt ist statisch und ändert sich nicht, sobald der Benutzer die Seite betrachtet. Daher müssen Sie sich keine Gedanken über ständige Anfragen an einen Server machen. Sie müssen sich auch nicht um Datenbanken oder die Abrechnung dynamischer Daten kümmern.

Und Sie benötigen keine fortgeschrittenen Programmierkenntnisse, um mit einer Hugo-Site arbeiten zu können. Da Sie jedoch direkten Zugriff auf den Code haben, können Sie ihn vollständig nach Ihren Wünschen anpassen, wenn Sie dies wünschen.

Verwenden von statischen Site-Generatoren zum Erstellen von Websites

Hugo ist ein hervorragender Generator für statische Websites, der Ihre Inhalte in einfache HTML-Dateien umwandelt. Sie können eine breite Palette von Designs verwenden und Ihre Website während des Designprozesses problemlos in der Vorschau anzeigen.

Hugo bietet unter anderem wiederverwendbare Komponenten und eine praktische Standard-Dateistruktur. Aber Hugo ist nur eine Option. Sie sollten weiterhin nach anderen statischen Website-Generatoren suchen, die Sie zum Erstellen einer Website verwenden können.

11 Open-Source-Generatoren für statische Websites, mit denen Sie Ihre Website erstellen können

Lesen Sie weiter

Über den Autor