Futter für die neue Website

Tipps zur Vorbereitung von redaktionellen Inhalten

Im Rahmen eines Relaunch Projektes wird Ihre Website komplett neu aufgesetzt. Das heißt, Sie werden mit Ihrer neuen Website die aktuellste TYPO3-Version und somit zukünftig auch die neuesten Module nutzen können. 

Das ist die Gelegenheit, um Ihre Texte und Bilder der aktuellen Seite zu überarbeiten und thematisch zu überdenken. Doch wie können Sie vor der redaktionellen Pflege der neuen Seite Ihre Inhalte am Besten vorbereiten, sodass Sie während der Befüllung des neuen CMS den Überblick behalten und die Rahmenbedingen für die Einpflege bereits feststehen?

Dieser Artikel beinhaltet ein paar Tipps, wie Sie Texte, Bilder und Videos optimal für die neue Website vorbereiten können.

Vorbereitung der Bilder, die später auf der neuen Website zum Einsatz kommen sollen

Alle Medien die Sie auf Ihrer Website nutzen möchten, müssen vorab in der sogenannten Mediendatenbank des CMS hochgeladen werden. Dies beinhaltet nicht nur Bilder, sondern auch Videos, Audio (mp3) oder PDFs. Damit Sie später Bilder und andere Dateien leichter wiederfinden können, sollten Sie sich eine sinnvoll strukturierte und übersichtliche Ordnerstruktur überlegen, in der Sie ihre Dateien ablegen möchten. Benennen und sortieren Sie dafür die Ordner am Besten nach Themen und orientieren Sie sich dabei an Ihrer Menüstruktur.

Legen Sie sich auf Ihrem PC oder einer zentralen Datenbank bereits eine solche Ordnerstruktur an und sammeln Sie dort alle Bilder, die Sie zum Projektbeginn benutzen möchten. Optional können wir auch eine externe Bilddatenbank (z.B. pixx.io) über das TYPO3 anbinden, sodass Sie hierüber auf Ihre Bilder zugreifen können. 

Zu den Bildern selbst gibt es folgende Tipps und Hinweise zu beachten:

Bildgröße

Genaue Angaben zur passenden Bildgröße lassen sich schwer machen. Jedoch gibt es einige Punkte, die Sie beachten sollten:

  • Headerbilder und Hintergrundbilder sollten min. 1920px breit sein
  • die Bilder sollten mit hoher Qualität also mit wenig Kompression abgespeichert werden
  • es empfiehlt sich der Einsatz eines Bild-Optimierungstools wie https://tinyjpg.com/, welches die Bildgrößen ohne Qualitätsverlust deutlich reduziert
  • Wenn Kopfbilder mit tinyjpg.com optimiert wurden, sind Dateigrößen von bis zu 4 MB kein Problem
  • PNG als Dateiformat ist bei großen Bildern sehr ineffizient, hier sollten am besten immer JPGs verwendet werden (PNG am besten nur, wenn Transparenz benötigt wird).

(Bildquelle: http://www.freepik.com“>Designed by Freepik)

Nur wenn Bilder groß genug sind und in hoher Qualität vorliegen, können sie auch überall eingesetzt werden. Hier brauchen Sie keine Bedenken bzgl. der Ladezeiten haben, da die Bilder je nachdem wo sie eingesetzt werden auf die richtige Größe zugeschnitten und nochmal komprimiert werden. Am Besten sollten Sie auch querformatige Bilder nutzen, da diese in den meisten Bühnen der neuen Website so optimal ausgespielt werden können. Gerade bei Hintergrundbildern ist dies wichtig, in kleineren Kacheln können die Bilder jedoch auch mal quadratisch sein, da einige Bühnen insbesondere in der mobilen Ansicht eher im Porträt-Format dargestellt werden.

Weitere Punkte, die Sie bereits bei den Bildern vorbereiten und ggf. überarbeiten können, sind der Dateiname, der Bildtitel, die Bildbeschreibung, das Copyright und der alternative Text.

Dateiname

Der Dateiname der Bilder sollte vor dem Hochladen ins CMS aussagekräftig gewählt werden. Mehrere Worte trennen Sie durch einen Bindestrich (z.B. hundestrand-sylt.jpg). Bei der Wahl der Begriffe für den Dateinamen können Sie sich an Thema, Zeit und Ort orientieren. Das heißt, was stellt mein Bild dar, zur welcher Jahreszeit wurde es aufgenommen und welchen Ort sieht man auf diesem Bild. Ein aussagekräftiger Dateiname hat noch einen Vorteil: Über das Such-Eingabefeld im CMS können Sie durch einen aussagekräftigen Namen die Datei dementsprechend gut wiederfinden und nutzen.

Bildtitel

Der Bildtitel kann später im CMS je Bild gepflegt werde. Der Bildtitel gilt als zusätzliche Information und wird angezeigt, wenn der Nutzer mit der Maus über das Bild fährt.

Beschreibung

Optional können Sie bei einem Bild auch einen Beschreibungstext hinterlegen. Dieser wird in den Text- und Bild-Bühnen dann unterhalb des Bildes ausgegeben. Im Bilderslider erscheint er zudem in der Lightbox unterhalb des Bildes. 

Copyright

Im CMS haben Sie die Möglichkeit in einem extra Feld ein Copyright zu hinterlegen. Ausgespielt wird dieses bspw. im Bilderslider auf den Bildern sowie in der Lightbox. Wenn Sie nicht selbst Urheber des Bildes sind, klären Sie mit dem Urheber ab, welche Anforderungen hinsichtlich der Copyright Angabe bestehen.

Alternativer Text (Alt-Text)

Der alternative Text wird dem Nutzer nur angezeigt, wenn das Bild nicht geladen werden kann. Weiterhin dient er aber auch dazu, einem sehbehinderten Nutzer das Bild zu beschreiben. Deshalb ist es natürlich relevant, hier eine aussagekräftige Beschreibung zu wählen. Auch für Google sind diese Bildinformationen interessant.

Tipp zur Auswahl eines Bildes

Das Bild sollte natürlich zum zugeordneten Text passen und die Aussage und den Inhalt der Seite unterstützen. Überlegen Sie daher welche Wirkung die eingesetzten Bilder auf Ihren Websitebesucher haben und ob die Bilder das Ziel Ihrer jeweiligen Seite wirklich unterstützen. Nutzen Sie im CMS die Möglichkeit zusätzliche Bildunterschriften zu setzen, um den Inhalt des Bildes zu beschreiben und weitere Informationen bereitzustellen.

Vorbereitung der Videos, die später auf der neuen Website zum Einsatz kommen sollen 

Sie möchten in einer Bühne ein Hintergrundvideo einsetzen? Dies ist natürlich möglich. Hierzu wäre zunächst einmal zu beachten, dass das Video nicht zu unruhig ist. Ein gutes Beispiel sieht man auf norderney.de, das Video auf der Startseite zeigt eine leichte Wellenbewegung. Videos sollten als MPEG-4 (H.264) vorliegen und sollten die Endung .mp4 haben. Bei der Auflösung des Videos muss man individuell schauen, da dies sehr vom Inhalt des Videos abhängt. Meist empfehlen wir jedoch eine maximale Breite von 1280 Pixeln

Achten Sie auch darauf, dass Hintergrundvideos keinen Sound haben, sonst spielen Browser die Videos nicht automatisch ab. Das Video sollte auch nicht zu lang sein, damit die Gesamtgröße der Videodatei nicht zu groß wird. Als Richtwert können Sie hier eine Größe von 10 MB nehmen, größere Videos sind jedoch auch möglich.

Das Laden des Videos kann unter Umständen bei schlechter mobiler Verbindung sehr lange dauern. Daher müssen Sie zu einem Video auch ein Hintergrundbild im CMS ablegen, welches zuerst erscheint, so dass der User bereits etwas sieht, solange das Video geladen wird.Alternativ können Sie die Videodatei auch bei Youtube hochladen und dann ein Youtube-Video in einem Teaser oder Medienelement abspielen lassen. Ein Vorteil ist es, dass Youtube ein Video beim Hochladen in verschiedene Auflösungen konvertiert und dann entsprechend des Endgerätes und der Internet-Verbindung ein Video in entsprechender Qualität ausgibt. Als Hintergrundvideos eigenen sich Youtube-Videos allerdings nicht so gut.

Bei größeren Videos sollten Sie darauf verzichten, dieses als Hintergrundvideo zu hinterlegen. Sie können das Video dann stattdessen besser als Teaser einbinden.

Vorbereitung der Texte, die später auf der neuen Website zum Einsatz kommen sollen

Sammeln Sie Texte am Besten in einem Editor oder in Word, dann können Sie diese später problemlos per copy & paste ins CMS einpflegen. Beim Einfügen eines Textes ins Backend bei TYPO3 muss die Formatierung wieder herausgenommen werden, bzw. wird der Text erst im TYPO3 richtig formatiert. Denn TYPO3 entfernt nicht zwangsläufig alle Formatierungen – insbesondere, wenn man einfach aus Word kopiert, kann es sein, dass unerwünschte Formatierungen oder Steuerzeichen übernommen werden. Es gibt dafür einen extra Button, um Texte in „Reinform“ einzufügen. Damit Sie später das CMS leichter befüllen können, überlegen Sie sich bereits vorab, wie der Aufbau jeder einzelnen Seite sein soll bzw. welche Bühnen Sie auf den jeweiligen Seiten einsetzen möchten. Nutzen Sie dazu gerne unseren Klickdummy und drucken Sie sich die Seiten analog aus, um mit den einzelnen Bühnen das jeweilige Content-Konzept je Seite zu finden. 

Sofern Ihre Webseite eine mehrsprachige Version erhalten soll, sollten Sie vorab bereits die Übersetzungen der deutschen Texte in Auftrag geben und diese, so wie die deutschen Texte, thematisch sortiert bei sich ablegen.

Ziel der jeweiligen Seite

Jede Ihrer Seiten sollte ein bestimmtes Ziel haben, welches Sie sich vorab überlegen. Soll der Text inspirieren oder informieren? Hat die Seite ein vertriebliches Ziel?  Je nach Ziel bringen Sie andere Bühnen und Texte zum Einsatz. Daher der Tipp: Wenn Sie eine Seite vorbereiten schreiben Sie sich zunächst das Ziel der Seite auf, damit Sie dieses stets im Blick haben.

Überlegen Sie sich beim Texten stets, wonach der User im Netz sucht und was ihn interessieren würde. Vermeiden Sie unnötige Floskeln und Füllsätze.

Es hat sich gezeigt, dass User vor allem nach Urlaubsthemen suchen, weniger nach bestimmten Destinationen. Schaffen Sie auf Ihrer Website daher Einstiege über inspirative Themenseiten, die zu Ihrer Destination passen und leiten Sie den User darüber dann auf Ihre Vertriebsseiten. Viele User geben zudem verstärkt ganze Fragen bei den Suchmaschinen ein. Warum nicht auch das inhaltlich aufgreifen? Fragen Sie in Ihrer Tourist-Info nach, was dort häufig gefragt wird. Daraus lassen sich interessante Inhalte für die Website schaffen.

Abschließender Tipp: Schauen Sie auch mal bei https://www.travelbook.de/ vorbei und lassen Sie sich von den kreativen Headlines, die beim User Neugierde wecken, inspirieren.

Mehr Interessantes zum Thema Content Marketing gibts auch hier: https://www.neusta-ds.de/blog/content-marketing/9-tipps-fuer-effektives-content-marketing-im-tourismus/