Alt-Text( alternativer Text), auch als „Alt-Attribute“, „Alt-Beschreibungen“ oder technisch falsch als „Alt-Tags“ bezeichnet, wird in einem HTML-Code verwendet, um das Erscheinungsbild und die Funktion eines Bildes auf einer Seite zu beschreiben.
Alt-text verwendet:
1. Das Hinzufügen von alternativem Text zu Fotos ist in erster Linie ein Prinzip der Web-Zugänglichkeit. Sehbehinderte Benutzer, die Bildschirmleser verwenden, erhalten ein Alt-Attribut, um ein Bild auf der Seite besser zu verstehen.
2., Alt-Text wird anstelle eines Bildes angezeigt, wenn eine Bilddatei nicht geladen werden kann.
3. Alt-Text bietet Suchmaschinen-Crawlern einen besseren Bildkontext/Beschreibungen und hilft ihnen, ein Bild richtig zu indizieren.
Der markierte text zeigt den alt-text (alt-Attribut) des Bildes auf der linken Seite.
Das beste Format für Alt-Text ist ausreichend beschreibend, enthält jedoch keine Spam-Versuche zum Füllen von Schlüsselwörtern., Wenn Sie Ihre Augen schließen, jemanden den Alt-Text lesen lassen und sich eine einigermaßen genaue Version des Bildes vorstellen können, sind Sie auf dem richtigen Weg.
Schauen wir uns ein paar Beispiele für Alt-Text für dieses Bild eines lecker aussehenden Stapels Blaubeerpfannkuchen an:
Dieser ALT-Text ist nur „okay“, weil es nicht sehr beschreibend. Ja, das ist ein Bild von einem Stapel Pfannkuchen. Aber es gibt noch mehr über dieses Bild zu sagen.,
Gut:
<img src="https://moz.com/learn/seo/pancakes.png" alt="Stack of blueberry pancakes with powdered sugar">
Dieser Alt-Text ist eine bessere Alternative, da er viel beschreibender für das Bild ist. Dies ist nicht nur ein Stapel „Pfannkuchen“ (wie das erste Alt-Textbeispiel gezeigt hat); Es ist ein Stapel Blaubeerpfannkuchen mit einem Staub von Puderzucker!
<img src="https://moz.com/learn/seo/pancakes.png" alt="pancake pancakes pan cake hotcakes hotcake breakfast food best breakfast top breakfasts breakfast recipes pancake recipe">
Keines dieser Beispiele wird empfohlen., Die erste Codezeile enthält überhaupt keinen Alt-Text (beachten Sie, dass die Anführungszeichen leer sind), während das zweite Beispiel das Füllen von Schlüsselwörtern im Alt-Text demonstriert.
Warum ist Alt-Text wichtig?
Erreichbarkeit
Alt-text ist ein Grundsatz der zugängliche web-design. Sein ursprünglicher (und immer noch primärer) Zweck ist es, Bilder für Besucher zu beschreiben, die sie nicht sehen können. Dazu gehören Bildschirmleser und Browser, die Bilder blockieren, aber auch Benutzer, die sehbehindert sind oder auf andere Weise ein Bild nicht visuell identifizieren können., Das Einfügen von Alt-Text in Ihre Bilder stellt sicher, dass alle Benutzer, unabhängig von Ihren visuellen Fähigkeiten, den Inhalt Ihrer Website schätzen können.
Bild SEO
Die Verwendung von Alt-Text auf Ihren Bildern kann für eine bessere Benutzererfahrung sorgen, aber es kann auch dazu beitragen, dass Sie sowohl explizite als auch implizite SEO-Vorteile erzielen. Neben der Implementierung von Best Practices für Bildtitel und Dateinamen kann auch Alt-Text zur Bild-SEO beitragen.,
Während sich die Bilderkennungstechnologie von Suchmaschinen im Laufe der Jahre erheblich verbessert hat, können Suchcrawler die Bilder auf einer Website-Seite immer noch nicht so „sehen“, wie wir es können, daher ist es nicht ratsam, die Interpretation allein in ihren Händen zu lassen. Wenn sie es nicht verstehen oder falsch verstehen, ist es möglich, dass Sie entweder nach unbeabsichtigten Schlüsselwörtern rangieren oder das Ranking ganz verpassen.
Hier ist ein Beispiel: Google könnte das folgende Bild sehen und entschlüsseln können, dass es sich um einen Mann handelt, der eine Krawatte und eine Brille trägt und an einem Schreibtisch sitzt.,
Jim Halpert aus dem Büro (US-Version)
Wenn Sie versuchen, Rang für“ Jim Halperts Identitätswechsel von Dwight Schrute, “ obwohl, müssen Sie die Suchmaschine eine helfende Hand zu verleihen.
In diesem Sinne bietet Ihnen alt text eine weitere Möglichkeit, Ihr Zielschlüsselwort einzuschließen., Da die Keyword-Nutzung auf der Seite immer noch als Suchmaschinen-Ranking-Faktor an Gewicht gewinnt, ist es in Ihrem besten Interesse, Alt-Text zu erstellen, der sowohl das Bild beschreibt als auch, wenn möglich, ein Keyword oder eine Keyword-Phrase enthält, auf die Sie abzielen.
Wie schreibe ich guten Alt-Text?
Beschreiben Sie das Bild so konkret wie möglich. Alt Text wurde in erster Linie entwickelt, um Benutzern, die sie nicht sehen können, Texterklärungen von Bildern bereitzustellen. wenn ein Bild wirklich keine Bedeutung/Wert vermittelt und nur für Designzwecke da ist, sollte es innerhalb des CSS leben, nicht HTML.,
Halten Sie es (relativ) kurz. Die beliebtesten Bildschirmleser schneiden Alt-Text mit etwa 125 Zeichen ab, daher ist es ratsam, ihn auf diese Zeichenanzahl oder weniger zu beschränken.
Verwenden Sie Ihre Keywords Alt Text bietet Ihnen eine weitere Möglichkeit, Ihr Ziel-Keyword auf einer Seite enthalten, und damit eine weitere Möglichkeit, Suchmaschinen zu signalisieren, dass Ihre Seite für eine bestimmte Suchanfrage sehr relevant ist., Während Ihre erste Priorität darin bestehen sollte, das Bild zu beschreiben und Kontext bereitzustellen, sollten Sie, wenn dies sinnvoll ist, Ihr Schlüsselwort in den Alt-Text mindestens eines Bildes auf der Seite aufnehmen.
Vermeiden Sie keyword stuffing. Google dockt Sie nicht an Punkte für schlecht geschriebenen Alt-Text an, aber Sie werden in Schwierigkeiten geraten, wenn Sie Ihren Alt-Text verwenden, um so viele relevante Schlüsselwörter wie möglich einzufügen. Konzentrieren Sie sich darauf, beschreibenden Alt-Text zu schreiben, der dem Bild Kontext bietet und wenn möglich Ihr Zielschlüsselwort enthält, und belassen Sie es dabei.
– verwenden Sie keine Bilder als text., Dies ist weniger eine alt-Text-spezifische Best Practice und eher eine allgemeine SEO-freundliche Web-Entwicklung Lehre. Da Suchmaschinen keinen Text in Ihren Bildern lesen können, sollten Sie vermeiden, Bilder anstelle von Wörtern zu verwenden. Wenn Sie dies tun müssen, erklären Sie, was Ihr Foto in Ihrem Alt-Text sagt.
Nicht enthalten „bild von, „“bild von,“ etc. in Ihrem Alt-Text. Es wird bereits angenommen, dass sich Ihr Alt-Text auf ein Bild bezieht, sodass Sie ihn nicht angeben müssen.
vergessen Sie nicht longdesc=““. Erkunden Sie mit dem longdesc=““ – Tag komplexere Bilder, die eine längere Beschreibung erfordern.,
Formularschaltflächen nicht vernachlässigen. Wenn ein Formular auf Ihrer Website ein Bild als Schaltfläche „Senden“ verwendet, geben Sie ihm ein Alt-Attribut. Bildschaltflächen sollten ein Alt-Attribut haben, das die Funktion der Schaltfläche wie „Suchen“, „Jetzt anwenden“, „Anmelden“ usw. beschreibt.
Besser alt-text: <img src="https://moz.com/learn/seo/kwe.png" alt="keyword research in Keyword Explorer">
Beste alt-text: <img src="https://moz.com/learn/seo/kwe.png" alt="Moz Keyword Explorer tool for SEO keyword research">
Halten lernen
Google Bild-Publishing-Richtlinien
On-Page-Ranking-Faktoren
Meta Description
Ihre Fähigkeiten
Die Page-Optimierung Abschnitt von Moz Pro zeigt Seiten, die nicht Leben bis zu der vollständigen Suche Sichtbarkeit Potenzial (und beinhaltet Dinge wie, ob eine Seite fehlt alt-text)., Probieren Sie es aus >>
