Wenn du vor ein paar Wochen schon einmal auf dieser Seite warst, wird dir vielleicht auffallen, dass diegutemappe.de seit heute in einem neuen Design erscheint. Und ja, im März hatte ich mich entschieden, die gesamte Website noch einmal von Grund auf neu aufzubauen 🙀 – und dazu einen neuen Website-Builder zu verwenden, um in Zukunft leichter bestimmte Funktionen einzubauen und mehr Flexibilität in der Seitengestaltung zu haben. Aus Erfahrung weiß ich, dass für viele Kreative die Frage »Wie baue ich mein Web-Portfolio?« irgendwann im Raum steht. Deshalb möchte ich dir in diesem Post Einblick in meinen Prozess geben, in der Hoffnung, dass du etwas von meinen Erfahrungen auf deine eigenen Fragen übertragen kannst.

Grundsätzlich gilt es bei einem Web-Portfolio als erstes zu entscheiden, ob du eine Plattform wie Cargo, Adobe Portfolio oder Squarespace nutzen möchtest oder deine Seite selbst hostest. Beides hat Vor- und Nachteile, auf die ich in diesem Post nicht weiter eingehe (wenn dich das interessiert, lass es mich wissen, dann schreibe ich dazu mehr). Ich hoste alle meine Websites selbst (bei all-inkl) und nutze schon seit über zehn Jahren das freie Opensource-CMS WordPress. (Meine ersten zwei Blogs aus den Jahr 2005 (bis 2007) sind übrigens beide noch online. Sie hießen »Mäuse im Weltall«, als Referenz zu den Muppet-Schweinen im Weltall, und »Urbane Talente« (ein Blog über meine Architektur-Diplomarbeit zu Imbissbuden). 🙀😸 Mein allererster Blogpost zeigt eine chinesische Spuck-Maus. Wenn das mal kein Raketenstart in die Blogging-Welt war. 😉)

Die erste Version der guten Mappe habe ich mit Semplice gebaut, einem WordPress-Add-on und Page-Builder, der als Design-Template in WordPress integriert wird. Einmal installiert und aktiviert, verwandelt Semplice WordPress über ein eigenständiges Interface in ein übersichtliches und gut gestaltetes Web-Gestaltungs-Programm, indem du ohne Code und nur über What-you-see-is-what-you-get dein Online-Portfolio bauen kannst. Semplice ist großartig, wenn du genau das brauchst: ein Online-Portfolio. Das kannst du mit wenigen Schritten und superschnell bauen. In der Studio-Version sind viele Funktionen als vorgebaute Blöcke und Module integriert, so dass es noch schneller geht. Die Lernkurve ist steil und erste Erfolgserlebnisse sind ruckzuck da. Meine Sehenistgold-Seite ist zum Beispiel mit Semplice gebaut. Mit www.diegutemappe.de bin ich allerdings schnell an Grenzen gestoßen. Die Einbettung des Formulars für meine Newsletter-Anmeldung hat zwar funktioniert, die gezielte Gestaltung des Formulars allerdings war nur mit komplizierten Umwegen und Drittanbieter-Plug-Ins möglich. Auch ist die Blog-Funktion in Semplice zwar da, aber nur rudimentär gestaltbar. Semplice erlaubt dir zwar, selbst Hand anzulegen im Code, für größere Umbauten ist es allerdings nicht geeignet. Zumindest nicht für mich. Ich habe hier oft frustriert aufgegeben.

Die neue Version der guten Mappe ist deshalb mit dem Template-Builder Oxygen gebaut. Anders als Semplice wird Oxygen als ein Plug-In in WordPress integriert. Einmal installiert deaktiviert Oxygen alle Design-Templates und erlaubt dir, eigene Templates von Grund auf über einen WYSIWYG-Editor, also ohne den Code anfassen zu müssen, aufzubauen. Weil Oxygen nicht etwas Zusätzliches über WordPress drüberstülpt, sondern die eigentliche Struktur von WordPress nutzt, ist die Performance der finalen Website super, weil viel weniger Code geladen werden muss. Die Ladezeiten sind also viel kürzer als bei vergleichbaren Pagebuildern und das bringt Pluspunkte beim Google-Ranking und Karmapunkte bei ungeduldigen Leser*innen. Zwar hat es etwas gedauert, bis ich sichtbare Erfolge vorweisen konnte und das Neubauen hat deutlich länger gedauert als geplant, aber die große Flexibilität, die Oxygen mitbringt, ist es wert, sich einzuarbeiten. Dazu gibt es viele video-basierte Schritt-für-Schritt-Anleitungen auf der Oxygen-Seite, die es mir leicht gemacht haben, mir die Software zu erschließen. Gerade für Menschen, die schon ein Grundverständnis für CSS haben, dennoch lieber mit einer grafischen Oberfläche arbeiten, ist Oxygen perfekt. Man kann zum Beispiel selbst CSS-Klassen anlegen. Diese funktionieren dann wie Absatzformate in Indesign. Einmal geändert, ändern sie sich überall auf der Seite. Auch super praktisch ist die Struktur-Übersicht, in der alle Elemente der Seite und ihre Verschachtelung in Sektionen und Divs visualsiert und per Drag-and-Drop bearbeitet werden können.

Alternative Page-Builder zu Semplice sind zum Beispiel Divi und Elementor. Zu Oxygen gibt es keine echte Alternative 😉 Welche Tools, Plattformen und Builder benutzt du? Welche Erfahrungen hast du gemacht und welche für Funktionen sind dir wichtig?

Hast du noch mehr Portfolio-Fragen? Schreib mir gern, dann nehme ich diese gern in den nächsten Blogposts auf.