`<input type="image">`-Elemente haben `[alt]`-Text

15.12.2022

Accessibility

Krefeld

Alt-Text, auch als alternative Text bekannt, ist ein HTML-Code, der verwendet wird, um den Inhalt eines Bildes auf einer Webseite zu beschreiben. Es ist ein wichtiges Barrierefreiheitsmerkmal, das es Menschen, die das Bild nicht sehen können, ermöglicht, dessen Kontext und Zweck immer noch zu verstehen.

Es gibt mehrere Gründe, warum es wichtig ist, Alt-Text für Bilder zu haben:

  1. Barrierefreiheit: Alt-Text wird von Screenreader-Software verwendet, um Menschen mit Sehbehinderungen Bilder zu beschreiben. Ohne Alt-Text können Menschen mit Sehbehinderungen den Inhalt des Bildes möglicherweise nicht verstehen, was es für sie schwierig macht, die Website zu navigieren und zu verwenden.
  2. SEO: Alt-Text hilft Suchmaschinen, den Inhalt von Bildern zu verstehen, was dazu beitragen kann, dass eine Website in den Suchrankings verbessert wird. Wenn Suchmaschinen eine Webseite crawlen, verwenden sie Alt-Text, um den Kontext von Bildern zu verstehen und zu bestimmen, ob sie relevant für eine Suchanfrage eines Benutzers sind.
  3. Benutzerfreundlichkeit: Alt-Text kann Benutzern helfen, den Inhalt eines Bildes zu verstehen, wenn es lange dauert, bis es geladen ist oder wenn das Bild nicht richtig angezeigt wird. Es kann auch für Benutzer hilfreich sein, die über langsame Internetverbindungen verfügen oder ein mobiles Gerät mit kleinem Bildschirm verwenden.

Zusammenfassend ist Alt-Text ein wichtiges Barrierefreiheits- und Benutzerfreundlichkeitsmerkmal, das für alle Bilder auf einer Webseite enthalten sein sollte. Es hilft sicherzustellen, dass jeder den Inhalt der Website zugänglich und verständlich machen kann, unabhängig von seinen visuellen Fähigkeiten oder den Funktionen seines Geräts.

Ähnliche Artikel:

`<dl>`-Elemente enthalten ausschließlich Gruppen aus `<dt>`- und `<dd>`-Elementen sowie `<script>`-, `<template>`- oder `<div>`-Elemente, die richtig angeordnet sind. `[role]`-Elemente sind ihren jeweils erforderlichen übergeordneten Elementen untergeordnet Listenelemente (`<li>`) befinden sich in übergeordneten `<ul>`- oder `<ol>`-Elementen ARIA `tooltip`-Elemente haben zugängliche Namen Schaltflächen haben keinen für Screenreader zugänglichen Namen `<frame>`- oder `<iframe>`-Elemente verfügen über einen Titel `[aria-hidden="true"]`-Elemente enthalten keine fokussierbaren Unterelemente Das `<html>`-Element hat einen gültigen Wert für sein `[lang]`-Attribut Zellen in einem "`<table>`"-Element, die das Attribut "`[headers]`" enthalten, verweisen auf Zellen in derselben Tabelle. `[user-scalable="no"]` wird nicht im `<meta name="viewport">`-Element verwendet und das `[maximum-scale]`-Attribut ist nicht kleiner als 5.