CSS-Garten mit (eingefügten) Erklärungen

[Matthias Scharwies]

Servus!

Hi,

Jedes Stylesheet soll nun eine Erklärung (1 Überschrift, 1-2 Absätze) bekommen.

2. Inhalt ins Stylesheet schreiben (Bäh) und dann in Pseudoelement sichtbar machen (Bäh, bäh How is CSS pseudo content treated by screen readers?).

Ist das in diesem Fall wirklich so bäh?

Nutzen Leute, die auf Screenreader angewiesen sind, einen auf der Seite angebotenen Style-Switcher überhaupt?

Mit großer Wahrscheinlichkeit nicht. Da hast du Recht.

Aber hier geht es eben um die fertigen Layouts, die als Musterbeispiele best practices vorzeigen sollen.

So bin ich zu SELFHTML gekommen, als Matthias Apsel 2013-2014 die 10 „Siegerentwürfe“, die aber nur aus schönen Div-Suppen bestanden, in vorbildliches HTML5-Markup umwandeln wollte. Einige hatten damals schon Flexbox.

2018 haben wir die noch vorhandenen floats durch Grid Layout ersetzt. Da es eigentlich sinnlos ist, ein „perfektes“ Grundgerüst mit Lorem Ipsum-Text zu füllen, sind wir auf die Idee gekommen, einen CSS/fertige_Layouts/CSS-Garten mit mehreren Themes anzubieten.

Jetzt möchte ich eine Single-Page-Webseite vorstellen, bei dem man nicht nur umschalten kann, sondern zu jedem Theme eine kurze Erläuterung der Besonderheiten erhält.

Im Wiki sieht das z.B. so aus: CSS/fertige_Layouts/CSS-Garten#Besonderheiten

Im Template selbst sollten die Erklärungen nicht im HTML-Markup sein, da sich jemand sein Wunsch-Theme ohne viel Arbeit durch Entfernen des Styleswitchers und der überflüssigen Stylesheets erhalten sollte.

Deshalb fragte ich danach, wie man den Spagat Inhalt im Stylesheet zu haben mit der Trennung der Zuständigkeiten in Einklang bringen kann.

Das dauert noch, ich hoffe aber bis Jahresende etwas vorzeigen zu können.

Herzliche Grüße

Matthias Scharwies