Wenn es um das Erstellen von Webseiten geht, gibt es bei uns bisher nicht viel zu lesen. Zwar gibt es einzelne Artikel zu einzelnen Werkzeugen, doch die grosse Übersicht fehlt. Deshalb möchte ich die Community ermutigen, sich an dieser Serie zu beteiligen. Dabei geht es um eine Unterkategorie der Werkzeuge zum Webseitenbau, den SSGs.
Inhaltsverzeichnis
Was sind Static Sites?
Bevor wir uns den Generatoren zuwenden, gilt es zu klären, was "Static Sites" sind. Die Wikipedia definiert es so:
Eine statische Webseite ist eine, die genau so gehostet wird, wie sie dem Webbrowser ausgeliefert wird, im Gegensatz zu dynamischen Webseiten, die von einer Webanwendung zum Zeitpunkt des Aufrufs generiert werden. Technisch sind statische Webseiten HTML-Dokumente, die als Dateien im Dateisystem gespeichert und vom Webserver zur Verfügung gestellt werden.
Diese Definition finde ich nicht überzeugend, weshalb ich auf die Vorteile von statischen Webseiten eingehen möchte:
- Schnelle Ladezeiten
- Geringer Ressourcenbedarf
- Hohe Sicherheit
- Wartungsarm und zuverlässig
- Skalierbarkeit
- Kosteneffizienz
- Einfaches Hosting
- Universelle Kompatibilität
- Flexibles Design
Detaillierte Erklärungen der Vorteile findet ihr in den Quellen. Statische Webseiten eignen sich besonders für Landingpages, kleine Unternehmenswebsites und alle Projekte, bei denen keine ständigen Inhaltsaktualisierungen oder komplexe Interaktionen erforderlich sind. Statische Seiten haben auch Nachteile:
- Manueller Aktualisierungsaufwand
- Eingeschränkte Funktionalität
- Mangelnde Personalisierung
- Für Laien schwer wartbar
- Begrenzte Dynamik
Eine Liste von fünf beliebten SSGs findet ihr oben im Inhaltsverzeichnis. Ob zu allen ein Artikel in dieser Serie geschrieben wird, liegt an euch und nicht an mir. Ich verwende Hugo seit knapp 10 Jahren, um statische Webseiten für Bekannte, kleine Firmen und Organisationen zu entwerfen und zu unterhalten. Auch die Webseiten Lernen wie die Profis und Fedigov wurden von mir für die FSFE mit Hugo erstellt.
Was ist bei den Static Site Generatoren zu bedenken?
Viele, die an den Aufbau einer Website denken, haben Werkzeuge wie WordPress, Drupal, Joomla oder Typo3 im Kopf. Häufig sind es auch höher abstrahierte Webpage-Baukästen, die von Internetbuden oder Hostern angeboten werden. Dabei haben wir es mit mindestens drei Abstraktionsebenen zu tun, die sich völlig voneinander unterscheiden. Zu den Baukästen kann ich nichts schreiben, da ich diese nie verwendet habe. Seit ca. 20 Jahren betreibe ich meine private Homepage mit Joomla. Das kann man machen. Joomla ist sehr stabil, hat jedoch eine gewisse Lernkurve, bis man das Modell dahinter verstanden hat. Migrationen von einer Hauptversion auf die nächste sind immer mit tagelanger Arbeit verbunden. Solche Werkzeuge werden auf dem Webserver installiert, im Browser bedient, benötigen eine Datenbank und haben eine grafische Benutzeroberfläche.
Die SSGs sind ganz andere Kaliber. Einerseits sind sie einfacher, andererseits jedoch schwieriger. Das klingt widersprüchlich, ist aber wahr. Wer sich auf diese Werkzeugkategorie einlässt, sollte:
- keine Angst vor dem Terminal haben
- Markup in- und auswendig kennen
- fortgeschrittene Kenntnisse von GIT, HTML, CSS und JSON haben
- keine Angst davor haben - früher oder später - knietief im Code zu stehen
SSGs werden im Terminal und in einem Texteditor (Markdown-Editor oder einer IDE) bewirtschaftet. Wer eine grafische Benutzeroberfläche auf dem Desktop oder im Webbrowser erwartet, wird von SSGs enttäuscht sein.
Verzagt nicht, sondern wagt es!
Das klang jetzt etwas negativ, was ich nicht beabsichtige. Die Arbeit mit SSGs erfordert ein wenig mentale Offenheit. Mit der WordPress-Attitüde im Kopf kommt man nicht weit und wird schnell enttäuscht. SSGs sind nicht für jedes Web-Projekt und nicht für jeden geeignet. Den ersten konkreten Artikel in dieser Serie wird es von mir zu Hugo geben, falls ich es vor meinem Urlaub noch schaffe. Ob es Beiträge zu den anderen Static Site Generators geben wird, hängt nicht von mir, sondern von euch ab.
Titelbild: https://pixabay.com/photos/artisan-crafts-horseshoe-work-4677396/
Quellen:
https://de.wikipedia.org/wiki/Statische_Webseite#Statische-Website-Generatoren
https://omf.ai/lexikon/statische-website/
https://de.siteground.com/kb/was-ist-eine-statische-website/
und ich wollte gerade mit https://getpublii.com/de/ loslegen ...
Heutzutage, wenn immer mehr boshafte KI-Bots Internetseiten lahm legen (um Daten zu sammeln oder Big-Tech-kritische Seiten lahm zu legen), können statische Seiten (+ Anubis) sehr praktisch sein.
Das ist ein Wald mit sehr vielen Bäumen, denn es gibt so ungefähr 300 - 400 Static Site Generatoren: https://jamstack.org/generators/ oder hier https://staticsitegenerators.net/
Eine andere Definition wäre: "Website-Builder, deren Output fertige Webseiten generiert, die zum Laden der Seite vom Server bzw. beim Aufruf / Abruf der URL ! keine ! Datenbank benutzen (müssen). Inwiefern die Einbettung von JavaScript innerhalb einer statischen Webseite als "statisch" oder "dynamisch" betrachtet wird, mag vom konkreten Einzelfall abhängen und muss jeder für sich selbst entscheiden. Als eine Art von Untergruppe der SSGs sehe ich da noch die sog. "FlatFile CMS" ...
Das ist es! Danke für den ausführlichen Kommentar, stimme dem voll und ganz zu.
Bitte auch GRAV und Pelican mit einbeziehen, dies sind ebenfalls große und bekannte Kandidaten neben Hugo, Bludit oder Ghost.
Dann schreibe bitte einen Artikel für diese Serie. Bei uns schreibt die Community für die Community.
Ich empfehle jedem, sich auch Coleslaw mal anzusehen. Das ist in Lisp geschrieben und ich bin da gerade Maintainer und das soll sich wenigstens lohnen. :-)
Dann schreibe bitte einen Artikel für diese Serie. Bei uns schreibt die Community für die Community.
Ich frage mich immer, für was die ganze Systeme zur Website Erstellung gut sind. Ich erstelle meine Webseiten direkt mit HTML, CSS, PHP und Javascript. Und die Einarbeitung ist bzw. war nicht aufwendiger, als in irgend ein Webseitenerstellungssystem.
Sie sind dafür gut, um einem das Leben zu erleichtern. Selbstverständlich kannst Du alles von Hand machen. Willkommen in der Nische.
Ich empfehle Datenstrom Yellow aus Lund in Schweden. 👍
Dann schreibe bitte einen Artikel für diese Serie. Bei uns schreibt die Community für die Community.
Wollte mir Hugo schon länger mal ansehen. Da bin ich sehr ges6auf deinen Artikel. Meine HTML und CSS Kenntnisse sind zwar etwas rostig, hoffe aber dass beide immer noch in Hugo als Alternative zu / anstelle von Markdown verwendet werden können. Vor allem wie man Textbausteine mehrfach wiederverwendet, interessiert mich. Von den anderen Editoren habe ich noch weniger gehört als von Hugo. Da gibt's bestimmt auch ein paar Perlen. Bin sehr neugierig.
Dann warte auf meinen zweiten Artikel zu Hugo oder mache dich selbst mit der guten Dokumentation vertraut: https://gohugo.io/documentation/
Hallo! Ich betreibe aktuell eine Website die sich so gut wie nie ändert mit einem CMS. Würde gerne die Seite neu als "statische" Website erstellen (Allgemein - Info - Fotos - Konakt/Impressum). Die einzige Anforderung die ich habe, ist dass ich eine zeitgestuerte Einblendung von Text benötige. Das möchte ich vorher eintragen (z.B. dass ein bestimmter kurzer Text [meist eine Abwesenheit oder dergleichen] in 4 Tagen um 21:00 Uhr sichtbar ist. Und zwar bis in 6 Tagen um 08:00 Uhr). Was würdet ihr mir empfehlen. Sollte leicht zu verwenden sein. Verwende auch gerne Standard Themes. Danke! Tim
Der Inhalt von einzelnen Hugo-Seiten wird als Markdown-Datei geschrieben. Diese Dateien haben Meta-Informationen, die sich Front Matter nennen. Darin gibt es Angaben zum Erscheinungs- und Verfallsdatum eines Beitrags. Schau mal hier: https://gohugo.io/content-management/front-matter/
Hallo Ralf! Vielen Dank! Das schaut genau nach dem aus was ich brauche!
Für meinen rein persönlichen Kram verwende ich seit Jahren
pandoc
, d.h. alles an Ausgangsmaterial ist markdown, teilweise aber auch mit dort enthaltenem html.Eingebunden in die markdown Dateien, sind -bedarfsweise- auch manuell zusammengeklöppelte html Seiten "von früher".
Es wird automatisiert
css
eingebunden und ein html Schnippsel mit meinem SeitenMenü
. Sobald ich irgendwas geändert habe, drücke ich einen Knopf und alles an .md im Verzeichnis wird nach .htm übersetzt.Der Kram aus
Unterverzeichnissen
(s.o.), wird manuell eingebunden, aber solange ich mein html Menü konsistent halte, kann da nichts schief gehen.PS: Was ich bislang nicht habe, ist eine geeignete Ansicht bzw. ein "Style" für die Darstellung auf
Mobilgeräten
(was ja beignulinux.ch
problemlos und erfreulich gut funktioniert).Für die Musiker gibt es auch einen SSG:
Faircamp sieht noch cool aus!
https://simonrepp.com/faircamp/