Sie fragen sich, was dekorative Bilder sind und wie sie sich auf SEO auswirken?
Dekorative Bilder müssen anders behandelt werden als andere Bildtypen.
Die gute Nachricht ist, dass es sehr einfach ist, dekorative Bilder richtig zu behandeln.
In diesem Artikel
- Was sind dekorative Bilder?
- Informative vs. dekorative Bilder: Was ist der Unterschied?
- Was ist Alt Text (alternativer Text)?
- Alt-Text für dekorative Bilder
- Alt-Text für informative Bilder
- Weitere SEO-Tipps: Namen und Größen von Bilddateien
- Webseiten-SEO: Mehr Besucher bekommen
- Wie wird Alt-Text in HTML geschrieben?
Was sind dekorative Bilder?
Ein dekoratives Bild ist ein Bild, das keine relevanten Informationen enthält.
Ein Stockfoto von gestapelten Büchern ist beispielsweise ein dekoratives Bild, das häufig auf Bildungswebsites zu finden ist.
Auch wenn dekorative Bilder nur selten einen Informationswert haben, können sie den Stil einer Website verbessern und dazu beitragen, dass der Nutzer eine Seite genießt.
So können beispielsweise Literaturmagazine und -zeitschriften Stock-Images oder individuelle Illustrationen verwenden, um den Seiten ein visuelles Flair zu verleihen.
Hier kann das dekorative Bild verführerisch sein und vor allem die Fantasie ansprechen.
Die Seite "Über uns" der Zeitschrift Nautilus ist ein gutes Beispiel. Sie verspricht "eine Reise zu den Wundern des Universums", und eine traumhafte Illustration zieht den Leser in ihren Bann.
Informative vs. dekorative Bilder: Was ist der Unterschied?
Der Hauptunterschied zwischen dekorativen und informativen Bildern besteht darin, dass letztere Informationen über das Thema der Seite liefern.
Beispiele für informative Bilder sind:
- Fotos von aktuellen Ereignissen, z. B. von einer Demonstration oder einem Tatort.
- Diagramme und Schaubilder, die die in einem Artikel genannten Punkte verdeutlichen.
- Bilder eines Ortes, einer Person oder einer Sache, die in dem Artikel besprochen werden.
Informative Bilder werden auch als funktionale Bilder bezeichnet.
Informative Bilder helfen den Nutzern, die Richtigkeit des Textes zu überprüfen und in einigen Fällen tiefer ins Detail zu gehen.
Aber wie wir am Beispiel der Nautilus gesehen haben, scheint es falsch zu sein, zu behaupten, dass dekorative Bilder keine Informationen vermitteln, da sie visuell eine Stimmung hervorrufen und Erwartungen wecken können.
Wir können jedoch sagen, dass die dekorativen Bilder keine Informationen liefern, die nicht bereits im Text enthalten sind.
Diese beiden Arten von Bildern werden auch in der Suchmaschinenoptimierung unterschiedlich behandelt.
Um zu verstehen, wie und warum, lassen Sie uns die Bedeutung von Alt-Text noch einmal betrachten.
Was ist Alt Text (alternativer Text)?
Alt-Text ist ein Text, der ein Bild beschreibt.
Es gibt 2 Zwecke für Alt-Text:
- Suchmaschinen lesen und indizieren den Alt-Text und helfen ihnen, den Bildinhalt zu verstehen.
- Alt-Text wird von Bildschirmlesegeräten vorgelesen, also von Geräten, die von Menschen mit Behinderungen verwendet werden.
Alternativtext wird auch als alt-Tag bezeichnet. Dies ist ein Verweis auf den HTML-Code, den Content-Management-Systeme wie WordPress automatisch zu Bildern hinzufügen.
Alt-Text für dekorative Bilder
Der Umgang mit Alt-Text für dekorative Bilder ist einfach: Es gilt als beste Praxis , ihn leer zu lassen.
So können Sie sicherstellen, dass das Feld leer ist:
- Bei WordPress anmelden
- Navigieren Sie zu einer beliebigen Webseite, auf der Sie ein Bild haben.
- Klicken Sie dann auf das Bild, um die Bildeinstellungen von WordPress in der rechten Seitenleiste zu öffnen.
Dort sehen Sie das Feld Alt-Text.
Wenn Sie das Feld leer lassen, bedeutet das lediglich, dass Sie keinen Alt-Text hinzufügen müssen.
Wenn Sie es leer lassen, können Bildschirmlesegeräte das dekorative Bild überspringen. Dies bietet eine bessere Benutzererfahrung für Sehbehinderte, da die Beschreibung dieses Bildes keinen Nutzen bringen würde.
Stellen Sie sich vor, ein Bildschirmlesegerät liest laut vor,
- "Menschen, die auf Websites zeigen"
- "dekoratives grünes Bild", oder,
- "Illustration für Website-Artikel"
Langweilig, was?
Sehen wir uns nun an, wie sich die Handhabung von Alt-Text für informative Bilder unterscheidet
Bildschirmleser sind eine von vielen Hilfstechnologien, die von Menschen mit Behinderungen genutzt werden.
Alt-Text für informative Bilder
Als Beispiel verwenden wir einen Artikel über ein digitales Strategiemodell von Avinash Kaushik.
Kaushik ist ein bekannter Marketing-Visionär. Da sich der Artikel auf seine Arbeit konzentriert, haben wir ein Foto von ihm hinzugefügt.
Und das ist der Alt-Text, den wir hinzugefügt haben: "avinash kaushik spricht auf einer Konferenz".
Das Foto von Kaushik liefert nicht viele Informationen, also fragen Sie sich vielleicht: "Warum nicht als dekoratives Bild?" Das könnten wir. Aber Kaushik ist das Herzstück des Artikels. Und wir wollen, dass Suchmaschinen diesen Alt-Text indizieren.
Auf diese Weise können Nutzer, die nach "Avinash Kaushik" suchen, auf dieses Foto stoßen und sich zu dem Artikel durchklicken.
Sehen wir uns nun 2 Bildprobleme an, die sich auf SEO auswirken können.
Weitere SEO-Tipps: Namen und Größen von Bilddateien
Wenn Sie sicherstellen, dass der Name und die Größe Ihrer Bilddatei optimiert sind, können Sie Ihre Suchmaschinenoptimierung verbessern.
Betrachten wir zunächst die Dateinamen.
Bilddateinamen vs. Dateitypen
Bevor wir uns damit befassen, sollten Sie wissen, dass der Name einer Bilddatei etwas anderes ist als der Dateityp. Der Dateityp wird durch eine "Erweiterung" ausgedrückt - ein kurzes Stück Text, das automatisch am Ende eines Bilddateinamens erscheint.
Zum Beispiel: Foto-Name.jpg
Dies sagt uns, dass der Dateiname "Foto-Name" lautet und das Dateiformat jpg ist.
Wenn dieses Bild im png-Format wäre, würde es so aussehen: Foto-Name.png.
Die Erweiterung ist eine winzige Information, die angibt, in welchem Format die Datei vorliegt.
Es gibt viele Arten von digitalen Bildformaten, wie z. B. .webp und .svg. Es ist nicht notwendig, sie alle zu verstehen, da diese Erweiterung automatisch hinzugefügt wird.
Optimieren von Bilddateinamen
Da Suchmaschinen auch die Namen von Bilddateien lesen, sollten Sie darauf achten, dass Ihre Namen eindeutig und beschreibend sind.
Schlecht benannte Bilddateien sind vage, wie diese hier:
- 1100073658.jpg
- Mann-trainiert.jpg
Gute Bildtitel sollten spezifisch sein und das Bild beschreiben.
Nehmen wir an, Sie schreiben einen Artikel darüber, wie Rekruten ihre Fitness aufbauen, bevor sie ins Boot Camp des U.S. Marine Corps geschickt werden.
Ihr Bild zeigt einen echten Rekruten, der Plank-Übungen macht. Anstelle von man-exercising.jpg könnten Sie Ihr Bild marine-recruit-holding-plank.jpg nennen.
Dateinamen für dekorative Bilder sind oft weniger spezifisch, da sie eine Stimmung oder ein Gefühl für die Marke hervorrufen sollen. Das dekorative Nautilus-Bild oben heißt zum Beispiel wonder-vehicle.jpg.
Wenn Sie ein Kunstwerk freigeben, ist der Titel des Kunstwerks ein geeigneter Dateiname für das Bild.
Erfahren Sie mehr in unserem Artikel über SEO für Dateinamen von Bildern.
Vorsicht! Die Veröffentlichung von Bildern, für die Sie keine Lizenz haben, kann zu hohen Geldstrafen führen. In den USA können diese Geldstrafen bis zu 150.000 $ pro Bildnutzung betragen.
Größe der Bilddatei
Da große Dateigrößen dazu führen können, dass Ihre Seite langsam lädt, sollten Sie ein WordPress-Plugin verwenden, das Ihre Bilder automatisch für die Geschwindigkeit optimiert.
Plugins wie WP Rocket sind einfach zu installieren und zu verwenden.
Profi-Tipp: Die Größe Ihrer Bilddatei und die Anzeigegröße des Bildes sind zwei verschiedene Dinge. Es ist möglich, die Bildgröße zu reduzieren und das Bild trotzdem als hochauflösendes, Retina-ready-Bild anzeigen zu lassen.
Webseiten-SEO: Mehr Besucher bekommen
Informative und dekorative Bilder können die Besucher Ihrer Website ansprechen. Und Alt-Text für informative Bilder kann Traffic von Suchmaschinen anziehen.
Aber zu SEO gehört mehr als nur ein Bild-Alt-Text.
Hier kommt ein Plugin wie All in One SEO (AIOSEO) ins Spiel kommt.
Es ist so konzipiert, dass es auch für Anfänger leicht zu bedienen ist, und bietet fast alles, was Sie für SEO brauchen (außer dem Inhalt).
Dies ist ein bewährtes Plugin mit Tausenden von 5-Sterne-Bewertungen auf WordPress.org. Über 3 Millionen Nutzer haben es heruntergeladen.
Und so funktioniert es.
Höher ranken: Jeder möchte, dass seine Inhalte besser ranken, aber SEO zu lernen braucht Zeit. Hier ist AIOSEO der Schlüssel. Es analysiert Ihre Inhalte und sagt Ihnen genau, was Sie tun müssen, um sie für SEO zu optimieren.
Je mehr Sie der Empfehlung folgen, desto höher wird Ihr TruSEO-Score.
Großartig in den Suchergebnissen aussehen: Das Plugin macht es einfach, Ihre Webseiten für die Anzeige als Rich Snippets zu qualifizieren. Sie können sich Rich Snippets als Super-Deluxe-Suchmaschinenanzeigen vorstellen.
So sieht ein Standard-Suchschnipsel aus:
Und hier ist ein Rich Snippet.
Kein Code erforderlich: All in One SEO erledigt mehrere technische Funktionen automatisch. Zum Beispiel generiert es automatisch XML- und RSS-Sitemaps. Diese Sitemaps pingen Suchmaschinen an, um sie über Ihre Änderungen oder neuen Inhalte zu informieren.
Vergessen Sie nicht, für Umstellungen zu planen
Während Sie sich um mehr Besucher bemühen, sollten Sie sich überlegen, welche Aktionen Sie Ihren Besuchern zumuten wollen.
Wir verwenden OptinMonster zur Erstellung von Exit-Intent-Popups. Diese Pop-ups erscheinen, wenn die Besucher bereit sind, Ihre Website zu verlassen.
OptinMonster ist kostengünstig und effektiv.
Wie wird Alt-Text in HTML geschrieben?
Für diejenigen, die sich für die HTML-Darstellung von Alt-Text interessieren, ist das Folgende von Nutzen.
Die Syntax für den Alt-Text lautet wie folgt:
<img alt="your alt text goes here">Beachten Sie, dass alt eine Eigenschaft des HTML-Bildelements ist und dass der Wert der Eigenschaft zwischen den Anführungszeichen steht.
<img alt="baseball player sliding into homebase">Img-Tags enthalten auch die Quelle (src) (URL) des Bildes, zum Beispiel:
<img src="/baseball-player-scoring.png/" alt="baseball player sliding into homebase">Wenn das Feld für den Alt-Text leer ist, wird es als Null-Alt-Text bezeichnet und sieht in HTML wie folgt aus.
<img src="/baseball-player-scoring.png/" alt="">Dies wird auch als leeres alt-Attribut bezeichnet.
Tipp: Finden Sie heraus, wie Sie den Code einer beliebigen Webseite anzeigen können.
Q&A zu Image
Haben Sie weitere Fragen zu dekorativen Zwecken, Alt-Text oder Barrierefreiheit von Bildern? Nachstehend finden Sie Antworten auf einige häufig gestellte Fragen.
Wenn Sie eine zusätzliche Frage haben, schreiben Sie bitte eine Nachricht in den Kommentarbereich.
Gelten Hintergrundbilder als dekorative Bilder?
Ja, Hintergrundbilder, wie sie durch die Eigenschaft background-image in CSS definiert sind, werden als dekorativ angesehen. In diesen Fällen wird im CSS-Code der Website in der Regel eine Klasse angegeben, deren alt-Attribut immer leer ist.
Was ist Barrierefreiheit im Internet?
Die Barrierefreiheit im Internet umfasst eine Reihe von technologischen Verfahren und Standards, die es Menschen mit Behinderungen erleichtern sollen, auf einer Website zu surfen und Inhalte zu konsumieren. Die Richtlinien für barrierefreie Inhalte (Web Accessibility Content Guidelines, WCAG) beschreiben die besten Praktiken für Webentwickler, aber Anfänger sollten mit den Grundlagen beginnen.
Die Zugänglichkeit einer Website wirkt sich zwar nicht direkt auf die Suchmaschinenoptimierung aus, aber die Zugänglichkeit steht im Zusammenhang mit guter Suchmaschinenoptimierung. Deshalb kann eine Website, die für Barrierefreiheit optimiert ist, in den Suchergebnissen höher ranken.
Was sind die Leitlinien für die Barrierefreiheit im Internet?
Die Web-Zugangsleitlinien sind ein Dokument, das Leitlinien für die Erleichterung des Zugangs zu Websites für Menschen mit Behinderungen enthält. Die von der Web Accessibility Initiative(WAI) entwickelten Leitlinien für barrierefreie Inhalte(Web Accessibility Content Guidelines, WCAG) werden ständig verbessert.
Die Leitlinien folgen 4 Prinzipien, die als wahrnehmbar, bedienbar, verständlich und robust definiert sind.
Die Web Accessibility Initiative ist Teil des World Wide Web Consortium(W3).
Nach dekorativen Bildern . . .
Wir hoffen, dass dieser Beitrag Ihnen geholfen hat zu verstehen, was dekorative Bilder sind und warum es am besten ist, den Alt-Text leer zu lassen.
Als Nächstes erfahren Sie mehr über Bild-SEO und wie Bilder bei der Erstellung durchsuchbarer Inhalte nützlich sein können.
Wenn Sie diesen Artikel hilfreich fanden, abonnieren Sie bitte unseren YouTube-Kanal . Dort finden Sie viele weitere hilfreiche Tutorials. Sie können uns auch auf X (Twitter) , LinkedIn oder Facebook folgen, um auf dem Laufenden zu bleiben.
Möchten Sie AIOSEO kostenlos testen?
Geben Sie die URL Ihrer WordPress-Website ein, um AIOSEO Lite zu installieren.
Offenlegung: Unsere Inhalte werden von unseren Lesern unterstützt. Das bedeutet, wenn Sie auf einige unserer Links klicken, erhalten wir möglicherweise eine Provision. Wir empfehlen nur Produkte, von denen wir glauben, dass sie unseren Lesern einen Mehrwert bieten.
