@@Neunmalunklug
<!DOCTYPE html> <html> <head> <link href="style/style.css" type="text/css" rel="stylesheet"> </head>
Hier fehlt so einiges: Angabe der Sprache des Seiteninhalts, der Zeichencodierung, viewport
und title
. Zu ausführlicher Erklärung hier entlang.
<img src="img/logo.png">
Hier fehlt die notwendige Angabe des Alternativtextes:
<img src="img/logo.png" alt="Logo">
Statt „Logo“ sollte da evtl. auch der Name der Organisation stehen.
<table> <tr><td>Email-Adresse:</td><td>Passwort</td></tr> <tr><td style="margin-right: 5%;"><input name="uname" type="text" ></td><td><input name="pass" type="password" ></td><td><button class="searchbutn">>></button></td><td><a href="forgot.php">Passwort vergessen</a></td><td><a href="register.php">Registrieren</a></td></tr> </table>
Hier fehlen die notwendigen Beschriftungen der Eingabefelder.
Und auch der Button hat keine Beschriftung: „>>“ ist keine, „Einloggen“ ist eine. Das sollte
<button class="searchbutn">Einloggen</button>
stehen; den Text kannst du mit CSS visuell verstecken und dafür die Pfeile anzeigen.
Alternativ könnte man den Button auch mit ARIA beschriften:
<button class="searchbutn" aria-label="Einloggen">>></button>
Das ginge auch für die Eingabefelder. Aber: ARIA ist nicht dazu da, HTML zugänglich zu machen. ARIA ist dazu da, schlechtes HTML zugänglich zu machen.
LLAP 🖖
--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory