Diese Website verwendet Funktionen, die Ihr Browser nicht unterstützt. Bitte aktualisieren Sie Ihren Browser auf eine aktuelle Version.



14. Oktober, 2021

WIE DU MIT PAGEFLOW NEXT WEB STORIES FÜR SMARTPHONES OPTIMIERST



Während der Zugriff auf Web Specials und Longreads über Smartphones immer weiter zunimmt, ist es wichtiger denn je, der mobilen Version einer Story besondere Aufmerksamkeit zu schenken.

Um die speziellen Anforderungen an die Mobiltauglichkeit zu erfüllen, bietet Pageflow Next Lösungen an, die zukunftsweisendes Storytelling auch auf mobilen Geräten ermöglichen.

Deshalb freuen wir uns ganz besonders, in diesem Artikel zwei wesentliche Features für die mobile Optimierung vorstellen zu können.

Pageflow Next verfügt über völlig neue Funktionen, die mobilen Usern das bestmögliche Erlebnis einer Multimedia-Story in vertikaler Ausrichtung bieten.







MOBILE HINTERGRUND-BILDER







Auch Pageflow Next verfolgt den Anspruch, Hintergrund-Bilder immer Bildschirm-füllend anzuzeigen. Genau das hat in der klassischen Version bei einigen Motiven manchmal zu einem Problem geführt: Wesentliche Bestandteile eines Bildes passten auf Smartphones nicht immer in den vertikalen Viewport, z. B. bei Gruppenfotos oder anderen Bildern, bei denen wichtige Teile eines Bildes, eines Diagramms oder einer Karte durch das Cropping verloren gingen:



Funktioniert super im Querformat, aber..



Als Lösung für dieses Problem verfügt Pageflow Next deshalb über ein neues Werkzeug: Die optionale Verwendung eines separaten mobilen Hintergrund-Bildes als Alternative zum Querformat auf dem Desktop.



Wenn Du diesen Artikel auf einem Smartphone im Hochkant-Format liest, wirst Du drei Erwachsene und ein Kind erkennen. Stimmt soweit. Dabei verpasst Du aufgrund der geringen Breite Deines Bildschirms allerdings weitere Mitglieder dieser Gruppe.

Wenn Du nach unten scrollst wirst Du sehen, was in der vertikalen Version passiert, wenn ein mobiles Bild ausgewählt wird:



All in one ✅



Um eine Gruppe von Menschen angemessen zu repräsentieren, sollten auch alle Mitglieder sichtbar sein, oder?



Hier ein Beispiel für zwei weitere Personengruppen, die anhand der Auswahl mobiler Bilder nun auch in der Hochkant-Version optimal in Szene gesetzt werden können:



0:00/0:00



Für die Effizienz bei der Produktion von Medien ist es heutzutage unerlässlich, die Format-Anforderungen von Social-Media-Plattformen wie 16:9, 9:16, 1:1 usw. gleichermaßen zu berücksichtigen.

Pageflow Next bietet deshalb Werkzeuge an, mit denen all diese Formate in einer einzigen Geschichte zusammengeführt werden können.

Denn anhand des neuen Konzepts der Inhaltselemente wird die Wiederverwendung von Medien mit unterschiedlichen Bildschirmgrößen deutlich erleichtert, wie das quadratische Video oben ⬆️ beispielsweise zeigt.



MOBILE "inline" BILDER



Pageflow Next ändert die Art und Weise, wie Medien in eine Geschichte eingebunden werden grundlegend:

Die ursprüngliche seitenbasierte Struktur, die es nur erlaubte, einen einzigen Medientyp auf einem Hintergrund zu platzieren, wurde durch das flexiblere Konzept der "Abschnitte" ersetzt, die mit einer beliebigen Anzahl von verschiedenen Inhaltselementen gefüllt werden können.

Genau wie bei Hintergrundbildern kann auch hier bestimmt werden, ob ein Inhaltselement in der mobilen Version ein anderes Bild anzeigen soll.

Wenn Du z.B. eine Infogrfik darstellen möchtest, ist es sinnvoll, zwei Versionen zu erstellen, um die Lesbarkeit in beiden Ausrichtungen zu optimieren.

Die folgende Querformat-Visualisierung wird im Hochformat zu schmal:

Landscape Version

Diese Infografik im Querformat wird sowohl auf dem Desktop als auch auf dem Smartphone "Inline" angezeigt, es sei denn, Du legst ein separates mobiles Bild fest:





Portrait Version

Auf dem Smartphone ist das ziemlich schwer zu lesen, oder? Um das zu verbessern, wäre es nun eine Möglichkeit, auch für die Desktop-Version ein Hochformat-Bild zu verwenden. Auf diese Weise ist der Inhalt dann in beiden Ausrichtungen lesbar:

Aber: Das Ziel ist ja, Inhalte auf allen Plattformen gleichgut zugänglich zu machen und dem Publikum in beiden Ausrichtungen die bestmögliche Lesbarkeit zu bieten. Deshalb: Schmeichle lieber den Augen Deiner Leserschaft mit einer Version, die auf das jeweilige Gerät passend zugeschnitten ist:



Adaptive Version

Sobald ein mobiles Inline-Bild ausgewählt ist, wird je nach Seitenverhältnis des Bildschirms eine andere Version angezeigt.

Die folgende Grafik wird also je nach Bildschirmausrichtung entweder im Querformat oder im Hochformat (Tablet, Smartphone hochkant) angezeigt:





How-to-Pageflow-Next

Darüberhinaus enthält Pageflow Next mit der "Motivauswahl" und dem "Dynamischen Schatten" noch andere Möglichkeiten, mit denen ein Motiv in beiden Welten gleichermassen schön in Szene gesetzt werden kann.

Diese und weitere Features präsentieren wir bald mit weiteren "How-To-Pageflow-Next" Artikeln hier bei uns im Blog. Vielen Dank für Deine Aufmerksamkeit. Stay tuned!



Noch nie war es so einfach, verschiedene Arten von Medien in unterschiedlichen Formaten mit Pageflow zusammen zu führen.



MEHR erfahren: