Guten Morgen! Ich würde gerne den [**CSS-Garten**](https://wiki.selfhtml.org/wiki/CSS/fertige_Layouts/CSS-Garten), bzw. eine entsprechende OnePager-Version mit zusätzlichen inhaltlichen Informationen anreichern und frage mich, was die beste Vorgehensweise wäre. **Struktur**: * 1 HTML-Datei * n Stylesheets * 1 styleswitcher.js, der die CSS-Dateien wechselt. Jedes Stylesheet soll nun eine Erklärung (1 Überschrift, 1-2 Absätze) bekommen. **Mögliche Vorgehensweisen:** 1. Den Inhalt als HTML in die index.html setzen und alle auf `hidden` setzen und durch den Styleswitcher den passenden sichtbar machen - Problem: HTML, das ja als Blaupause für andere Projekte dienen soll, wird aufgebläht. - mögl. Lösung: Diese Informationen ans Ende des templates setzen und mit CSS nach vorne „schieben“? 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?](https://accessibleweb.com/question-answer/how-is-css-pseudo-content-treated-by-screen-readers/)) oder dann per Styleswitcher in leeres HTML schreiben. - Vorteil: HTML bliebe als Vorlage relativ übersichtlich (*Es ist eh schwierig, eine Beispielseite so zu gestalten, dass sie realitätsnah aussieht, viele unserer fertigen Layouts leiden am Lorem Ipsum-Text.*) - Nachteil: ??? - **Wie** sollte der Text im Stylesheet gespeichert sein, um bequem ausgelesen zu werden? 3. **???** - gibt es einen besseren Ansatz? - Eigentlich sollten die fertigen Layouts nur Layout-Beispiele sein; jetzt haben schon 3 einen Style-/Themeswitcher - was ich aber gar nicht schlecht finde. Sie sollten aber eben auch nicht zu komplex werden. Wie denkt ihr drüber? Herzliche Grüße Matthias Scharwies -- Einfach mal was von der [ToDo-Liste](https://wiki.selfhtml.org/wiki/Kategorie:ToDo) auf die Was-Solls-Liste setzen.“

Guten Morgen! Ich würde gerne den [**CSS-Garten**](https://wiki.selfhtml.org/wiki/CSS/fertige_Layouts/CSS-Garten), bzw. eine entsprechende OnePager-Version mit zusätzlichen inhaltlichen Informationen anreichern und frage mich, was die beste Vorgehensweise wäre. **Struktur**: * 1 HTML-Datei * n Stylesheets * 1 styleswitcher.js, der die CSS-Dateien wechselt. Jedes Stylesheet soll nun eine Erklärung (1 Überschrift, 1-2 Absätze) bekommen. **Mögliche Vorgehensweisen:** 1. Den Inhalt als HTML in die index.html setzen und alle auf `hidden` setzen und durch den Styleswitcher den passenden sichtbar machen - Problem: HTML, das ja als Blaupause für andere Projekte dienen soll, wird aufgebläht. - mögl. Lösung: Diese Informationen ans Ende des templates setzen und mit CSS nach vorne „schieben“? 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?](https://accessibleweb.com/question-answer/how-is-css-pseudo-content-treated-by-screen-readers/)) oder dann per Styleswitcher in leeres HTML schreiben. - Vorteil: HTML bliebe als Vorlage relativ übersichtlich (*Es ist eh schwierig, eine Beispielseite so zu gestalten, dass sie realitätsnah aussieht, viele unserer fertigen Layouts leiden am Lorem Ipsum-Text.*) - Nachteil: ??? - **Wie** sollte der Text im Stylesheet gespeichert sein, um bequem ausgelesen zu werden? 3. **???** - gibt es einen besseren Ansatz? - Eigentlich sollten die fertigen Layouts nur Layout-Beispiele sein; jetzt haben schon 3 einen Style-/Themeswitcher - was ich aber gar nicht schlecht finde. Wie denkt ihr drüber? Herzliche Grüße Matthias Scharwies -- Einfach mal was von der [ToDo-Liste](https://wiki.selfhtml.org/wiki/Kategorie:ToDo) auf die Was-Solls-Liste setzen.“

Guten Morgen! Ich würde gerne den [**CSS-Garten**](https://wiki.selfhtml.org/wiki/CSS/fertige_Layouts/CSS-Garten), bzw. eine entsprechende OnePager-Version mit zusätzlichen inhaltlichen Informationen anreichern und frage mich, was die beste Vorgehensweise wäre. **Struktur**: * 1 HTML-Datei * n Stylesheets * 1 styleswitcher.js, der die CSS-Dateien wechselt. Jedes Stylesheet soll nun eine Erklärung (1 Überschrift, 1-2 Absätze) bekommen. **Mögliche Vorgehensweisen:** 1. Den Inhalt als HTML in die index.html setzen und alle auf `hidden` setzen und durch den Styleswitcher den passenden sichtbar machen - Problem: HTML, das ja als Blaupause für andere Projekte dienen soll, wird aufgebläht. 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?](https://accessibleweb.com/question-answer/how-is-css-pseudo-content-treated-by-screen-readers/)) oder dann per Styleswitcher in leeres HTML schreiben. - Vorteil: HTML bliebe als Vorlage relativ übersichtlich (*Es ist eh schwierig, eine Beispielseite so zu gestalten, dass sie realitätsnah aussieht, viele unserer fertigen Layouts leiden am Lorem Ipsum-Text.*) - Nachteil: ??? - **Wie** sollte der Text im Stylesheet gespeichert sein, um bequem ausgelesen zu werden? 3. **???** - gibt es einen besseren Ansatz? - Eigentlich sollten die fertigen Layouts nur Layout-Beispiele sein; jetzt haben schon 3 einen Style-/Themeswitcher - was ich aber gar nicht schlecht finde. Wie denkt ihr drüber? Herzliche Grüße Matthias Scharwies -- Einfach mal was von der [ToDo-Liste](https://wiki.selfhtml.org/wiki/Kategorie:ToDo) auf die Was-Solls-Liste setzen.“