Webauftritte erstellen mit WordPress und Jekyll - eine Gegenüberstellung

WordPress

Im Jahr 2020 werden etwa 40 % aller Webauftritte (engl. Sites) mit dem Content Management System (CMS) WordPress “betrieben”. Der Ausdruck betrieben ist für WordPress-Sites auch zutreffend, werden doch die im Browser dargestellten Seiten beim Aufruf dynamisch erzeugt: auf dem Webserver werden durch den Seitenaufruf die anzuzeigenden Elemente (definiert über HTML, CSS und Javascript Ausdrücke) passend konstruiert und zum Browser des Seiten­besuchers übermittelt. Dazu kommt auf dem Webserver die Programmiersprache PHP und eine MySQL- bzw. MariaDB-Datenbank zum Einsatz. Der Inhalt der Seiten steckt im Wesentlichen in der Datenbank.

Zusätzlich kommen über die wählbaren Themes - das sind die grafischen Eigenschaften der Site, zusammen mit weiteren Funktionalitäten, wie Diskussionsdialogen, News­letter­an­mel­dungen, etc. - weitere Infor­mationen für den Seiten­aufbau hinzu. Für den Ersteller des Auftritts zeichnet sich WordPress durch die bekannte Art des Gestaltens und Anordnens von Inhalten im Stil von Textverarbeitungsprogrammen wie LibreOffice Writer oder Microsoft Word aus: “What You See Is What You Get”.

Augrund der komplexen Architektur mit den Komponenten Datenbank, Programmiersprache PHP und zusätzlichen Plug-ins ist eine Risikobewertung für Cyberangriffe schwierig. Dazu kommen die unterschiedlichen Eigenheiten in Abhängigkeit der Softwareversionen dieser Komponenten (zum Zeitpunkt diese Beitrags steht MySQL bei Version 8.0.19 und PHP bei 8.0.0. Die vom Webhoster zur Verfügung gestellten Versionen sind jedoch je nach Hoster unterschiedlich und auf jeden Fall älter). Häufige, kurzfristige Sicherheits­updates innerhalb der gewählten Hauptversion sind hier Pflicht, um die Angriffs­fläche zu verringern.

Jekyll

Weniger bekannt ist der Ansatz der Erzeugung von statischen Websites mit Generatoren wie Jekyll. Der Besucher und Nutzer des Internetauftritts wird einen Unterschied in der Bedienung nicht feststellen können. Auch die funktionellen Möglichkeiten stehen WordPress in Nichts nach. Für die Nutzerinteraktion, z.B. für die Anmeldung zu Newslettern, ist das Integrieren von externen Diensten notwendig.

Der Ansatz ist hier ein anderer als bei WordPress: sämtliche Inhalte samt grafischer Aufbereitung sind statisch, also liegen schon vor dem Seitenaufruf durch den Besucher als auf dem Webserver abgelegte Dateien vor (auch hier eine Kombination von HTML-, CSS- und Javascript Dateien). Beim Aufruf werden die enthaltenen Daten dann sofort an den Browser übermittelt. Davon profitiert die Ladegeschwindigkeit enorm. Als Folge davon profitiert auch das Potential, im Ranking von Google bevorzugt zu werden - die Wahr­schein­lich­keit bei den Such­treffern weit vorne zu sein, steigt.

Muss der Ersteller der Seiten denn dazu in der Lage sein HTML, CSS und Javascript selbst zu erstellen? Nein - oder besser, so viel oder so wenig wie bei WordPress auch. Allerdings sind Kenntnisse in der vereinfachten Auszeichnungssprache Markdown erforderlich. Wer schon mal Dokumente mit TeX bzw. LaTeX oder in einer Wiki editiert hat, wird sich hier sofort heimisch fühlen. Aber auch die Nutzer, die ihre WhatsApp Nachrichten mit “_Beispieltext_” kursiv oder mit “*Beispieltext*” fett darstellen können, sind damit schon für Markdown qualifiziert. Genauso wie bei WordPress gibt es für die grafische Gestaltung Themes in vielen Geschmacksrichtungen, und neben der frei verfügbaren auch solche von Agenturen, die dafür eine Gebühr erheben. Einen Schritt weiter als Markdown geht die Spracherweiterung Liquid, die es erlaubt, Inhalte teilautomatisch zu generieren und zu pflegen. Hier sind elementare Programmierkenntnisse (Umgang mit Variablen, bedingte Abfragen, Schleifen) vorteilhaft, aber auch schnell erlernt.

Der Generator Jekyll erzeugt dann aus den Elementen in Markdown und dem gewählten Theme die Sammlung der statischen Seiten auf dem lokalen Rechner. Diese lassen sich erst auf dem lokalen Rechner betrachten und testen. Nach erfolgreichem Test werden die Dateien mit FTP oder SFTP auf den Webserver geladen und sind sofort einsatzbereit.

In der Tabelle sind die wesentlichen Unterschiede gegenübergestellt.

  WordPress Jekyll
Erstellung des Auftritts “What You See Is What You Get” Markdown als Auszeichnungssprache
Grafische Gestaltung (Layout) > 1000 Themes zur Auswahl, kostenlos oder gegen Bezahlung > 100 Themes zur Auswahl, kostenlos oder gegen Bezahlung
Automatische Such­maschinen­opti­mierung ja ja
Seitenladegeschwindigkeit bei gleichen Inhalten langsamer schneller
Sicherheit gegen Cyberangriffe setzt konsequente Updates voraus robust gegen Cyberangriffe
Versionierung mit Systemen wie git, SVN, TFS schwierig, da verteilt auf viele Komponenten, u.A. SQL-Datenbank Standard, ohne Einschränkungen
Lokales Testen der Website vor dem Hochladen auf den Server möglich, aber aufwändig Standard, wird automatisch eingerichtet
Funktionalität wie Newsletteranmeldung, Diskussionsdialog integriert über externe Dienste integrierbar
Migration von Einem ins Andere möglich automatisiert möglich

“Making of” dieses Beitrags mit Jekyll in Markdown

Der gesamte Auftritt www.hansduerr.de ist mit Jekyll erzeugt, als Theme kommt Minimal Mistakes zum Einsatz. Zur Veranschaulichung hier ein paar Auszüge aus diesem Beitrag:

---
layout: posts
title:  "Webauftritte erstellen mit WordPress und Jekyll - eine Gegenüberstellung"
date:   2020-12-07 15:38:09 +0100
show_date: true
tags: wordpress jekyll markdown
categories: webauftritt cms sicherheit
---

## WordPress

Im Jahr 2020 werden etwa [40 % aller Webauftritte (engl. Sites) mit dem Content Management System (CMS) WordPress](https://de.wikipedia.org/wiki/WordPress) "betrieben"

[…]

In der Tabelle sind die wesentlichen Unterschiede gegenübergestellt.

| | WordPress| Jekyll
| ------ | ------ | ------ |
| Erstellung des Auftritts| "What You See Is What You Get"| Markdown als Auszeichnungssprache
| Grafische Gestaltung (Layout)| > 1000 Themes zur Auswahl, kostenlos oder gegen Bezahlung| > 100 Themes zur Auswahl, kostenlos oder gegen Bezahlung
| Automatische Suchmaschinenoptimierung| ja| ja
| Seitenladegeschwindigkeit bei gleichen Inhalten| langsamer| schneller
| Sicherheit gegen Cyberangriffe | setzt konsequente Updates voraus | robust gegen Cyberangriffe
| Versionierung mit Systemen wie git, SVN, TFS| schwierig, da verteilt auf viele Komponenten, u.A. SQL-Datenbank| Standard, ohne Einschränkungen
| Lokales Testen der Website vor dem Hochladen auf den Server | möglich, aber aufwändig | Standard, wird automatisch eingerichtet
| Funktionalität wie Newsletteranmeldung, Diskussionsdialog| integriert| über externe Dienste integrierbar
| Migration von Einem ins Andere| möglich| automatisiert möglich


2021

Google Fonts und die DSGVO

Wer eine Website erstellt, steckt dabei auch viel Arbeit in das Erscheinungsbild. Die Site soll dabei unabhängig von Gerätetyp und Browser gleich aussehen. G...

Nach oben ↑

2020

Danke

Ich spende diesen drei Organisationen im Jahr 2020 jeweils einen zweistelligen EURO-Betrag. Danke an euch!

Nach oben ↑