Modul 04 · Inhaltssysteme und On-Page-Klarheit

Optimieren Sie Bilder, Videos und YouTube für die Entdeckung

Veröffentlichen Sie Medien, die eine Entscheidung erklären, für alle Benutzer funktionieren und Plattformen einen genauen Kontext darüber geben, was der Asset enthält.

Zuletzt aktualisiert

Lektion 15Inhaltssysteme und Übersichtlichkeit auf der Seite · Praktischer Kurs
42% des Kurses42% durch den Kurs

Was du lernen wirst

Medien verdienen ihren Platz, wenn sie jemandem helfen, eine Aufgabe besser zu sehen, zu vergleichen, zu lernen oder zu erledigen als nur Text. Ein Bild kann Passform und Details zeigen. Ein Video kann einen Prozess demonstrieren. Eine Abschrift kann eine gesprochene Erklärung durchsuchbar und zugänglich machen. Der Dateiname ist der am wenigsten wichtige Teil dieser Arbeit.

Am Ende dieser Lektion: Sie können Bilder und Videos mit klarem Zweck, beschreibendem Kontext, Zugänglichkeit, Leistung und Auffindbarkeit planen, veröffentlichen und pflegen.

Warum diese Arbeit wichtig ist: Bilder, Videos und YouTube für die Entdeckung optimieren

01

Ein schönes Gut ohne Kontext ist schwer zu interpretieren. Ein Produktfoto ohne Abmessungen oder Alt-Text hilft einem Screenreader-Benutzer nicht. Ein nützliches Video ohne Titel, Kapitel, Transkript oder Seitenkontext ist schwer zu finden und wiederzuverwenden. Medien benötigen die gleiche redaktionelle Pflege wie schriftliche Inhalte.

02

Medien können auch technische Kosten verursachen. Riesige Bilder, automatische Videowiedergabe, gesperrte Untertitel, unzugängliche Steuerelemente und Einbettungen von Drittanbietern können eine Seite langsamer und weniger nutzungsfähig machen. Eine gute Optimierung schützt die Aufgabe des Kunden, anstatt eine Miniaturansicht zu verfolgen.

Halten Sie die Grenze klar: Verwenden Sie keinen Alt-Text als Keyword-Liste und behaupten Sie nicht, dass das Bild- oder Video-Markup ein visuelles Ergebnis garantiert. Alt-Text ist in erster Linie eine Beschreibung der Barrierefreiheit; die Berechtigung der Plattform ändert sich im Laufe der Zeit.

Wichtige Ideen: Optimieren Sie Bilder, Videos und YouTube für die Entdeckung

01

Medien sollten eine Frage beantworten

Wählen Sie ein Bild, ein Diagramm, einen Screenshot, eine Vergleichstabelle, eine Demonstration oder ein Video, da dadurch ein bestimmter Punkt klarer wird. Dekorative Vermögenswerte können für den Ton wertvoll sein, aber sie sollten nicht der einzige Beweis für eine sachliche oder Produktbehauptung sein.

Verwenden Sie es, wenn: Was kann der Kunde aus diesem Asset verstehen, das der Text allein nicht so klar erklären würde?

02

Der Kontext gibt einem Asset eine Bedeutung

Verwenden Sie einen beschreibenden Titel, eine Überschrift in der Nähe, eine Bildunterschrift, wo sie nützlich sind, eine umliegende Erklärung und relevante Links. Eine Produktgalerie benötigt Varianten- und Dimensionskontext; ein Tutorial-Video benötigt die Aufgabe, die Version und das Ergebnis; ein Diagramm benötigt Quelle und Methode.

Verwenden Sie es, wenn: Könnte eine Person, die dieses Asset außerhalb der Seite findet, verstehen, was es zeigt und warum es wichtig ist?

03

Barrierefreiheit ist Teil des Vermögenswerts

Schreiben Sie Alt-Text, der den sinnvollen Inhalt oder die Funktion eines Bildes kommuniziert. Stellen Sie Untertitel und Transkripte für Lehrvideos, verwendbare Steuerelemente, klare Fokuszustände und ausreichend Kontrastmittel bereit. Wiederholen Sie keinen Text in der Nähe, wenn das Bild keine neuen Informationen hinzufügt.

Verwenden Sie es, wenn: Kann eine Person, die die Medien nicht sehen, hören oder leicht bedienen kann, die gleichen wesentlichen Informationen erhalten?

04

Die Lieferung beeinflusst die Erfahrung

Verwenden Sie vernünftige Dimensionen, responsive Formate, Komprimierung, Lazy Loading für Inhalte unterhalb der Falte, reservierter Layoutfläche und einen Plan für Einbettungen. Messen Sie, ob die Medien die primäre Seitenaufgabe verzögern, insbesondere in Mobilfunknetzen.

Verwenden Sie es, wenn: Hilft dieses Asset bei der Ladezeit, Layoutstabilität und Interaktion mehr als es kostet?

Praktische Schritte: Optimieren Sie Bilder, Videos und YouTube für die Entdeckung

  1. 01

    Definieren Sie den Medienjob

    Schreiben Sie die Frage auf, die das Asset beantworten wird, und die Kundenaktion, die es unterstützen soll. Dies erleichtert die Entscheidung, ob ein Bild, ein Video, ein Diagramm oder kein Asset erstellt werden soll.

  2. 02

    Original- oder lizenzierte Beweise erstellen

    Verwenden Sie Ihre eigenen Fotos, Bildschirmaufnahmen, Demonstrationen, Datensätze, Diagramme oder ordnungsgemäß lizenziertes Material. Datensatzquelle, Rechte, Zuordnung, Version und Genehmigungsstatus.

  3. 03

    Platzieren Sie es in einem nützlichen Seitenabschnitt

    Stellen Sie den Vermögenswert neben die Entscheidung, die er unterstützt, mit einer Überschrift und einer Erklärung, die dem Leser sagt, was er bemerken soll. Vermeiden Sie Galerien, die die Benutzer zwingen, den Punkt zu schließen.

  4. 04

    Barrierefreie Beschreibungen hinzufügen

    Schreiben Sie zweckorientierten Alt-Text, Bildunterschriften, Transkripte, Kapitelmarker, Etiketten und Audio- oder visuelle Alternativen je nach Asset und Publikum.

  5. 05

    Lieferung optimieren

    Generieren Sie responsive Größen, reservieren Sie Layout-Dimensionen, verschieben Sie nicht-kritische Einbettungen, testen Sie Bildunterschriften und Steuerelemente und überprüfen Sie das Asset unter eingeschränkten mobilen Bedingungen.

  6. 06

    Pflegen Sie wechselnde Medien

    Überprüfen Sie Produkt-Screenshots, Anleitungsvideos, Vergleiche, Preise, Richtlinienreferenzen und Kapitellinks, wenn sich das zugrunde liegende Produkt oder die Quelle ändert.

Geführter Workshop

Medien planen, die einem Kunden helfen, die Seitenaufgabe zu erledigen

Ihre Ergebnisse: Eine barrierefreie Medienbeschreibung für Bilder, Videos, Diagramme, Transkripte, Untertitel, Quelldateien und Links zur nächsten nützlichen Aktion.

Übungsszenario

Praxisszenario: Ein produzierendes Unternehmen hat ausgezeichnete Produktvideos, aber sie werden auf einer Videoplattform mit vagen Titeln und ohne Transkripte gespeichert. Produktseiten betten denselben Clip ohne Kontext ein, Diagramme verwenden winzige Etiketten und wichtige Sicherheitsschritte erscheinen nur als gesprochene Anweisungen.

Das Team wählt eine Produktinstallationsreise aus. Es definiert, was ein Bild zeigen kann, was ein Video zeigen soll und was auch in Klartext erscheinen muss. Es gibt jedem Asset einen Zweck, einen Titel, eine Beschreibung, zugängliche Alternativen und einen Ort in der Customer Journey.

Der neue Brief behandelt Medien nicht als Dekoration. Es macht es einfacher, visuelle Beweise für Menschen mit unterschiedlichen Geräten, Verbindungsgeschwindigkeiten und Zugriffsbedürfnissen zu finden, zu verstehen und zu verwenden.

Bauen Sie es Schritt für Schritt

01

Geben Sie jedem Vermögenswert einen Job

Entscheiden Sie, ob das Asset jemanden orientieren, vergleichen, demonstrieren, beruhigen, dokumentieren oder jemandem helfen soll, Maßnahmen zu ergreifen. Entfernen Sie Medien, die die Kundenaufgabe der Seite nicht unterstützen.

Rekord
Eine Asset-Zweck-Liste
Entscheidung, die es unterstützt
Welche Medien gehören auf die Seite
Risiko zu überprüfen
Hinzufügen von Stock-Visuals, die die Seite länger, aber nicht klarer machen
02

Schreiben Sie zuerst die Textebene

Erstellen Sie die wichtigsten Erklärungen, Etiketten, Schritte und Ergebnisse im Klartext, bevor Sie sich auf ein Bild oder Video verlassen. Der Text hilft den Lesern beim Scannen, unterstützt die Zugänglichkeit und bleibt nützlich, wenn die Medien nicht geladen werden können.

Rekord
Ein Textbegleiter für jedes Asset
Entscheidung, die es unterstützt
Was muss ohne das Visuelle verständlich bleiben
Risiko zu überprüfen
Eine kritische Anweisung nur in ein Video stellen
03

Bilder und Diagramme für kleine Bildschirme gestalten

Verwenden Sie lesbare Beschriftungen, genügend Kontrast, eine einfache visuelle Hierarchie und eine Hauptidee pro Diagramm. Testen Sie das Bild im kleinsten erwarteten Ansichtsfenster, bevor Sie es als vollständig betrachten.

Rekord
Eine mobile Sichtprüfung
Entscheidung, die es unterstützt
Ob das Visuelle den Leser klärt oder überwältigt
Risiko zu überprüfen
Ein dichtes Desktop-Diagramm verkleinern und es mobil-ready nennen
04

Paketvideo mit Kontext

Geben Sie dem Video einen bestimmten Titel, eine Zusammenfassung, Kapitelhinweise, wo nützlich, Bildunterschriften, Transkript, Sprecher- oder Quellenkontext und eine schriftliche Antwort in der Nähe. Erklären Sie, warum eine Person zuschauen sollte und was sie lernen wird.

Rekord
Eine Video-Metadaten- und Transkript-Brief
Entscheidung, die es unterstützt
Ob das Video die Entdeckung und den Abschluss unterstützt
Risiko zu überprüfen
Einbettung eines Videos ohne Erklärung oder Alternative
05

Medien technisch zuverlässig machen

Verwenden Sie vernünftige Dateigrößen, reaktionsschnelle Bereitstellung, ggf. beschreibende Dateinamen, stabile Einbettungen und getestete Fallbacks. Überprüfen Sie, ob die Medien die Hauptantwort, Links oder Aktionen bei langsamen Verbindungen nicht blockieren.

Rekord
Eine Liefer- und Fallback-Notiz
Entscheidung, die es unterstützt
Welche Vermögenswerte müssen optimiert oder sicherer platziert werden
Risiko zu überprüfen
Platzieren Sie ein schweres Heldenvideo vor dem wesentlichen Seiteninhalt
06

Messen Sie die Nützlichkeit, nicht nur spielt

Beobachten Sie, ob das Asset den Teilnehmern hilft, die Aufgabe zu erledigen, wiederholte Supportfragen zu reduzieren, den nächsten Schritt zu erreichen oder ein komplexes Konzept zu verstehen. Kombinieren Sie quantitative Signale mit Benutzerfeedback.

Rekord
Eine Überprüfung der Mediennützlichkeit
Entscheidung, die es unterstützt
Ob der Vermögenswert behalten, verbessert, verschoben oder in den Ruhestand gehoben werden soll
Risiko zu überprüfen
Ansichten als Beweis dafür behandeln, dass ein Video geholfen hat

Arbeitsvorlage

  1. Vermögensjob: Nennen Sie die Frage oder Aktion des Kunden, die dieses Bild, Video oder Diagramm unterstützt. Ein Seitenbesitzer sollte in der Lage sein, Assets ohne klare Aufgaben zu entfernen.
  2. Textbegleiter: Schreiben Sie die wesentlichen Erklärungen, Schritte oder Etiketten, die ohne Medien verfügbar bleiben müssen. Ein Prüfer der Barrierefreiheit sollte in der Lage sein, die Seite zu bewerten, ohne das Asset zu spielen.
  3. Visuelle Spezifikation: Datensatzformat, Fokus, Beschriftungen, Kontrast, mobile Einschränkungen und Quellanforderungen. Ein Designer sollte wissen, welche Idee das Bild erklären muss.
  4. Videokontext: Fügen Sie Titel, Zusammenfassung, Untertitel, Transkript, Kapitel, Sprecherkontext und die nächste Aktion in der Nähe hinzu. Ein Inhaltsprüfer sollte sehen, warum das Video auf diese Seite gehört.
  5. Liefer-Fallback: Beschreiben Sie responsives Laden, Fehlerstatus und was ein Besucher tun kann, wenn die Medien nicht verfügbar sind. Ein Ingenieur sollte in der Lage sein, die Erfahrung auf einer langsamen Verbindung zu testen.
  6. Nützlichkeitssignal: Wählen Sie ein Aufgabenabschluss-, Verständnis-, Unterstützungs- oder Nächstes-Schritt-Signal, das Sie später überprüfen möchten. Das Team sollte sich nicht allein auf die Anzahl der Spiele verlassen.

Qualitätsprüfung vor dem Versand

  1. Zeigen Sie die Seite mit deaktivierten Bildern oder auf einem schmalen Bildschirm an. Der Leser sollte immer noch die Kernentscheidung verstehen; visuelle Elemente sollten klären, vergleichen oder demonstrieren, anstatt eine wesentliche unerklärliche Behauptung zu tragen.
  2. Schreiben Sie für jedes Bild oder Video die Frage des Kunden, die es beantwortet, und die Beweise dahinter. Wenn es nur die Seite schmückt, entfernen Sie sie oder geben Sie ihm eine sinnvolle erklärende Rolle, bevor der Produktionsaufwand steigt.
  3. Überprüfen Sie die Rechte, die Zustimmung, den Text der Barrierefreiheit, die Bildunterschriften, die Dateileistung und die zukünftige Aktualisierungsberechtigung vor der Veröffentlichung. Ein nützliches Bild wird zu einer Belastung, wenn sich das Produkt, der Kunde oder der rechtliche Kontext ohne einen Überprüfungspfad ändert.

Entscheidungsregeln für die reale Welt

Ein Diagramm hat zu viel Text

Tun: Teilen Sie es in kleinere Bilder auf oder verschieben Sie die unterstützenden Details in die umgebende Kopie.

Vermeiden: Reduzieren Sie die Schriftgröße nicht, bis die Idee unlesbar wird.

Ein Video wiederholt die Seite Wort für Wort

Tun: Verwenden Sie es, um zu demonstrieren, Kontext anzuzeigen oder einen anderen Lernmodus bereitzustellen.

Vermeiden: Fügen Sie kein Video hinzu, nur weil die Seite Multimedia benötigt.

Ein Video enthält regulierte oder Sicherheitshinweise

Tun: Geben Sie eine geprüfte Transkription, Datum, Quelle und klare Grenzen in der Nähe des Inhalts an.

Vermeiden: Lassen Sie High-Stakes-Anweisungen nicht nur in gesprochener Form.

Die Medien laden sich langsam

Tun: Schützen Sie den Hauptinhalt und verwenden Sie ein leichtes Poster, eine verzögerte Einbettung oder eine alternative Route.

Vermeiden: Den Besucher nicht auf die Dekoration warten lassen, bevor er handeln kann.

Trainernotizen

  • Die besten Medien verkürzen den Abstand zwischen einer Frage und einem selbstbewussten nächsten Schritt.
  • Zugänglicher Text verbessert das Visuelle. Es gibt jedem Leser eine Möglichkeit, zu überprüfen, was er gesehen hat.
  • Ein klares Diagramm kann oft mehrere Absätze mit vagen Erklärungen ersetzen.

Arbeitsbeispiel: ein Tutorial zur Projektmanagement-Software

Das Unternehmen hat einen langen Blogbeitrag, der erklärt, wie man eine wiederkehrende Projektvorlage erstellt. Es bettet oben ein 20-minütiges Video ohne Kapitel, ohne Transkript und eine Miniaturansicht ein, die ein generisches Büro zeigt. Mobile Benutzer warten auf den Spieler, bevor sie die schriftlichen Schritte sehen können.

Das Team erstellt eine zweiminütige aufgabenorientierte Aufnahme, zeigt zuerst die fertige Vorlage, fügt Kapitel für jeden Schritt hinzu, veröffentlicht ein Transkript, das mit der Produktversion verknüpft ist, und platziert kommentierte Screenshots neben den schriftlichen Anweisungen. Das Video wird nach der prägnanten schriftlichen Antwort geladen und der Player hat zugängliche Bedienelemente.

Was hat sich geändert: Das Tutorial funktioniert jetzt für Leser, Zuschauer, Bildschirmleser und Kunden, die eine schnelle Antwort benötigen. Die Medien machen die Aufgabe klarer, ohne die Seite zu blockieren.

Das Ergebnis verbessern: Bilder, Videos und YouTube für die Entdeckung optimieren

Verwenden Sie ein Asset-Register

Verfolgen Sie für wichtige Medien die URL, die Rechte, die Quelldateien, die Produkt- oder Inhaltsversion, das Transkript, den Alt-Text, die Dimensionen, den Verantwortliche, das Überprüfungsdatum und die Seiten, auf denen sie erscheint. Dies macht ein Redesign oder ein Produkt-Update viel sicherer.

Behandeln Sie YouTube als separate Zielgruppenoberfläche

Planen Sie einen nützlichen Titel, eine Eröffnung, eine Kapitelfolge, eine Beschreibung, eine Linkroute, Untertitel und eine Miniaturansicht für die Videoplattform. Laden Sie keine Webseitenaufzeichnung hoch und gehen Sie davon aus, dass sie einem Zuschauer dient, der auf YouTube beginnt.

Lassen Sie Diagramme sich selbst erklären

Diagramme benötigen Einheiten, Zeitraum, Quelle, Methode, Schlüsselfindung und eine Textzusammenfassung. Eine farbenfrohe Grafik ohne diese Details ist Beweistheater, keine Entscheidungsunterstützung.

Aktuelle Anleitung

Verwenden Sie Discover nur dort, wo es passt

Discover kann einer inhaltsgeführten Marke helfen, interessierte Leser zu erreichen, aber es ist ein ergänzender Feed, keine zuverlässige Verkehrsprognose oder eine Voraussetzung für jedes Unternehmen.

  • Eine Seite ist für "Discover" berechtigt, wenn sie indiziert ist und den Discover-Richtlinien folgt. Es gibt kein spezielles Discover-Markup, das die Inklusion garantiert.
  • Verwenden Sie einen genauen Titel und eine Überschrift. Vermeiden Sie Clickbait, übertriebene Vorschauen und sensationelles Framing. Zeitgene Geschichten und wirklich nützliche Einblicke passen am besten.
  • Wenn eine Seite ein Heldenbild benötigt, verwenden Sie ein relevantes, hochwertiges Bild, das mindestens 1.200 Pixel breit und mehr als 300.000 Pixel hat. Planen Sie eine sichere Ernte 16:9.
  • Aktivieren Sie `max-image-preview:large` und stellen Sie ein repräsentatives `og:image` oder Bild-Markup bereit. Verwenden Sie kein generisches Logo oder ein textintensives Bild als bevorzugte Vorschau.
  • Melden Sie Impressionen, Klicks und CTR separat entdecken. Versprechen Sie keine stabile Prognose aus einem interessenbasierten Feed.

Verwenden Sie dies, bevor Sie veröffentlichen

  • Diese Seite hat einen echten Leservorteil, der über eine Verkehrsspitze hinausgeht.
  • Das bevorzugte Vorschaubild erklärt immer noch die Seite nach einem Landschaftszuschnitt.
  • Die Entdeckungsleistung wird getrennt vom schlüsselwortgesteuerten Suchverkehr gemeldet.

UnterrichtsArbeitsergebnis

Zugänglicher Medienbrief

Verbessern Sie ein vorhandenes Medien-Asset oder planen Sie ein neues für eine echte Kundenaufgabe.

Vermögensjob: Geben Sie die Entscheidung oder Aktion an, bei der es helfen soll, das Publikum und den Punkt, den ein Leser wegnehmen sollte.

Kontext und Beweise: Schreiben Sie die umgebende Überschrift, die kurze Erklärung, die Quellen- oder Methodennotiz und alle zutreffenden Produkt- oder Sachbedingungen auf.

Zugänglichkeit: Entwerfen Sie einen aussagekräftigen Alt-Text oder einen Transkript- und Untertitelplan. Beschreiben Sie, wie Tastatur- und mobile Benutzer das Asset betreiben.

Lieferung und Wartung: Wählen Sie Größe, Ladeverhalten, Layout-Reservierung, Verantwortliche, Versionsauslöser und eine Möglichkeit, um zu testen, ob das Asset das Kernseitenerlebnis schädigt.

Erledigt sieht so aus: Ihr Asset hat einen klaren Unterrichtszweck, zugängliche Alternativen, einen nützlichen Kontext und eine Wartungsroute.

Bevor Sie weitermachen

  • Jedes wichtige Asset unterstützt eine bestimmte Kundenfrage oder -entscheidung.
  • Medien erscheinen neben der Erklärung, die ihnen einen Kontext gibt.
  • Alt-Text, Bildunterschriften, Transkripte und Steuerelemente erfüllen den wahren Zweck des Assets.
  • Die Bereitstellung wird auf mobile Leistung und Layoutstabilität getestet.
  • Quelle, Rechte, Version und BewertungsVerantwortung sind dokumentiert.

Lektionsfortschritt

Haben Sie diese Lektion abgeschlossen?

Speichern Sie Ihren Fortschritt auf diesem Gerät, damit Sie später leicht weitermachen können.

Noch nicht als abgeschlossen markiert.

Setzen Sie die Lektion in die Praxis um.

Erstellen Sie ein kostenloses Spacebrain-Konto und nutzen Sie die SEO-Suite mit Ihren eigenen Datenanbietern.

Kostenlos starten