Gut gemachtes Webdesign: Ausgezeichnetes Editorial

Veröffentlicht: 2022-03-10
Kurze Zusammenfassung ↬ Man sagt, Content ist King, und sie haben recht. Das Web hat Geschichtenerzählern ungeahnte Möglichkeiten eröffnet – natürlich vorausgesetzt, die Geschichte stimmt. Hier sind einige unserer Lieblingsbeispiele für redaktionelle Inhalte, die im digitalen Bereich gedeihen.

Viele Diskussionen über Webdesign beschäftigen sich damit, was rund um den Inhalt passiert. Seitengeschwindigkeit, Designsysteme, Suchmaschinenoptimierung, Frameworks, Zugänglichkeit – die Liste geht weiter und weiter. Dies gibt uns beim Smashing Magazine viel zu schreiben, was großartig ist, obwohl es sich lohnt, uns daran zu erinnern, wofür es alles dient.

In dieser dritten Ausgabe unserer Web Design Done Well -Serie konzentrieren wir uns auf das schlagende Herz vieler Websites: den Inhalt. Genauer gesagt, redaktionelle Inhalte. Das Web hat Geschichtenerzählern eine unglaubliche Auswahl an Werkzeugen zur Verfügung gestellt, mit denen sie arbeiten können, und als gelegentlicher halbkompetenter Journalist liebe ich einen guten Knüller.

Was folgt, sind Beispiele für Webtechnologien, die mit redaktionellen Inhalten verwoben werden, um sie auf die nächste Stufe zu heben. Wir schließen dann mit allgemeineren Tipps zum kreativen Nachdenken über digitale Inhalte. Selbst jetzt, überwältigt von der Content-Produktionslinie, scheint das gute Zeug immer noch durch.

Teil von: Webdesign gut gemacht

  • Teil 1: Das Gewöhnliche wird außergewöhnlich
  • Teil 2: Nutzung von Audio
  • Teil 3: Ausgezeichnetes Editorial
  • Abonnieren Sie auch unseren Newsletter, um die nächsten nicht zu verpassen.

Reuters neigt zum Wischen

In diesem Artikel über systemischen Rassismus in den USA formt Reuters den Inhalt um das Wischen herum und zerlegt die Geschichte in mundgerechte Stücke. Das Lesen fühlt sich viel zielgerichteter an, als es bei einem traditionellen Scroll-Ansatz der Fall gewesen wäre. Es ist, als würde man die Seiten eines Buches umblättern. Auf dem Handy blättern Sie buchstäblich zum nächsten Abschnitt. Es sorgt für eine schnelle, sofortige Berichterstattung – ganz zu schweigen von der hervorragenden Datenvisualisierung, die gezeigt wird.

Reuters-Artikel über systemischen Rassismus schwarz auf weiß
(Große Vorschau)

Wir leben in einer Mobile-First-Welt. Es hat keinen Sinn, deswegen wertvoll zu sein. Ja, Magazin-Doppelseiten haben eine gewisse Klasse. Ja, eine Desktop-Ansicht bietet Ihnen eine größere Arbeitsfläche. Die Realität ist, dass die meisten Leute sehen, was Sie auf einem Mobiltelefon veröffentlichen, also lehnen Sie sich an. Für einen ähnlichen Ansatz eignen sich auch diese „Tap Stories“ von The New York Times und Input hervorragend. Für diejenigen, die an weiterführender Lektüre zu mobilen Leitartikeln interessiert sind, wird The Story des legendären Zeitungsdesigners Mario Garcia wärmstens empfohlen.

Mehr nach dem Sprung! Lesen Sie unten weiter ↓

Die New York Times zeigt eher als erzählt

Trotz all der schrecklichen Dinge, die die COVID-19-Pandemie verursacht hat, hat sie zumindest zu einer atemberaubend guten Berichterstattung geführt. Dieser interaktive Artikel der New York Times erklärt, wie Gesichtsmasken funktionieren, indem er die Leser auf Partikelebene bringt. Sie können sehen, wie Fasern Partikel auffangen und warum verschiedene Masken unterschiedlich wirksam sind. Jeder Dummkopf kann komplizierte Themen schwer verständlich machen, aber sie leicht verständlich machen? Das ist eine ganz eigene Kunstform.

New-York-Times-Artikel über Masken
(Große Vorschau)

Hier spielen viele Elemente eine Rolle. Grafiken, Farben, Animationen – es gibt sogar ein Augmented-Reality-Erlebnis, wenn Ihnen das zusagt. Was so leicht ein trockenes, stickiges Thema hätte sein können, wird zum Leben erweckt. Und vor allem sind es lebenswichtige Informationen. Aus diesem Grund wurde Gabriel Gianordoli bei den Society for News Design Awards 2020 zum besten Designer der Welt gewählt. Zerschlagen.

Die Washington Post visualisiert die exponentielle Ausbreitung

Die Pandemie hat auch die Datenvisualisierung auf die Titelseiten von Publikationen auf der ganzen Welt gezwungen. Dieser Artikel über die exponentielle Ausbreitung vom März 2020 (erinnern Sie sich daran?) macht einen unglaublichen Job, um zu visualisieren, wie und warum bestimmte Viren sehr schnell zu wirklich großen Problemen werden. Von ausgewachsenen Simulationen bis hin zu kleinen Inline-Sparkline-Grafiken ist dies ein Editorial, das seine digitale Umgebung voll ausnutzt.

Artikel der Washington Post über Covid
(Große Vorschau)

Was mir an diesem besonders gefällt, ist, dass es sich nie unnötig anfühlt. Jedes Bild verbessert die Geschichte bis zu dem Punkt, an dem es einem fast leid tut, wenn jemand dieselben Konzepte nur mit Worten erklären muss. Dass es auf Knopfdruck in mehr als einem Dutzend Sprachen verfügbar ist, ist eine weitere wunderbare Sache – eine Erinnerung daran, dass das Web tatsächlich grenzenlos ist. Ich kann mir nur vorstellen, wie vielen Menschen auf der ganzen Welt dieser Artikel geholfen hat.

Das Marshall-Projekt mischt Medien

Hier präsentiert The Marshall Project knallharten Journalismus über das US-amerikanische Strafjustizsystem mit der Eleganz und bittersüßen Schönheit eines Kinderbuches. In „The Zo“ vereinen sich kreatives Schreiben, beeindruckende Illustrationen, faszinierende Erzählung und eine wichtige Geschichte. Das ist Multimedia-Redaktion in vollem Gange.

Marshall-Projekt
(Große Vorschau)

Sie sagen, dass Lieder verschiedene Formen annehmen können. Dasselbe gilt für redaktionelle Inhalte im Internet. Was Sie oben sehen, wurde von einer 96-seitigen wissenschaftlichen Arbeit inspiriert. Dass sie als Zeichentrickserie online ein neues Publikum finden und dann nicht nur für einen, sondern gleich zwei Emmys nominiert werden konnte, zeugt von der transformativen Kraft des Internets.

Der interaktive Graphic Novel von SBS ist keine Neuheit

Apropos transformative Kräfte des Internets, wie wäre es mit einer interaktiven Geschichte. Wir alle kennen Verfilmungen, Hörspieladaptionen, Miniserienadaptionen und so weiter. Warum keine Webseitenanpassungen? Genau das wollte der australische Sender SBS mit The Boat erreichen , einer interaktiven Nacherzählung einer Kurzgeschichte aus dem gleichnamigen Buch von Nam Le.

Die Geschichte von SBS das Boot
(Große Vorschau)

Die Eröffnungssequenz der Seite zieht Sie direkt in ihren Bann, ihre Worte kippen und taumeln mit den Wellen, während Sie lesen, mit den Geräuschen von Donner und Regen, die Ihre Sinne bis zum Rand füllen. Während sich die Geschichte beruhigt, ziehen Matt Huynhs Illustrationen wie Erinnerungen vorbei. Es ist eine bemerkenswert lebendige Erfahrung, die an sich schon schön ist und eine clevere Art, jüngeren Generationen Literatur nahe zu bringen.

Die Pudding-Affen herum

Ich wünschte, ich wäre rechtzeitig zur Tonausgabe dieser inspirierenden Sites-Reihe darauf gestoßen. Egal, jetzt ist es da. In einem wirklich großartigen Schaufenster des digitalen Leitartikels erklärt The Pudding nicht so sehr das Infinite Monkey Theorem, sondern lebt es durch Musik. Sie wissen nicht, was das Monkey Theorem ist? Nun, worauf warten Sie noch, die Seite wird unendlich viel besser erklären, als ich es könnte. Ich werde warten.

Pudding-Affe-Theorem
(Große Vorschau)

Durch die Verwendung interaktiver Vier-Noten-Beispiele bezieht der Artikel den Leser mit ein und macht das Konzept gleichzeitig einfach verständlich. Als letzte, entzückende Note ist die Seite selbst ein lebendiges, fortlaufendes Experiment, das sich willkürlich durch immer komplexere Melodien arbeitet. Sie können damit rechnen, dass „Seven Nation Army“ in etwa 19 Jahren richtig wird. Man fragt sich, ob ein Affe, der lange genug auf einer Tastatur tippt, das perfekte JavaScript-Framework erstellen könnte. Hoffnung entspringt ewig.

Eine Liste für sich: Eine Klasse für sich

Bei all dem Gerede über Datenvisualisierung, Musik, Augmented Reality und andere schicke Tools spricht viel dafür, das Grundrecht zu bekommen. Seiten müssen nicht das Webäquivalent des Vegas Strip sein, um auffällig zu sein. Eine Liste Apart zeigt das besser als die meisten anderen. Seine inhaltliche Herangehensweise wird immer einen Platz in meinem Herzen einnehmen. Titel, Abbildung, Text, blaue Hyperlinks. Wunderschönen.

Eine Liste auseinander
(Große Vorschau)

Was ich jetzt erkenne, ist beunruhigend lange her, dass ich über die zwei Zweige des „brutalistischen“ Webdesigns geschrieben habe. Der Kern meiner Aussage war, dass der eine Ansatz laut und frech ist, der andere entschieden funktional. A List Apart zeigt die Schönheit des letzteren richtig gemacht. Das Multimedia-Toolkit ist eine wunderbare Bereicherung, aber selbst jetzt gibt es Zeiten, in denen nur Worte ausreichen.

Kreativ über Inhalte nachdenken

Im Guten wie im Schlechten ist das Web absolut überflutet mit Inhalten. Vieles ist toll, vieles nicht. Ein Großteil des Geredes um ihn herum hat den kalten, berechnenden Rhythmus, den Sie eher von Industriellen erwarten würden, die über Fließbänder sprechen. Die oben genannten Beispiele sprechen hoffentlich dafür, wie wichtig es ist, dem Drang zu widerstehen, Dinge am laufenden Band zu veröffentlichen, aber seien wir ehrlich: Die meisten Websites verfügen nicht über die Ressourcen von, sagen wir, der Washington Post .

Es gibt jedoch Möglichkeiten, auf allen Ebenen kreativ über Inhalte nachzudenken, von persönlichen Blogs bis hin zu globalen Veröffentlichungen. Hier sind einige davon:

  • Hinterfragen Sie Ihre Standardvorgehensweise.
    Wir sind Gewohnheitstiere, auch darin, wie wir unsere Geschichten erzählen. Nehmen Sie sich frühzeitig die Zeit, einen Schritt zurückzutreten und zu fragen: Wie könnte ich das anders machen? Vielleicht wäre ein Fotoessay vernünftiger als ein Artikel. Vielleicht ist eine Heatmap besser als eine Tabelle. Spezialisierung ist natürlich wichtig, aber lassen Sie sich nicht von anderen, oft komplementären Vorgehensweisen blenden.
  • Verwenden Sie kostenlose Ressourcen.
    Eines der großen Geschenke des Internets ist, wie viele tolle kostenlose Sachen es gibt. Eigentlich kostenlos, absichtlich. Von Fotografie über Grafikdesign bis hin zu Datenvisualisierungstools und Audiobearbeitungssoftware sind die Ressourcen, die Sie zum Transformieren Ihrer Inhalte benötigen, nur einen Klick entfernt. Unser Freebies-Tag ist ein guter Anfang.
  • Geben Sie Inhalten mehrere Formen.
    Wie The Marshall Project mit „The Zo“ besonders gut gezeigt hat, können Geschichten ein neues Publikum finden, wenn sie unterschiedliche Formen annehmen. Artikel geschrieben? Toll, warum nicht eine Audioversion aufnehmen? Einen datengesteuerten Bericht erstellt? Ziemlich cool, aber ist es so cool, wie es wäre, wenn Sie anfangen würden, diese Zahlen in D3 zu stecken? Es gibt nur einen Weg, das herauszufinden.
  • Experiment.
    Die Beispiele hier sind die Crème de la Crème, aber es ist erwähnenswert, dass es enorm viel zu gewinnen gibt, wenn man neue Ideen ausprobiert und den gelegentlichen Misserfolg akzeptiert, der damit einhergeht. Iteration ist der Schlüssel zum kreativen Prozess. Wenn Sie etwas versuchen und es nicht funktioniert, gut, egal. Nur so kommt man an das, was funktioniert .

Es gibt keinen einheitlichen Ansatz für den Inhalt, aber die Geschichte zu respektieren ist unerlässlich. Webtechnologien sind ergänzend, nicht das Hauptereignis. Lass sie nicht der Schwanz sein, der mit dem Hund wedelt. Die besten Ergebnisse werden erzielt, wenn die Geschichte mit der Art und Weise, wie sie erzählt wird, harmoniert. Das ist die Art von Inhalten, die den Leuten jahrelang im Gedächtnis bleiben.