Revenge.css

[Matthias Apsel]

Hallo Gunnar Bittersmann,

Danke für deine Ausführungen. Leider werde ich in den nächsten 14 Tagen wohl etwas weniger Zeit haben, das umzusetzen.

Ja. Schon den Anfang: „… können sich leicht Fehler einschleichen, die zu einem invaliden Markup führen. Ein Validierungs-Stylesheet hilft, diese Fehler sichtbar zu machen.“

Das ist nicht das alleinige Ziel, schon gar nicht das Hauptziel.

So ein Test-Stylesheet ist vor allem dazu da, Fehler aufzudecken, die ein Validator nicht findet.

Das Hauptaugenmerk liegt eher auf Accessibility-Sünden.

Ok. Also heißt es die Prioritäten umzudrehen.

img:not([alt]) ist da ein Anfang, aber ausbaufähig. Jemand könnte auf die Idee kommen, im Markup alt="" zu ergänzen, womit der Fehler natürlich nicht behoben ist. Also auch img[alt=""] kennzeichnen?

Es geht in dem Artikel nicht darum, dass man sich selbst ein solches Stylesheet schreibt, sondern dass man Heydons verwenden oder anpassen soll.

Die Diskussion um alt wurde auch geführt.

Es ist auch problematisch, die Farbe der Umrandung hartcodiert auf rot zu setzen. Was, wenn man das Farbschema ändert und nun Rot als Akzentfarbe auf den Seiten auftritt? Dann muss man die Fehlerfarbe schnell ändern können, z.B. auf orange. Dateiweites Suchen und Ersetzen kann das zwar, es geht aber besser, wenn man sich die Fehlerfarbe in eine Variable packt. Die Rahmendicke dann auch gleich:

:root
{
	--error-color: red;
	--error-outline: 0.5rem solid var(--error-color);
}

img:not([alt]),
img[alt=""]:not([role="none"]):not([role="presentation"]):not([aria-labelledby])
{
	ERROR: 'Alternativtext fürs Bild fehlt';
	outline: var(--error-outline) !important;
}

gute Idee.

PS: Kaputte Syntax-Highlighter sind kaputt.

Auch da kann man ein Ticket aufmachen, Rouge heißt der glaub ich. @Christian Kruse kann dir die Adresse nennen. Und da du besser englisch kannst als ich, solltest besser du das tun.

Bis demnächst
Matthias