Mit dem Online Creator legt die Schweizer Entwicklerfirma Doitclever nicht nur ein flexibles CMS der etwas anderen Art vor, sondern auch ein Partner-Ökosystem für Kunden, die ihren Webauftritt nicht komplett selbst bewältigen wollen.
Artikel erschienen in Swiss IT Magazine 2020/06
Content-Management-Systeme gibt es praktisch wie Sand am Meer. Wordpress, ursprünglich als Blogging-Engine konzipiert, ist eine der populärsten Möglichkeiten, zu einer Website zu kommen und die Inhalte ohne ständige Zuhilfenahme einer Webagentur zu pflegen. Wer mit Wordpress allerdings mehr als ein Blog realisieren möchte, muss eine ordentliche Lernkurve in Kauf nehmen und auf dem Weg zur Wunsch-Website zahlreiche Plug-ins mit teils komplexen Einstellungen einsetzen. Das dazu notwendige Know-how überfordert die meisten Anwender. Website-Baukästen wie Jimdo oder Wix machen das Design einer eigenen Website einfacher – aber sie stossen rasch an ihre Grenzen, wenn es um mehr als eine simple Online-Visitenkarte geht.
Weitergehende Funktionalität erreicht man mit Plug-ins. (Quelle: Doitclever)
Inhalte lassen sich mit dem WYSIWYG-Editor erfassen. (Quelle: Doitclever)
Im Design-Modul werden die Anordnung und die Optionen der Seitenbereiche definiert. (Quelle: Doitclever)
Per HTML Styling definiert man die Struktur der einzelnen Seitenbereiche und die Zuordnung von CSS-Klassen. (Quelle: Doitclever)
Der integrierte CSS-Editor könnte komfortabler sein. (Quelle: Doitclever)
Im Formular-Plug-in legt man die Formularfelder per Drag&Drop an. (Quelle: Doitclever)
Die Startansicht des Online Creators präsentiert die Menüstruktur der Website. (Quelle: Doitclever)
Flexibel, aber nicht kompliziert
Mit dem Produkt Online Creator will das Schweizer Start-up Doitclever die Lücke zwischen Wordpress und Jimdo schliessen. Gründer Mario Sommerhalder hat die erste Version des CMS im Rahmen einer Bachelor-Arbeit entwickelt und zusammen mit seinem Team seither laufend ausgebaut. «Lösungen wie Jimdo sind geschlossene Systeme mit wenig Flexibilität. Wordpress auf der anderen Seite ist äusserst flexibel, aber sehr komplex. Mit anderen Worten: Jimdo bietet zu wenig für Profis, Wordpress ist für Endkunden zu kompliziert», stellt Sommerhalder fest und betont gleichzeitig: «Wir bieten nicht nur ein online nutzbares CMS an, sondern vermitteln zwischen Kunden, die eine Website betreiben wollen, und Partnern wie Webagenturen, Marketing-Agenturen, Textern oder Grafikern.»
Die Idee hinter Online Creator ist also nicht ein Jimdo-Ersatz für abenteuerlustige Endanwender, die sich eine eigene Website zusammenbasteln wollen, sondern ein Tool, mit dem eine Webagentur Kundenwebsites baut und ihren Kunden das bequeme Editieren der Inhalte ermöglicht – allenfalls nachdem der Kunde mit dem CMS bereits erste Gehversuche gemacht hat und seinen Entwurf dann mit Hilfe einer professionellen Agentur vervollständigen möchte. Wir haben die Lösung unter die Lupe genommen und geprüft, ob sie diesem Anspruch genügt.
Module und Plug-ins
Einen ersten Augenschein von Doitclevers Online Creator kann sich jeder Interessent ohne Folgekosten verschaffen: Man registriert sich unter Doitclever.ch und wählt die Free-Variante. Sie umfasst die Standard-Module und ist funktional via Plug-ins erweiterbar – allerdings sind die meisten Plug-ins in der Gratis-Variante nicht enthalten und müssen hinzugekauft werden.
Doch was sind Module, was sind Plug-ins? In der Terminologie von Doitclever decken die Module die Grundfunktionen des Erstellens und Betreibens einer Website ab. Dazu gehören etwa Definieren und Bearbeiten des Designs, Pflege der Inhalte, ein Testsystem mit Vorschau zur Prüfung der erstellten Seiten, ein File Manager zum Hochladen von Bildern, PDFs und so weiter sowie Backup, Statistik und FTP-Upload auf ein beliebiges Webhosting (Voraussetzung: PHP 7).
Das freie Hosting unterscheidet Doitclever denn auch von anderen Lösungen. Bei Wix und Jimdo etwa ist das Hosting zwingend mit dabei, und man hat keinen Zugriff auf die HTML- und CSS-Dateien und auch keinen FTP-Zugang. Es gibt aber auch bei Doitclever eine Option inklusive Hosting. Diese kostet 10 Franken mehr als die Plus-Variante, ist ansonsten aber identisch.
Plug-ins dagegen erweitern die Funktionalität der einzelnen Webseiten, lassen sich über Einstellungen konfigurieren und generieren HTML- und CSS-Code, der automatish an passender Stelle in die Webseiten eingefügt wird. Der Online-Store enthält aktuell 27 Plug-ins mit Funktionen wie Footer, Banner, Blog, Bild-Slider, Galerie, Form Builder oder Google Analytics.
Einige der Plug-ins sind gratis, die meisten jedoch mit einmaligen Kosten zwischen 20 und 200 Franken verbunden. Dies gilt allerdings nur für Abonnenten der Free- oder Basic-Variante des Online Creators. Wer die Plus- oder Pro-Variante bucht, kann alle Plug-ins ohne weitere Kosten nutzen. Und für Entwickler hält Doitclever ein Developer-Kit bereit, mit dem sich auf PHP-Basis eigene Plug-ins konstruieren lassen. Laut Mario Sommerhalder ist dies einzigartig: «Ich kenne kein anderes CMS, das Plug-ins in dieser Weise ermöglicht.»
So sieht es der Anwender
Nach dem Log-in stellt sich der Online Creator auf der Hauptebene wie folgt dar: Zuoberst auf der Seite erscheinen Links zu den Modulen wie Design, Plug-ins, Files und Backups. Sie verweisen auf die entsprechenden Positionen weiter unter auf der Seite – der Online Creator präsentiert sich als One-Page-Website mit aufklappbaren Sektionen für jedes Modul. Oberhalb dieser Sektionen werden das Menü mit allen Seiten der erstellten Website sowie die Struktur der aktuell gewählten Seite angezeigt: Jede Seite ist von oben nach unten in Bereiche eingeteilt, die beim Erstellen des Designs definiert wurden. Zum Beispiel Header, Hauptinhalte und Footer sowie die Meta-Daten. Jeder Bereich erscheint dabei seinerseits als aufklappbare Sektion. Enthält ein Bereich editierbare Inhalte, präsentiert der Online Creator beim Aufklappen einen Editor, mit dem sich Texte, Bilder und Links bequem einfügen und ändern lassen. Der Editor ist somit die Stelle, an der die Endanwender ihre Inhalte pflegen – praktisch selbsterklärend und mit wenig Lernaufwand von jedermann zu beherrschen. Etwas irritierend zeigt sich hier ein Prinzip, das für den ganzen Online Creator gilt: Der Button zum Speichern der Änderungen erscheint nicht etwa, wie anderswo meist üblich, unterhalb der betroffenen Stelle, sondern darüber. Wer sich dies nicht gewohnt ist, vergisst eventuell das Speichern – und wenn man die Hauptseite ohne zu Speichern verlässt, zum Beispiel beim Editieren des Designs, werden die Änderungen nicht automatisch gesichert und gehen verloren. Über die Symbole oberhalb der angezeigten Seitenbereiche können neue Seiten erstellt, die Reihenfolge innerhalb der Navigation verändert und Seiten versteckt oder sichtbar gemacht werden. Zusätzliche Unterseiten für eine verschachtelte Navigation erzeugt man über das Plus-Symbol im Menü, das oberhalb des aktuellen Seitennamens zu sehen ist.
Für Webdesigner und Webentwickler
Im Modul «Design» werden die Inhaltsbereiche, die HTML-Struktur und das CSS Styling der Seiten definiert. Dies erledigt im Nutzungsmodell von Doitclever üblicherweise die Webagentur, die der Endkunde aus dem Partnernetzwerk gewählt hat. In einem Aufklappmenü stehen mehrere Basis-Designs zur Wahl, darunter das aktuell aktivierte Design und alle erstellten Backups. Damit lässt sich leicht ein früherer Zustand wiederherstellen, wenn beim Umstellen des Designs etwas schiefläuft – vorausgesetzt, man hat via Backup-Modul ein Backup erstellt.
Klickt man auf «Editieren», erscheint eine neue Seite mit mehreren Editorbereichen. Als Erstes werden im Punkt «Verwaltung der Webseiten-Struktur» die Seitenbereiche definiert. Für jeden Bereich lässt sich festlegen, ob er editierbar ist – dann wird auf der Startebene beim Aufklappen des Bereichs der Editor für die Inhalte angezeigt. Bereiche, die von Plug-ins bewirtschaftet werden, wie etwa ein Kontaktformular, sollten als nicht editierbar markiert werden. Zusätzlich lässt sich für jeden Bereich festlegen, ob er aktiv sein soll, also beim Aufruf der Seite mitgeladen wird. So können einzelne Bereiche testweise in Varianten ein- und ausgeblendet werden. In diesem Abschnitt legt man auch die Bezeichnungen und per Drag&Drop die Reihenfolge der Bereiche fest. Ein kleines, aber umso gefährlicheres Detail: Beim Löschen eines Bereichs über das Abfallkübel-Symbol fragt das System nicht nach – es wird sofort gelöscht. Wer dann kein Backup des vorherigen Zustands hat, kann Arbeit und Inhalte unwiederbringlich verlieren.
Editoren für HTML und CSS
Im Punkt «HTML Styling» definiert man die HTML-Struktur der verschiedenen Seitenbereiche. Wer ein neues Design von Anfang an erstellt, statt beim ersten Log-in auf eines der bereitgestellten Templates von Startbootstrap.com zurückzugreifen, hat hier die Wahl zwischen den Frontend-Frameworks Bootstrap und Foundation in diversen Versionen oder einer leeren Struktur ohne Framework.
Für jeden der oberhalb definierten Bereiche zeigt der Styling-Editor zwei Felder an. Der darin erfasste Code wird beim Generieren der Seite um den jeweiligen Inhalt herumgelegt. Im ersten Feld finden die einleitenden HTML Tags für die Struktur eines Bereichs Platz: typischerweise , oder
