Welches CMS für moderne, schlanke Websites?

[User007]

Wenn ich WordPress installiere und ein Theme installiere, habe ich trotzdem keine Website, keine Basis an was ich mich im CMS orientieren kann.

Alles auf einer Seite und scroll-to-die. [...]

Das ist aber schonmal keine Exklusivität von WP (oder anderen CMS), sondern der "Handling"-Entwicklung im Web geschuldet - alles auf einen Blick und möglichst wenig klicken.
Allerdings ist ja auch keiner gezwungen diese Möglichkeit(en) so umsetzen zu müssen.

Letztlich ist kein System perfekt und man muß sich (wohl oder über) auf den praktikabel bestmöglichen Kompromiß einlassen - oder eben halt mal konsequent dem Kunden gegenüber sein.
Wenn dem nicht vermittelbar ist, warum er Summe X für eine entsprechend qualitative Dienstleistung bezahlen soll, dann soll er's doch halt mit bspw. Wix/Jimdo selbst machen.

Wie Du aber durchaus schon richtig mit der Erwähnung von solchen DIY-Baukasten-Anbietern (wobei auch eben so ziemlich alle Hoster mittlerweile dazu gehören) den Punkt bzgl. Bezahlung triffst, hat sich leider scheinbar proportional auch die Bewertungsfähigkeit für das Verhältnis solcher individueller Leistungs-anforderung und Entgeltung verschoben - u. a. auch eine Folge der gesellschaftlich verbreiteten "Geiz-is'-geil"-Mentalität.
Ich hab' (auch erst nach langer Zeit!) gelernt, dass man da nicht allem hinterhecheln sollte, sondern eher auf den dann auch mehr oder weniger harten Lernprozess des Kunden vertrauen sollte.​

 

[Ray Donovan]

Das ist aber schonmal keine Exklusivität von WP (oder anderen CMS), sondern der "Handling"-Entwicklung im Web geschuldet - alles auf einen Blick und möglichst wenig klicken.
Allerdings ist ja auch keiner gezwungen diese Möglichkeit(en) so umsetzen zu müssen.​

Korrekt. Nur basieren 90% der Themes genau auf diesem Handling. Ich persönlich mag es nicht so sehr, weil eben echt jede seite gleich aussieht.

Wie Du aber durchaus schon richtig mit der Erwähnung von solchen DIY-Baukasten-Anbietern (wobei auch eben so ziemlich alle Hoster mittlerweile dazu gehören) den Punkt bzgl. Bezahlung triffst, hat sich leider scheinbar proportional auch die Bewertungsfähigkeit für das Verhältnis solcher individueller Leistungs-anforderung und Entgeltung verschoben - u. a. auch eine Folge der gesellschaftlich verbreiteten "Geiz-is'-geil"-Mentalität.
Ich hab' (auch erst nach langer Zeit!) gelernt, dass man da nicht allem hinterhecheln sollte, sondern eher auf den dann auch mehr oder weniger harten Lernprozess des Kunden vertrauen sollte.​

Ich nehme solche Aufträge ja auch nicht mehr an. Wenn jemand meint, er bekommt das selbst hin, soll er es machen - sieht dann meistens dementsprechend aus, wobei ich aber zugeben muss, dass es auch Kunden gibt, die eine recht ansehnliche Website mit diesen Anbietern bauen können. Aber ich werde da weder den Preis drücken, noch mich auf irgendwelche Diskussionen einlassen.

Warum eigentlich dieser Thread dann? Ich bin einer Freundin einen gefallen schuldig. Ihre Website läuft noch auf Contao 2.x (updaten haut da nicht mehr hin) und ist da 2014 echt über das Ohr gezogen worden. Ich würde ihr halt gerne eine vernünftige Website bauen, die mich jetzt nicht tagelange Arbeit erfordert aber dennoch etwas besonderes ist - und da kam ich nun einmal mehr an das Problem, was ich schon länger habe wie bereits geschildert.

Wie installiert man solche Tools wie hugo eigentlich auf einem Webhoster? Ich habe ja keinen SSH-Zugang. WordPress etc. lässt sich ja super easy über den Browser/PHP installieren und die meisten Anbieter bieten ja sogar eine 1-Klick-Installation an.

 

[Joshinator]

Wie installiert man solche Tools wie hugo eigentlich auf einem Webhoster?

Musst du gar nicht, mach dein Hugo zu einem Github-Repo.
Schreib deinen Content, wenn zu Github commited wird kann man Github Actions benutzen um Hugo zu starten. Den Output kann man von Hugo dann sogar direkt auf Github-Page veröffentlichen wo man auch eigene Domains hinterhängen kann (Custom Domains kosten aber bei Github etwas)*.
Wenn man da ein Git-CMS vorhängt muss man immerhin nicht mehr manuell commiten, aber das ist die JAMstack Welt. Da solltest du dich am besten erst einmal einlesen, die Static Site Generator Welt ist kein PHP. Das sind Tools mit denen du fertiges HTML generierst wenn du das Tool anstößt, User fetchen also nicht erst was aus einer Datenbank oder Cache sondern bekommen fertige Dateien ausgeliefert die kaum Overhead haben (skaliert toll, weniger optimal wenn der Content oft geupdated wird)


* public Repos können kostenlos eigene Domains hinterlegen

Aber PHP bei nem Webhoster limitiert dich nochmal eine ganze Ecke.
Directus bis Version 7 war PHP (8 ist Node), das ist ein headless CMS wo du irgendeine PHP-Template-Engine vorhängen kannst. Oder CockpitCMS statt Directus, da sind wir bei schlank aber Themes & Co sind kein 1 Click-Stop mehr weil man seine eigene Suppe kocht.

 

[User007]

@Joshinator:
Also ich bin auch schon ein Weilchen in der HTML-Welt dabei, aber ich versteh' grad' leider kaum die Hälfte von Deinem Beitrag. 🤷‍♂️
Weil sich das aber durchaus auch performancemäßig i-wie interessant anhört und ich neugierig bin, hast Du da Anleitungsempfehlungen bzgl. GitHub-Repo (noch nie Kontakt mit GitHub gehabt, was sind besagte Actions?) und den ganzen Verbindungen?​

 

[Ray Donovan]

Ich habe GitHub auch noch nie benutzt außer da mal was herunterzuladen.

Welches CSS Framework würdet ihr denn empfehlen? Falls ich es doch selbst mache. Boostrap finde ich extrem überladen und JS-lastig. Ich nutze gerne das von W3(.CSS), aber das ist recht simpel.

 

[Joshinator]

Weil sich das aber durchaus auch performancemäßig i-wie interessant anhört und ich neugierig bin, hast Du da Anleitungsempfehlungen bzgl. GitHub-Repo

GitHub Actions sind quasi VMs die GitHub auf deren Servern startet. Wenn du Code zu GitHub schiebst kann man dann automatisch so eine Action starten. Die führt dann Hugo aus, Hugo hat eine Output-Ordner und den Ordner kann man dann zu Pages schieben.

Aber wie gesagt, das ist nicht die PHP-Welt. Git sollte man beherrschen, modernes JS-Ecosystem ala npm & Bundler sind nicht verkehrt wenn man mehr als den Standard braucht.
Nen von 0-auf-100 Tutorial kenn ich nicht, am besten Schrittweise durcharbeiten.
Aber im Prinzip kann man sowas in PHP auch schreiben, Template-Engine nutzen und den Output als fertige HTML-Datei abspeichern.
Mehr machen die nicht, gibt halt nen paar nette Tools in den großen SSGs (Bilder automatisch resizen/optimieren, Template-Engines ala Nunjucks die 0815-Filter eingebaut haben)

 

[Rossie]

Boostrap finde ich extrem überladen und JS-lastig.

Bootstrap ist modular. Man kann sich die Teile herauspicken, die man nutzen möchte. Ich bin recht zufrieden damit für ein privates Projekt, arbeite aber auch nicht jeden Tag damit und kenne die aktuellen Alternativen nicht im Detail. Die Dokumentation ist gut und durch die große Verbreitung findet sich bei Fragen schnell Hilfe.

Dass manche Sachen ohne JS nicht funktionieren, finde ich auch nicht gut, aber damit liegt man im Trend. Ich habe die Sachen entsprechend angepasst, die mir nicht gefallen.

 

[BeBur]

Bootstrap verwendet nur an den Stellen Javascript, wo es prinzipbedingt nicht anders geht.

 

[Rossie]

Bootstrap verwendet nur an den Stellen Javascript, wo es prinzipbedingt nicht anders geht.

Das stimmt nicht. Ein Navigationsmenü kann man auch ohne JavaScript umsetzen. Gleiches gilt für ein Akkordion.

Ich bin sehr dafür JavaScript einzusetzen um die Funktionalität zu verbessern, aber auch ohne sollte eine Seite funktional sein. Das ist mit Bootstrap (standardmäßig) leider nicht bei allen Komponenten gegeben.

 

[ayngush]

Soll jetzt nicht blöd klingen und ich persönlich finde Wordpress für ein paar statische Webseiten auch mega dämlich. Aber wenn es um diese Punkte geht, die du ansprichst, wie Theme-Auswahl, generelle Unterstützung der Entwickler / Community, SEO, aber auch so Sachen wie Automatische Updates, Wartbarkeit, Toolkits usw. ist Wordpress leider ungeschlagen.

Aus meiner Sicht gibt es da auch genau zwei Arten von Kunden: Die, die bereit sind für eine gute Webseite die individuelle Entwicklung zu bezahlen und die, die am Ende Wordpress benutzen müssen.

 

[Tokolosh]

@User007
Wenn ich mal fragen darf: Wie deployst du denn deine Anwendungen, bzw. deine Websites? Gibt es keinerlei CI/CD Pipeline oder dergleichen? Ich frage nur deshalb, weil es mich interessiert, weshalb man eventuell nichts von Github bzw. GithubActions gehört haben könnte. Man muss ja nicht zwangsläufig Github nutzen, das meine ich nicht. Es gibt ja auch genug andere Tools für kontrolliertes Deployment. Das klingt eher nach einer prinzipiellen Sache.

Aber kurz zu Static Site Generators wie Jekyll, Hugo, Hakyll, etc...
Diese Tools sind dazu da aus Anweisungen (oft in Markdown-Format) statische Websites zu generieren. Diese könnten dann wie jede andere statische Website deployed werden. Also alle gängigen Webserver, gehosteter Kram oder ein S3-Bucket oder ähnliches. Kein backend-Code, kein User-Interface zum editieren oder dergleichen. Reine Websites.

Was man jetzt machen könnte, was ein CMS ersetzen KÖNNTE, wäre diese Markdown-Dateien zu bearbeiten und in einem Git-Repository zu verwalten. Dort würde dann mit jeder Veränderung (also jedem Push zum Remote Server) einen Prozess anstoßen, der dafür sorgt, dass das jeweilige Tool aus diesen Markdown-Dateien die HTML-Dateien, also die Website generiert und anschließend auf einen Webserver/Webspace deployed.

Problem ist, dass der Umgang mit Versionsverwaltung (git) und simplen Textdateien schon eine riesen herausforderung darstellt. Die Leute wollen lieber in einer Weboberfläche rumklicken und eine völlig überladene Anwendung bedienen, die oftmals noch nichteinmal performante Ergebnisse liefert. Wenn es um reine statische Websites geht, ist so ein CMS einfach keine gute Lösung.

 

[MM3000]

Traurigerweise würde ich dir aufgrund der Anzahl der vorhandenen Templates raten, mal Grav anzuschauen, aber das kanntest du ja bereits ;/
Ansonsten könntest du dir vielleicht noch Automad oder WonderCMS anschauen. Haben beide eher wenige Templates, aber entsprechen recht gut deinen Anforderungen.

Welches CSS Framework würdet ihr denn empfehlen? Falls ich es doch selbst mache. Boostrap finde ich extrem überladen und JS-lastig. Ich nutze gerne das von W3(.CSS), aber das ist recht simpel.

Ich habe einige Jahre mit Bootstrap gearbeitet, war aber immer unzufrieden. Leider gibt es im Bereich CSS nicht den einen heiligen Gral, sondern wiederum nur Kompromisse

Ich arbeite seit kurzem mit Tailwind. Gefällt mir bisher recht gut, man arbeitet quasi direkt im HTML mit vorgegebenen Utility-Klassen; ein anderer Ansatz, der früher und für viele noch heute als Blasphemie zählt Hat wie alles Vor- und Nachteile. Schön ist z.B., dass man per Copy&Paste fast alles 1:1 übernehmen kann und es sieht überall gleich aus aufgrund der festgelegten Klassen.

Hauptproblem ist dann natürlich, dass sich wiederholende Elemente an allen Stellen bei Änderungen immer wieder angefasst werden müssten. Das kann man zum einen über eine Direktive vermeiden, indem man einfach eigenen, übergeordneten Klassen die gewünschte Kombi von Tailwind-Klassen zuweist.
Ansonsten raten die Entwickler zum Extrahieren in Komponenten z.B. per React oder Vue. Für kleinere Projekte kann man das sicher auch mit einer kleinen Template-Lib wie handlebars o.Ä. umsetzen.

Tailwind verwendet überhaupt kein JS, was dir gefallen dürfte. Für die Elemente, die unabdingbar JS brauchen, hat Tailwind Beispiele zur Integration von alpine.js. Das ist wiederum analog für JS das, was Tailwind für CSS darstellt, sozusagen Im HTML selbst kann man sehr flexibel Verhalten integrieren, was einem für kleinere Projekte react oder vue erspart.

Außerdem ist Tailwind derart beliebt, dass es unzählige kostenlose und -pflichtige Komponenten oder ganze Templates gibt:

• Tailblocks z.B. hat viele übliche Komponenten kostenlos im Angebot, von diversen Headern, Footern, call to actions, Kontaktformularen bis hin zu Feature-Sektionen oder sonstige Inhalte. Der Vorteil ist hier wie gesagt das einfache Copy&Paste und fertig (etwas relativiert dadurch, dass einige Tailwind-Komponenten vielleicht eine andere Ausgangsconfig brauchen). Man kann sich gewünschte Seiten flexibel zusammenbasteln.
  
  
• Tailwindcomponents.com: Sammlung mit vielen Komponenten und Templates
  
  
• Tailwindtoolbox.com: Komponenten und ganze Templates

 

[User007]

@Tokolosh:

Das klingt eher nach einer prinzipiellen Sache.

Da mag sicherlich was Wahres dran sein.
Ich bin da eher noch Old-School veranlagt - einfach, weil's bisher in meinem Arbeitsfeld keine (Groß)Projekte mit lfd. Versionsvalidierung gab/gibt.
Die Entwicklung findet auf meinem angemieteten vServer statt und dann wird einfach das fertige Projekt auf die Kundendomain geschoben - fertig.​

Gibt es keinerlei CI/CD Pipeline oder dergleichen?

Was ist das? 😉

 

[Harry2k]

Bei der ganzen Diskussion ist mir immer wieder ein Punkt aufgefallen: SEO soll automatisch gehen...wie bitte soll dies realisiert sein? meiner Kenntnis nach gibt es nur Tools die Optmierungen anzeigen, ansonsten müssen es manuelle Handlungen sein, Automatismen in dem Bereich wirken eher schlecht als recht. Google selber als führende Suchmaschine is da auch erstmal neutral sofern die Punkte die Relevanz bringen beachtet werden. Mich würde wirklich interessieren was für Punkte das CMS on-the-fly optimieren soll.

 

[Joshinator]

Bei Tailwind aber aufpassen das man das richtig die Styles ausmistest.
Die Utility-Klassen sind ganz nett aber es sind halt hunderte von denen man 95% nicht benutzt. Wenn man da nicht ordentlich purged sind das schnell Megabytes an ungenutztem CSS die jeder Kunde herunterlädt.

Aber da sind wir auch wieder bei "schreib das Frontend selbst" was Zeit ist und der "kann ich in WP in 5min"-Kunde nicht zahlen will.

Was ist das?

Automatisierung, nach dem Code schreiben gehst du nicht per FTP auf den Server und lädst was hoch. Sowas ist voll 2006.

Continuous Integration kann von Code & Syntax-Style bis hin zu Ausführung von Tests alles, statt Code einfach in den laufenden Betrieb zu testen laufen automatisiert Tests in einer isolierten Umgebung durch die wissen was passieren soll.
Continuous Delivery wie der Code nachher auf den/die Server kommt und mit der alten Version ersetzt wird.
Bei ner stumpfen CMS Installation ala WP und Drupal aber unnötig.

 

[MM3000]

Bei Tailwind aber aufpassen das man das richtig die Styles ausmistest.
Die Utility-Klassen sind ganz nett aber es sind halt hunderte von denen man 95% nicht benutzt. Wenn man da nicht ordentlich purged sind das schnell Megabytes an ungenutztem CSS die jeder Kunde herunterlädt.

Aufpassen muss man immer Das Ausmisten ist aber hier Teil des Konzepts. Entweder purgen, es gibt aber auch inzwischen einen JIT-Compiler. Die Dokumentation ist diesbezüglich recht anständig.

Die Utility-Klassen an sich sind eigentlich nicht das Nette, Bootstrap hat davon auch eine Menge. Im Grunde muss man nicht mal Tailwind verwenden, es geht eher um die Arbeitsweise. Ist auf jeden Fall erfrischend.

Wenn man noch einen Schritt weitergehen möchte, passt man selbständig nach Bedürfnissen an oder benutzt DaisyUI. Das behebt einige der größeren Nachteile und stellt einen schönen Kompromiss zur eigentlichen Problematik dar.

 

[User007]

Automatisierung, nach dem Code schreiben gehst du nicht per FTP auf den Server und lädst was hoch. Sowas ist voll 2006.

Da wurde wohl das Zwinker-Smiley übersehen. Ich kenn' das schon, wird aber in meinem Bereich nicht benötigt.
Meinetwegen auch noch von 1999, wenn's für das gewünschte Ergebnis funktioniert. 😇
Zum Glück ist man ja nicht gezwungen sich neue Methoden aneignen zu müssen, nur weil 'ne bestimmte Person/Community das etwas als "hip" postuliert - bei mir entscheidet der Use-Case das Benötigte.​

 

[Joshinator]

Naja, wenn sich jemand noch nicht mit Git auseinandergesetzt hat ist es nicht weit hergeholt das „hippe“ Sachen wie CI/CD auch nicht geläufig sind. CI/CD sitzt nunmal zu 90% der Zeit hinter der Versionskontrolle.

 

[User007]

Ja, und das hat durchaus ja auch seine Berechtigung.
Ich kenn' sowas schon von vor zwanzig Jahren bei der Lufthansa System Network im internen Roll-out oder bspw. für Support-Tools.
Mein "hip" war allerdings gar nicht mal nur auf dieses Szenario allein bezogen - insofern: edited.

P.S.:
Aber da ich ja neugierig bin...hab's wohl gefunden... 😏

 

[owned139]

TYPO3 10.4x. Beste wo gibt!
Nein, beste sicher nicht, aber für normale Webseiten will ich nichts anderes mehr als Entwickler.
Alles ist schön sauber strukturiert im Code und es werden neuen Techniken wie PSR-15 HTTP Requests Middlewares unterstützt.
Nachteil: Du musst dich mit TypoScript auseinandersetzen. Jedenfalls die Basics.
Wenn du keinen Quatsch machst, sind die Seiten, dank des Caching-Systems, auch sehr schnell.