Das Template ist tot – wie Inhalte im artundweise TYPO3 Framework in Bewegung kommen

Ein Ziel steht zu Beginn: Besucher werden Leser. Content Marketing setzt auf relevante Inhalte, um den Besucher zum unterhaltenen und interessierten Leser zu machen, um ihn bei seiner Wiederkehr auf die Website zu belohnen. Die Präsentation des Inhalts ist dabei zentral und zu Beginn eine technisch-konzeptionelle Frage.

Vom Datensatz zum Longread

Gängige Content Management Systeme wurden und werden auch heute noch in den meisten Fällen durch den Redakteur mittels einer Art Maske mit Inhalten befüllt: Ein Feld für die Überschrift, eines für den Text und ein Weiteres in dem das Bild eingebunden wird - und das alles der Reihe nach.

Für Blogartikel war diese Art der Strukturierung lange Zeit notwendig, denn das CMS musste „wissen“ wie es die eingegebenen Daten für den Nutzer anzuzeigen hatte. Die Beitragsdetailseiten waren alle gleich aufgebaut - in einem einheitlichen Template. Die Struktur ermöglichte auch die Ausspielung der Anreißer oder Teaser auf der Website. So sind Listenseiten möglich, die Beiträge kurz vorstellen und auf die Detailseiten verweisen.

Der Trend von Artikeln geht hin zu „Longreads“. Artikel können in dieser Form heute nicht nur mehrere tausend Wörter enthalten, sie verfügen oftmals über Zusatzinformationen, Bilder, Kommentare oder weitere Funktionen wie einem aufklappbaren Akkordeon und eingebetteten Videos. Textbaussteine, Bilder und Zitate brechen dabei oftmals aus der Textspalte aus und vermitteln so einen Eindruck von einem sorgfältig gesetzten Print-Magazinartikel.

Longreads.com sammelt aktuelle Beispiele.

In ihrem Artikel The Next Big Thing in Responsive Design bringen Dan Gardner und Mike Treff einen treffenden Vergleich:

When you look at the print version of any major print publication over time, you realize that they don’t just have a couple of templates. They have hundreds. They have the ability to respond to any combination of events with a design that gives each event the proper editorial weight.

Dem Inhalt einen Rahmen geben

Das Prinzip der Eingabe von Inhalten in eine Maske im CMS hatte lange wesentliche Vorteile. Nur so konnte gewährleistet werden, dass die Darstellung der Artikel auch im Design der Website ordentlich funktionierte. Umso mehr, als dieselben Inhalte dann auch noch auf verschiedenen Screengrößen vom Smartphone über das Tablet zum Desktop-Browser per Responsive Design angezeigt werden mussten.

Für statische Websites ohne CMS wurde schnell auf Frameworks zurückgegriffen. Wie zum Beispiel Twitter Bootstrap, ein Open Source Framework mit einer Codebasis, die eine Website im Responsive Design darstellt. Diese Entwicklung hielt dann auch langsam Einzug in die Content Management Systeme. Nur ist in vielen Fällen auch heute noch die „Maske“ vonnöten. Ein Framework wie Twitter Bootstrap aber gibt den Inhalten einen Rahmen, in dem die einzelnen Teile wie in einem „Setzkasten“ über die Seite frei verteilt werden können. 

Der Guardian veröffentlichte in einem Post die Gedanken, die sich das Team über den konzeptionellen Aufbau des noch in der Beta-Phase befindlichen Nachrichtenportals machte.

Interessant ist hierbei vor allem, dass es der Redaktion notwendig erschien, ein lang existierendes Prinzip der Webentwicklung zu erklären: Container. Zugehörige Inhalte wie Bilder und Texte werden in einem Rahmen gebündelt. Diese Rahmen können auf der Website in einer beliebigen Reihenfolge verteilt werden. Je nach Screengröße ordnen sich die Container anders auf der Website an. Auf dem Smartphone beispielsweise werden die Container untereinander angezeigt, auf dem Desktop nebeneinander. Dieses Verhalten können Sie einfach testen, indem Sie einmal diese Website hier am Browserrand kleiner ziehen. Sie sehen, wie sich die Inhalte neu anordnen. Etwa wie die Autoren-, Datums- und Kommentaranzeige nun über der Überschrift steht.

„statisch“ & „fließend“

Wir bei artundweise entwickeln Websites schon seit langem im Responsive Webdesign. Die Unterscheidung von „fließenden“ Inhalten - Blogposts, News usw. - und „statischen“ Seiten - Impressum, Kontakt, Über uns usw. - war anfangs auch Usus in unseren Entwicklungen. Doch mit den fortschreitenden Entwicklungen im Webdesign und Konzepten, die „fließende“ Inhalte in den Mittelpunkt rückten, näherten wir uns mit dem artundweise TYPO3 Framework einer globaleren Lösung an.

Die Detailseite hat heute der klassischen Startseite den Rang abgelaufen. Sie ist der Treffer in der Suchliste von Google und bietet die besten Chancen für die Sichtbarkeit eines Themas im Internet. Wieso also nicht das Prinzip umkehren und dem Redakteur für die Bearbeitung einer Detailseite umfangreichere Möglichkeiten an die Hand zu geben als lediglich eine Maske auszufüllen?

Folgende Kriterien spielten bei unseren Konzeptionsrunden eine Rolle, jeder Punkt musste in unserem Framework beachtet werden:

  • Die Detailseiten müssen bei Veröffentlichungen Teaser generieren können, die automatisch über die Website verteilt werden. Sie müssen in Kategorien einsortiert und einen Autoren zugewiesen bekommen können.
  • Eine Artikeldetailseite muss vom Redakteur nicht nur durch Text, Bilder und Videos ergänzt werden können. Es sollen außerdem sämtliche dem CMS zur Verfügung stehende Plugins wie beispielsweise Slider, Bildergalerie, Formularfelder, Kommentare oder Akkordeons leicht eingebunden werden können.
  • Die Reihenfolge, in der die verschiedenen Inhalte einer Seite dargestellt werden, muss durch den Redakteur festzulegen und zu ändern sein.
  • Sämtliche Informationen der Seite - auch die im CMS gepflegten, aber für den Website-Besucher nicht sichtbaren - müssen durchsuchbar sein. D.h. von der Website-Suche gefunden werden.

Ein simpler konzeptioneller Gedanke brach alle Bedingungen auf einen Satz herunter: JEDE Seite ist ein Artikel.

Für die Erstellung von Longreads steht beim artundweise TYPO3 Framework ein flexibles Grid bereit.

Alle Inhalte „fließen”

Mit TYPO3 und Twitter Bootstrap war es schon vorher möglich, Seiten wie in einem Print-Magazin zu „setzen“ - und dies im eigentlichen Sinne per Drag & Drop. Nur waren diese Seiten statisch, generierten keine Teaser oder Listenseiten automatisch. Mit dem artundweise TYPO3 Framework entwickelten wir die Möglichkeit, an jeder Seite Informationen zu hinterlegen, die für die Generierung von Teasern sorgten, die Anzeige und Sortierung von Kategorien und Autoren ermöglichten und in manchem Projekt die Suche des Nutzers mit zusätzlichen Informationen anreichern konnten. JEDE Seite in einer mit dem artundweise TYPO3 Framework erstellten Website ist somit ein Artikel, dessen Informationen global auf der Website genutzt werden können.

tl;dr

Die technische Konzeption für unser Framework wurde notwendig aufgrund der neuen Betrachtungsweise von Websites: Detailseiten werden immer wichtiger, fließende Inhalte bestimmen das Bild eines Unternehmens, das durch Content Marketing eine höhere Sichtbarkeit generiert, relevante Inhalte müssen ansprechend dargestellt und angereichert werden können.