Um Ihre Leser bei der Stange zu halten, befolgen Sie unsere Best Practices für die Erstellung von
Web Stories. Wir empfehlen, sich zuerst auf die kritischen Aufgaben zu konzentrieren. Wenn Sie mehr Zeit haben, sollten Sie auch die empfohlenen Best Practices umsetzen.
Storytelling
| Kritische Best Practices für Storytelling | |
|---|---|
| Video zuerst | Videos sind ansprechender als Text oder Bilder. Verwenden Sie so viel Video wie möglich und ergänzen Sie es mit Bildern und Text. |
Weitere Best Practices für Storytelling
| Empfohlene Best Practices für Storytelling | |
|---|---|
| Bringen Sie Ihre Perspektive ein | Gehen Sie über Fakten hinaus. Teilen Sie Ihre Meinung. Seien Sie der Protagonist Ihrer eigenen Geschichte. Sorgen Sie für Identifikationspotenzial. |
| Etablieren Sie einen Spannungsbogen | Erzeugen Sie von Seite zu Seite Spannung in Ihrer Geschichte. Nehmen Sie den Nutzer mit auf die Reise, indem Sie Kontext und Erzählstruktur bieten. Belohnen Sie den Nutzer dafür, dass er bis zum Ende dabei bleibt. |
Design
| Kritische Best Practices für Design | |
|---|---|
| Reduzieren Sie die Zeichenanzahl | Vermeiden Sie mehrere Seiten mit Textwüsten. Erwägen Sie, den Text auf etwa 280 Zeichen pro Seite zu begrenzen (die Länge eines Tweets). |
| Text nicht verdecken | Stellen Sie sicher, dass der Text nicht durch andere Inhalte auf der Seite verdeckt wird. Vermeiden Sie eingebrannten Text; so verhindern Sie, dass Text bei der Anpassung an verschiedene Bildschirmgrößen abgeschnitten wird. |
| Text innerhalb der Grenzen halten | Stellen Sie sicher, dass der gesamte Text in Ihrer Web Story für den Leser sichtbar ist. Vermeiden Sie eingebrannten Text; so verhindern Sie, dass Text bei der Anpassung an verschiedene Bildschirmgrößen über den Rand hinausläuft. |
| Animationen bewusst einsetzen | Erwecken Sie Ihre Geschichten mit Animationen zum Leben. Vermeiden Sie ablenkende oder repetitive Animationen, die ermüdend wirken können. |
Weitere Best Practices für Design
| Empfohlene Best Practices für Design | |
|---|---|
| Verwenden Sie Web Stories-spezifische Call-to-Actions | Wenn Sie Geschichten neu erstellen, die ursprünglich für soziale Plattformen wie Instagram, Snapchat oder YouTube konzipiert wurden, entfernen Sie unbedingt alle plattformspezifischen Handlungsaufforderungen. Stellen Sie sicher, dass Nutzer alle in Ihrer Web Story vorgeschlagenen Aktionen auch ausführen können. |
| Verwenden Sie randlose Videos und Bilder | Integrieren Sie randlose Assets in Ihre Geschichten, um ein immersiveres Erlebnis für die Leser zu schaffen. |
| Vermeiden Sie Bilder und Videos mit niedriger Auflösung oder Verzerrungen | Verwenden Sie hochwertige Bilder und achten Sie beim Zuschneiden auf das Hochformat auf die Qualität. |
| Fügen Sie ein Logo auf der Titelseite hinzu | Integrieren Sie ein hochauflösendes Logo, das Ihre Marke repräsentiert. |
| Verkürzen Sie die Videolänge | Wir empfehlen Videos mit einer Länge von weniger als 15 Sekunden pro Seite, maximal jedoch 60 Sekunden. |
| Integrieren Sie Audio | Verwenden Sie hochwertige Audioclips mit einer Länge von mindestens 5 Sekunden bei ausgewogener Lautstärke und stellen Sie sicher, dass Sprache gut verständlich ist. |
| Erwägen Sie automatisches Weiterblättern für reine Video-Stories | Ein automatisch weiterlaufendes Erlebnis für videobasierte Web Stories kann für einen entspannten Konsum gut funktionieren. |
SEO
| Kritische SEO Best Practices | |
|---|---|
| Bieten Sie hochwertige Inhalte | Wie bei jeder Webseite ist die Bereitstellung hochwertiger Inhalte, die für Ihre Leser nützlich und interessant sind, das Wichtigste, was Sie tun können. Integrieren Sie eine vollständige Erzählung und befolgen Sie die Best Practices für Storytelling, um Ihre Leser zu binden. |
| Halten Sie den Titel kurz | Halten Sie Titel unter 90 Zeichen. Wir empfehlen einen beschreibenden Titel mit weniger als 70 Zeichen. |
| Stellen Sie sicher, dass Google Ihre Story finden kann | Verwenden Sie kein noindex-Attribut in Ihrer Story; dieses Attribut blockiert Google bei der Indexierung der Seite und verhindert, dass sie bei Google erscheint. Fügen Sie Ihre Web Stories zusätzlich zu Ihrer Sitemap hinzu. Sie können mit dem Bericht zur Indexabdeckung und dem Sitemaps-Bericht in der Search Console prüfen, ob Google Ihre Web Stories finden kann. |
| Machen Sie die Story selbst-kanonisch | Alle Web Stories müssen kanonisch sein. Stellen Sie sicher, dass jede Web Story ein link rel="canonical" auf sich selbst enthält. Zum Beispiel: <link rel="canonical" href="https://www.example.com/url/to/webstory.html"> |
| Metadaten anhängen | Stellen Sie sicher, dass Ihre Web Stories den
|
Weitere SEO Best Practices
| Empfohlene SEO Best Practices | |
|---|---|
| Strukturierte Daten einbinden | Wir empfehlen, strukturierte Daten in Ihre Web Story einzubinden, damit die Google-Suche die Struktur und den Inhalt Ihrer Web Story besser verstehen kann. |
| Alt-Texte für Bilder verwenden | Wir empfehlen, Alt-Texte für Ihre Bilder zu verwenden, um die Auffindbarkeit Ihrer Story zu verbessern. |
| Stories in Ihre Website integrieren | Wir empfehlen, Web Stories in Ihre Website zu integrieren, beispielsweise durch Verlinkung von Ihrer Startseite oder entsprechenden Kategorieseiten aus. Wenn Ihre Web Story beispielsweise ein Reiseziel behandelt und Sie eine Seite mit all Ihren Reiseartikeln haben, verlinken Sie die Web Stories auch auf dieser Kategorieseite. Eine zusätzliche spezielle Landingpage wie |
| AMP Story-Seitenanhänge verwenden | AMP Story-Seitenanhänge können verwendet werden, um zusätzliche Informationen neben Ihrer Web Story zu präsentieren. Dies ist nützlich, um zusätzliche Details, tiefergehende Einblicke oder weiterführende Inhalte zu den in Ihrer Web Story präsentierten Themen zu bieten. |
| Untertitel für Videos hinzufügen | Fügen Sie Untertitel zu Ihrem Video hinzu, damit Leser Ihre Geschichte besser verstehen können. Vermeiden Sie Untertitel, die in das Video eingebrannt sind, um sicherzustellen, dass sie nicht mit anderen Inhalten überlappen oder vom Bildschirm abgeschnitten werden. |
| Reine Video-Stories optimieren | Wir empfehlen, semantisches HTML für den Aufbau Ihrer Web Story zu verwenden. Einige Web Story-Editoren exportieren jedoch möglicherweise eine Story, bei der jede Folie als Videodatei formatiert ist, in die der gesamte Text eingebrannt ist. In diesem Fall empfehlen wir, den präzisen Text, der im Video angezeigt wird, als |
| Unterstützung für Querformat-Displays hinzufügen | Um zu ermöglichen, dass Web Stories in den Google-Suchergebnissen auf dem Desktop erscheinen, fügen Sie Unterstützung für Querformat-Displays hinzu. |
Technik
| Kritische technische Best Practices | |
|---|---|
| Story valide machen | Web Stories müssen valide AMP-Seiten sein. Um Probleme mit ungültigem AMP zu vermeiden, testen Sie Ihre Story mit dem AMP Validator-Tool und beheben Sie alle erkannten Fehler. |
| Keinen Text im Poster-Bild einfügen | Vermeiden Sie Bilder mit eingebranntem Text, da dies den Titel Ihrer Story verdecken könnte, wenn Nutzer eine Vorschau Ihrer Story in den Suchergebnissen sehen. Wenn Nutzer den Titel nicht klar lesen können, ist die Wahrscheinlichkeit geringer, dass sie weiterlesen. |
| Richtige Größe und Seitenverhältnis für das Poster-Bild wählen | Stellen Sie sicher, dass das Bild, das mit Ihrem <amp-story> poster-portrait-src-Attribut verknüpft ist, mindestens 640x853px groß ist und ein Seitenverhältnis von 3:4 aufweist. |
| Richtige Seitenverhältnis für das Logo wählen | Stellen Sie sicher, dass das Logobild, das mit Ihrem <amp-story> publisher-logo-src-Attribut verknüpft ist, mindestens 96×96 px groß ist und ein Seitenverhältnis von 1:1 aufweist. |
Weitere technische Best Practices
| Empfohlene technische Best Practices | |
|---|---|
og:image einbinden | Wir empfehlen, og:image in Ihre <meta>-Tags einzubinden, um die Auffindbarkeit Ihrer Story zu verbessern. |
Weitere Ressourcen
- Web Stories:
Ressourcen zur Erstellung von Web Stories vom AMP Project. - Web Stories auf Google Suche aktivieren:
Entwicklerorientierter Leitfaden zur Erstellung von Web Stories, die die technischen Anforderungen für die Anzeige in der Google-Suche erfüllen. - AMP Stories Website: Entwicklerfokussierte Funktionen des Web Stories-Formats.
- Web-Barrierefreiheit: Tipps, um sicherzustellen, dass Ihre Web Story für alle Nutzer zugänglich ist.
- Richtlinien für strukturierte Daten: Details zum Hinzufügen strukturierter Daten, damit die Google-Suche Ihre Inhalte besser verstehen kann.
So setzen wir das um
Web Story quality guidelines are mostly editorial: pacing, image quality, text length per frame. We brief the client’s design team on them directly, since the constraints are unfamiliar to people used to article layouts.
Verwandte Leistungen