{"id":779,"date":"2016-06-23T16:31:31","date_gmt":"2016-06-23T14:31:31","guid":{"rendered":"https:\/\/www.clickstorm.de\/blog\/?p=779"},"modified":"2024-01-05T13:55:40","modified_gmt":"2024-01-05T12:55:40","slug":"alt-attribute-bei-bildern","status":"publish","type":"post","link":"https:\/\/www.clickstorm.de\/blog\/alt-attribute-bei-bildern\/","title":{"rendered":"alt=““, so sieht Google Ihre Bilder"},"content":{"rendered":"

Das alt-Attribut im HTML erm\u00f6glicht es Menschen mit Sehbehinderung und Suchmaschinen den Kontext eines Bildes zu erfassen. Der alternative Text wird jedoch im Alltag oft vergessen. \u00a0Dabei ist die Pflege in den Content Management Systemen wie TYPO3 und WordPress relativ simpel und kaum zeitaufw\u00e4ndig. Lediglich der Worflow des Redakteurs muss angepasst werden.<\/strong><\/p>\n

Alternative Texte und ihre Bedeutung<\/h2>\n

Der alternative Text dient zur Beschreibung von Bildern im Internet. Er wird dem Nutzer anstelle eines Bildes angezeigt, wenn dieses nicht geladen werden kann.<\/p>\n

Menschen mit Sehbehinderung<\/h3>\n

Der Inhalt des Bildes ist nicht f\u00fcr jeden Nutzer erkenntlich. Menschen mit Sehbeeintr\u00e4chtigungen verwenden Programme, welche die Inhalte aus einer Webseite vorlesen, oder sie m\u00fcssen die Webseite so stark vergr\u00f6\u00dfern, dass die Bilder sich nicht im Ganzen erschlie\u00dfen lassen. Ruft der Nutzer die Webseite mit geringer Bandbreite auf, werden die Bilder m\u00f6glicherweise nicht geladen. Trotzdem ist es von Bedeutung, diesen Menschen den Zugang zur Information, welche das Bild vermitteln soll, nicht zu verwehren. Das Anreichern des Bildes mit Informationen spricht f\u00fcr die Qualit\u00e4t der Webseite. Es wirkt sich positiv auf die Nutzererfahrung und die Bewertung von Suchmaschinen aus.<\/p>\n

Bilder f\u00fcr die Suchmaschinenoptimierung aufarbeiten<\/h3>\n

Suchmaschinen k\u00f6nnen den Inhalt eines Bildes ebenso wenig erfassen. Neben einen aussagekr\u00e4ftigen Dateinamen gilt es daher, den Suchmaschinen mitzuteilen, was auf dem Bild dargestellt ist. Eine gute M\u00f6glichkeit, um auch Schl\u00fcsselw\u00f6rter unterzubringen. Hierbei ist allerdings darauf zu achten, dass die Schl\u00fcsselw\u00f6rter im Zusammenhang mit dem Bild stehen und nicht nur wahllos aneinander gereiht werden. Werden zu viele Schl\u00fcsselw\u00f6rter und deren Alternativen in den alt-Attributen untergebracht, verschlechtert sich das Nutzererlebnis und es ist \u00a0sogar m\u00f6glich, dass die Webseite als SPAM eingestuft wird. Das soll Sie jedoch nicht verunsichern. Verwenden Sie n\u00fctzliche, informative und zum Bild-Kontext ad\u00e4quate Suchbegriffe in einer nat\u00fcrlichen Sprache. Ein Beispiel f\u00fcr das Firmenlogo:<\/p>\n

\"Logo<\/p>\n

Am schlechtesten w\u00e4re es, wenn gar kein alt-Attribut angegeben ist und zus\u00e4tzlich der Dateiname auch keine weiteren Informationen erkennen l\u00e4sst. Im HTML sehe das dann so aus:<\/p>\n

<img src=\"bild12.jpg\" alt=\"\" \/><\/pre>\n
 <\/p>\n
Im Gegensatz dazu eine optimale Bildbeschreibung:<\/p>\n
<img src=\"clickstorm-logo.jpg\" alt=\"Logo der clickstorm GmbH\" \/><\/pre>\n
 <\/p>\n
Was jedoch auch vermieden werden sollte:<\/p>\n
<img src=\"clickstorm-logo.jpg\" alt=\"Logo Internetagentur clickstorm GmbH Leipzig TYPO3 WordPress Shopware Symfony SEO\"<\/pre>\n
 <\/p>\n
Neben den positiven Effekt, dass so mehr Inhalt von Suchmaschinen zu erfassen ist, k\u00f6nnen die Bilder bei Bildersuchmaschinen angezeigt werden. Hierdurch erschlie\u00dft sich ein weiterer Weg, wie die Nutzer auf Ihre Internetseite gelangen k\u00f6nnen.<\/p>\n
Anpassung des\u00a0Workflows<\/h2>\n
Das Bild muss schnell online gehen, der n\u00e4chste Termin steht gleich an oder es ist kurz vor Feierabend. Nur noch schnell das Bild hochladen, einf\u00fcgen, speichern und der Rechner wird heruntergefahren. Das mit den alt-Texten kann man ja am n\u00e4chsten Tag noch erledigen. Wenn \u00fcberhaupt daran gedacht wird. So wichtig sind sie ja nicht, Hauptsache das Bild wird angezeigt.\u00a0Das alternative Texte durchaus von Bedeutung sind, wurde bereits gezeigt.<\/p>\n
Sie als Redakteur m\u00fcssen ledliglich nach dem Hochladen des Bildes ein paar W\u00f6rter noch in ein Feld eintragen. Ein geringer Aufwand mit gro\u00dfer Wirkung. Eine Gewohnheitssache, die sich leicht aneignen\u00a0l\u00e4sst.\u00a0In den Content Management Systemen k\u00f6nnen Sie die Bildinformationen direkt an das Bild kn\u00fcpfen. Somit werden diese\u00a0bei jedem Platzieren des Bildes auf der Webseite automatisch \u00fcbernommen.<\/p>\n
Pflege im TYPO3<\/h3>\n
Bei unseren TYPO3-Schulung erkl\u00e4ren wir immer, wie die Redakteure die Bilder mit weiteren Informationen anreichern k\u00f6nnen. In TYPO3 ist das sehr einfach gehalten. Nach dem Hochladen eines Bildes k\u00f6nnen die Metainformationen direkt im selben Modul\u00a0gepflegt werden. Klicken Sie dazu einfach auf das Icon vor dem Dateinamen und w\u00e4hlen Sie Bearbeiten<\/em>.
\n\"Bild<\/p>\n
Im Anschluss sehen Sie eine Maske in der Sie den alternativen Text hinterlegen k\u00f6nnen. Der Bild-Titel wird angezeigt, wenn der Nutzer mit der Maus \u00fcber das Bild f\u00e4hrt. Er sollte sich vom alternativen Text unterscheiden.<\/p>\n
\"Alternativen<\/p>\n
Wenn Sie nun speichern werden die Informationen automatisch \u00fcbernommen, sobald das Bild an irgendeiner Stelle in der Webseite angezeigt wird. Dieses Feature ist seit TYPO3 Version 6.0 im Kern integriert. Wir haben f\u00fcr Sie auch ein YouTube-Video vorbereitet,\u00a0wo Sie die eben gezeigten Schritte noch einmal nachvollziehen k\u00f6nnen. In unserem clickstorm YouTube-Kanal <\/a>finden Sie weitere Videos u.a. zum Thema TYPO3.<\/p>\n
 <\/p>\n
\"Info<\/p>\n
Dieses Video wird \u00fcber eine externe Plattform (YouTube) gehostet. Das Laden bedarf der Zustimmung unserer Datenschutzbestimmungen.<\/a><\/p>\n
Einstellung vornehmen<\/a><\/div>\n