Titantinas kreativer und nachhaltiger Mamablog

Für Tina von titantina war es an der Zeit für etwas Neues. Ich habe einen neuen Blog mit klarem Layout und Design entwickelt, angepasst auf Tinas Prozesse und basierend auf dem CMS Statamic.

titantina

Kreativer und nachhaltiger Mamablog über Family Life, Upcycling und Green Lifestyle.

Tina von titantina bloggt bereits seit 2009 und ist eine der coolsten österreichischen Bloggerinen in ihrer Szene. In ihrem kreativen und nachhaltigen Mamablog fokussiert sie sich auf Family Life, Upcycling und Green Lifestyle.

Fertiggestellt April 2019
Partner Tina Vega-Wilson (titantina)
Tätigkeit Blog

Neue Website und Blog-Relaunch (inkl. Backend) für den Blog von titantina

Für Tina von titantina war es an der Zeit für etwas Neues. Ich habe einen neuen Blog mit klarem Layout und Design entwickelt, angepasst auf Tinas Prozesse und basierend auf dem CMS Statamic.

Tina von titantina.at — In ihrem Mamablog hält die naturliebende und kreative 3-fach Mama aus Niederösterreich seit 2009 authentische und natürliche Momente aus ihrem Leben fest.

Im Dezember 2018, kurz vor Weihnachten hatte ich den ersten Kontakt mit Tina von titantina.at. Tina hat mir ihren Blog vorgestellt und erzählt, dass sie seit über 10 Jahren als Bloggerin tätig ist und dabei leidenschaftlich gerne Blogartikel mit Fokus auf Nachhaltigkeit, Family Life, Upcycling und Green Lifestyle verfasst.

Ihr bisheriger Blog baute auf Google Blogger auf, ein im Jahr 1999 entwickelter Dienst, welcher de facto tot ist und nicht mehr weiterentwickelt wird. Die Inhalte sowie die Verfügbarkeit stehen unter der Kontrolle eines großen Konzerns, was natürlich auch Spielraum für intransparente Prozesse und wahllose Löschungen lässt. Tina brauchte also technische Unterstützung, um ihren Blog auf neue Beine zu stellen!

Besonders wichtig für Tina war ein modernes CMS mit vielen Möglichkeiten, einfacher Handhabung und ein CMS welches speziell auf ihre Bedürfnisse angepasst werden kann. Außerdem galt es ein neues Design mit passendem Layout zu entwickeln um Tinas Marke und ihre Botschaften optimal zu betonen.

Für mich war schnell klar, dass wir die liebevoll geschriebenen und mit selbst geschossenen Bildern untermalten Blogbeiträge in den Vordergrund stellen müssen, d.h. eine Content-First-Strategy verfolgen, um die Inhalte sauber und ohne Ablenkung präsentieren zu können.

Content-First — Titantinas neuer Blog legt klaren Fokus auf die Inhalte; Texte und Fotos sollen so optimal zur Geltung kommen.

Ein zeitgemäßes Content-Managment-System

Der neue Blog soll neben den bestehenden Beiträgen und dem einfachen Verfassen neuer Beiträge auch Pressestimmen, Kooperationspartner und Produkte anzeigen können. Da diese ebenso verwaltet werden müssen, ist die Wahl des richtigen CMS ausschlaggebend.

Als Content-Managment-System kommt Statamic zum Einsatz — ein modernes, dateibasiertes und intuitives CMS. Weiters kann Statamic exakt auf die Bedürfnisse von Tina angepasst werden. Denn individuelle Entwicklungen machen am meisten Spaß :) — das bietet nämlich den meisten Mehrwert!

Beitragsverwaltung — Einfaches, übersichtliches Backend zur intuitiven Veröffentlichung von Inhalten. Hier im Bild sind die letzten Posts zu sehen.

Status Quo waren übrigens um die 1.100 ausführlich geschriebene Blogbeiträge, 50 Rubriken und insgesamt mehr als 7.500 verschiedene Bilder — eine enorme Menge an Daten also. All diese Inhalte mussten natürlich nahtlos übernommen werden. Die Blogbeiträge galt es in einem ersten Schritt aus Blogger zu exportieren, dann in Statamic zu importieren, in einem weiteren Schritt wurden Inhalte gesäubert, Daten bereinigt, in ein einheitliches Format gebracht und bereits erste inhaltliche Neuzuordnungen getroffen (zum Beispiel: Rubriken vereinheitlicht und Duplikate entfernt). Hier wurde die Blogger API genutzt um alle bestehenden Daten automatisch zu verarbeiten.

Übersichtlicher Einstieg

Inhalte müssen auf den ersten Blick präsentiert werden. Tinas Leser sollen direkt auf der Startseite die aktuellsten Beiträge verfolgen können und das Menü bietet weiters eine Übersicht über titantinas Rubriken. Im Headermenü werden die vorhandenen Rubriken thematisch geordnet und die jeweils letzten Beiträge angezeigt. Dies vermittelt schnell einen guten Überblick über die Vielzahl an Themen über die Tina bloggt und gibt bereits einen ersten Einblick in die einzelnen toll geschrieben Artikel!

Im Headermenü erhält man eine Übersicht über alle Rubriken und eine Vorschau der einzelnen Blogbeiträge.

Die Zuordnung erfolgt im Backend: durch einfaches auswählen der Rubriken wird automatisch ein Menüeintrag dargestellt und ebenfalls automatisch die letzten Blogbeiträge dieser Kategorie angezeigt.

Im Backend können die verschiedenen Rubriken einfach zum Menü hinzugefügt werden.

Somit kann Tina jederzeit Ihre Rubriken im Menü anpassen und selbständig steuern, was angezeigt wird. Das bietet Tina Flexibilität und schafft Unabhängigkeit!

Der wichtigste Punkt im Bild

Focal Point - Hier kann der wichtigste Bildpunkt ausgewählt werden um passgenaue Zuschnitte in allen Größen zu bekommen.

Besonders cool ist die Implementierung der Fotoverwaltung. Bei allen Bildern kann ein "Focal Point" ausgewählt werden, also ein Punkt auf dem Bild, wo das Wichtigste zu sehen ist. Ist dieser Punkt definiert, werden sämtliche Vorschaubilder und Thumbnails um diesen Punkt herum zugeschnitten. Die fest definierten Bildgrößen auf der Website werden so mit passenden Bildern versehen. Die zugehörigen Beitragsbilder sind immer perfekt zugeschnitten, es fehlt an nichts, und abgeschnittene Gesichter gehören der Vergangenheit an! Bei Tinas tollen Bildern macht dies einen enormen Unterschied und die Bilder unterstützen so das Storytelling noch besser und setzen einen emotionalen Fokus! Das gefällt auch titantinas Leserinnen und Lesern.

Ein inhaltliches Erlebnis

Zu einer Website gehört mehr als nur das Design, ein paar Fotos und coole technische Komponenten. Eine Website muss leben, eine Website muss eine Geschichte erzählen und diese verbreiten können. Um das zu schaffen ist das Layout und insbesondere qualitativer Content wichtig. Hier kommt der Bard-Editor von Statamic zum Einsatz. Ein wirklich genialer Editor zum Verlieben!

Layout und Design von titantinas Fotografie Seite mit klarem Fokus auf die inhaltlichen Elemente

Im Bard Editor sind die verschiedensten inhaltlichen Elemente wie Zitate, Bilder, Galerien, Videos oder Produkte vorhanden bzw. speziell für Tina entwickelt worden, um auch hier größtmögliche Flexibilität zu bieten. Die Module können an jeder beliebigen Stelle eingefügt werden und verschoben werden, innerhalb eines Fließtextes kann so das Layout an vielen Stellen aufgelockert werden. Dem kompletten Layout sind somit keinerlei Grenzen gesetzt und es kann laufend an neuen Modulen entwickelt werden.

Content Editor: Mehre eigens entwickelten Module ermöglichen den Content mit wertvollen Informationen zu untermalen und layouttechnisch aufzupeppen.

Vollständige Migration

Seit dem Relaunch des neuen Blogs hat sich aber nicht nur am Design einiges getan. Auch die technische Struktur, die übersichtliche Darstellung aller Rubriken und die Anzeige aller bestehenden Blogbeiträge wurden optimiert. Dies wirkt sich direkt auf die die Platzierung in den Suchmaschinen aus und sorgt weiters dafür, dass auch Inhalte die weiter zurückliegen von Besuchern wahrgenommen werden können.

Ein immenser Mehrgewinn in jeglicher Hinsicht für meinen Blog, welcher auf eine eigene Domain migriert und technisch up to date gebracht wurde. Der Inhalt der vergangenen Jahre ist nun endlich sichtbar und gut strukturiert.

Content ist naturgemäß King aber das technische Grundgerüst muss auch stimmen. Die alte (Sub)domain wurde auf die neue Website (mit der neuen Domain titantina.at) suchmaschinenfreundlich weitergeleitet, im alten Blogger-Blog wurden einheitliche Canoncial-Tags und Meta-Tags in allen Beiträgen und auf sämtlichen Seiten gesetzt, die Navigationsstruktur verbessert und allgemein die Daten besser für Roboter bzw. Maschinen aufbereitet (z.B. durch den Einsatz von strukturierten Datenformaten, wie JSON-LD).

Seit dem Blog Relaunch verzeichnet titantina.at einen klaren Anstieg an Klicks und Impressionen in der Google-Suche. (Quelle: Google Search Console)

Git for Everything! 

Die ganze Website von Tina steht außerdem unter git Versionsverwaltung, somit werden sämtliche Inhalte in einem git Repository gespeichert und versioniert. Dies ermöglicht nicht nur eine lückenlose Dokumentation der Änderungen sondern auch einen äußerst agilen Deployment-Workflow und vereinfacht so die laufende Weiterentwicklung.

Die komplette Website in einem git-Repo ermöglicht einen reibungslosen Entwicklungs- und Deployment-Prozess.
Direkt zur Website

Sieh dir die fertige Website an und überzeuge dich selbst!

Hey, die Website ist live! Ruf die Seite auf und mach dir Selbst ein Bild von meiner Arbeit.

titantina.at — Website ansehen ›

Es heißt dran bleiben!

Wenn du es soweit geschafft hast, dann stehen die Chancen gut, dass du dich auch für meine anderen Projekte interessierst. Außerdem findest du mehr Informationen dazu, wie ein Webprojekt zwischen uns ablaufen könnte.

Alexander Hofstätter, 29. April 2019

Diese Liste ist unvollständig! Bist du bereit, dein Projekt zu starten?

Denkst du an ein Projekt, über das wir plaudern können? Erzähl mir von deinem Projekt und vielleicht gibt es hier bald eine weitere coole Case Study. 

Projektanfrage stellen ›
Wenn du deine E-Mail-Adresse eingibst, bekomme ich automatisch eine E-Mail und werde dir dann antworten. Deine E-Mail-Adresse wird nicht anderwertig verwendet und dient ausschließlich zur Kontaktaufnahme.
Danke für deine Anfrage, du wirst schnellstmöglich von mir hören.
Leider ist etwas schiefgelaufen. Probier es später nochmal oder schreib mir direkt eine E-Mail, wenn dieses Problem noch länger bestehen sollte.