Nehmen wir an, Sie erstellen eine Website und arbeiten mit einem Designer zusammen. Sie kommen mit einigen soliden Designs zu Ihnen, und Sie sind bereit loszulegen. Sie sind auch ein gewissenhafter Frontend-Entwickler und möchten sicherstellen, dass die von Ihnen erstellten Websites zugänglich sind. Die Designs, mit denen Sie arbeiten, enthalten etwas Fließtext, aber Sie bemerken, dass die Links im Fließtext keine Unterstreichungen haben.
Sie befinden sich nun in The Contrast Triangle.
Das "Dreieck" bedeutet einen dreiseitigen Vergleich
- Der Kontrast zwischen dem Hintergrund und dem Text
- Der Kontrast zwischen dem Hintergrund und den Links
- Der Kontrast zwischen Text und Links
Ich glaube, das spielt eine Rolle, ob Sie Links unterstreichen oder nicht, aber ich verstehe den Punkt, dass das Problem ohne Unterstreichungen schlimmer ist.
Ich würde sogar argumentieren, dass das Problem noch komplizierter ist. Sie müssen auch den Text berücksichtigen, wenn er ausgewählt ist, und sicherstellen, dass alles in diesem Fall auch Kontrast hat. Und die Hover-Zustände, aktiven Zustände, besuchten Zustände und Fokus-Zustände. Es ist also wirklich wie ein Hexacontakaienneagon des Kontrasts oder so etwas.
Lange Zeilen mit unterstrichenem Text sind sehr schwer zu lesen! Es ist ein Barrierefreiheits-Dilemma. Es wird auch empfohlen, dass ein Link tatsächlich angibt, was er ist, d.h. "Klicken Sie hier" oder eine ähnliche Aktion im Text enthält.
Mir wurde immer das Gegenteil beigebracht, nämlich dass Links niemals "Klicken Sie hier" sagen sollten und stattdessen ihren Inhalt beschreiben sollten. Also anstatt
Um das Tutorial anzuzeigen, <a>klicken Sie hier</a>.sollte es heißen
<a>Tutorial anzeigen</a>.Entschuldigen Sie die verspätete Antwort von vier Tagen – aber danke Chris für die Erwähnung! Der Link zum Tool selbst ist https://contrast-triangle.com/ – ich hoffe, er hilft den Leuten!