ToDo: CSS-background im SELF-Wiki – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self ToDo: CSS-background im SELF-Wiki Tue, 29 Jun 21 04:16:53 Z https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1789758#m1789758 https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1789758#m1789758 <p>Servus!</p> <p>an anderer Stelle wurde dies gesagt:</p> <blockquote> <p>Das liegt aber auch sehr stark daran, dass ich trotz mehrfacher Nachfrage immer noch nirgendwo eine Beschreibung gefunden habe, wie unser Wiki "funktioniert".</p> </blockquote> <blockquote> <p>Zum Beispiel: Was sind Benutzer-Namensräume? Wie sollen Inhalte strukturiert und untereinander verlinkt sein?</p> </blockquote> <blockquote> <p>Ich empfinde die aktive Mitarbeit im Wiki als extreme Einstiegshürde, wenn man mehr tun will, als hier und da einen bestehenden Artikel zu editieren.</p> </blockquote> <p>Und doch ist das Editieren eines schon bestehenden, aber nicht optimalen Artikels der 99%-Fall.</p> <h3>Über die Inhaltsstruktur</h3><p>Für CSS gab es 3 Ebenen:</p> <ol> <li>Die Referenz der <a href="https://wiki.selfhtml.org/wiki/CSS/Eigenschaften" rel="nofollow noopener noreferrer"><strong>CSS/Eigenschaften</strong></a> - alphabetisch und knapp</li> <li>Seiten, die jede Eigenschaft mit einem oder zwei Live-Beispielen vorstellten</li> <li><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials" rel="nofollow noopener noreferrer"><strong>CSS/Tutorials</strong></a>, die aufeinander aufbauen, nicht jede Eigenschaft und jeden möglichen Wert, aber die Funktionsweise erklärten.</li> </ol> <p>Da 2. oft wie eine Dopplung der Referenz aussah, haben wir das weitgehend aufgegeben und auf die Tutorials, die durch Fortsetzungsvorlagen und die Text-Info-Vorlage verbunden sind, verteilt.</p> <p>Hier besteht noch so eine Dopplung:</p> <h3>CSS/Tutorials/Hintergrund</h3><p>Für die Hintergrundgestaltung mit <code>background</code> findet sich hier ein knappes Kapitel:</p> <ul> <li><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/Gestaltung_mit_CSS" rel="nofollow noopener noreferrer">CSS/Tutorials/Hintergrund/Gestaltung mit CSS</a></li> </ul> <p>Daneben existiert aber eine weitere Seite im alten 2.er Stil, die <strong>alle</strong> Einzeleigenschaften beschreibt und somit eine Dopplung darstellt:</p> <ul> <li><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/background" rel="nofollow noopener noreferrer">CSS/Tutorials/Hintergrund/background</a></li> </ul> <p>Hier müsste je<strong>man</strong>d schauen, dass …</p> <ul> <li>die Dopplungen beseitigt</li> <li>CSS/Funktionen/image-set() angelegt und hier erklärt und verlinkt</li> <li>evtl. das Kapitel auf 2 aufgeteilt …</li> </ul> <p>… wird und werden.</p> <p>Vielen Dank im Voraus!</p> <p>Herzliche Grüße</p> <p>Matthias Scharwies</p> <div class="signature">-- <br> Einfach mal was von der <a href="https://wiki.selfhtml.org/wiki/Kategorie:ToDo" rel="nofollow noopener noreferrer">ToDo-Liste</a> auf die Was-Solls-Liste setzen.“ </div> ToDo: CSS-background im SELF-Wiki Tue, 29 Jun 21 08:30:59 Z https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1789761#m1789761 https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1789761#m1789761 <p>Hallo Matthias,</p> <p>de facto existiert eine Tripelung, weil unter CSS/Eigenschaften die Eigenschaften ja auch nochmal aufgeführt sind.</p> <p>An der Stelle tue ich mich mit dem Konzept schwer: Referenz mit Beschreibung und Beispiel, okay, aber im Tutorial-Teil müsste man das Thema dann doch anders angehen als durch eine Auflistung von Eigenschaften, die letztlich die Referenz wiederholt, oder?</p> <p>Was bei den Referenzeinträgen wichtig zu wissen ist: sie verwenden Vorlagen. Zu jeder Vorlage gibt es im Wiki eine Dokumentationsseite, die beim Aufruf der Vorlagenseite automatisch eingebunden wird. Für die Vorlage CSS-Referenz-Eigenschaft wäre im Suchfeld des Wiki also <code>Vorlage:CSS-Referenz-Eigenschaft</code> einzugeben, um die Doku zu erhalten.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> ToDo: CSS-background im SELF-Wiki Sun, 18 Jul 21 05:39:04 Z https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1790284#m1790284 https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1790284#m1790284 <p>Servus!</p> <blockquote> <p>Hier besteht noch so eine Dopplung:</p> <h3>CSS/Tutorials/Hintergrund</h3></blockquote> <p>Ich hab' die Kapitel mal umgestellt:</p> <ol> <li> <p><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/Gestaltung_mit_CSS" rel="nofollow noopener noreferrer">CSS/Tutorials/Hintergrund/Gestaltung mit CSS</a></p> </li> <li> <p><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/Hero-Images" rel="nofollow noopener noreferrer"><strong>CSS/Tutorials/Hintergrund/Hero-Images</strong></a> jetzt neu mit image-set(), das leider nur die Auflösung und nicht die Bildschirmgröße ermittelt und zwei Beispielen zu Parallax Scrolling.</p> </li> </ol> <blockquote></blockquote> <ul> <li><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/background" rel="nofollow noopener noreferrer">CSS/Tutorials/Hintergrund/background</a> - hab' ich um die entsprechenden Abschnitte gekürzt.</li> </ul> <blockquote> <p>An der Stelle tue ich mich mit dem Konzept schwer: Referenz mit Beschreibung und Beispiel, okay, aber im Tutorial-Teil müsste man das Thema dann doch anders angehen als durch eine Auflistung von Eigenschaften, die letztlich die Referenz wiederholt, oder?</p> </blockquote> <p>Da <a href="/users/6547" class="mention registered-user" rel="noopener noreferrer">@Rolf B</a> fragte, was denn in ein Tutorial rein müsste:</p> <p><a href="https://wiki.selfhtml.org/wiki/Hilfe:Artikel#Wie_sehen_gute_Tutorials_aus.3F" rel="nofollow noopener noreferrer"><strong>Hilfe:Artikel: Wie sehen gute Tutorials aus?</strong></a></p> <blockquote> <p>Herzliche Grüße</p> <p>Matthias Scharwies</p> </blockquote> <p>Herzliche Grüße</p> <p>Matthias Scharwies</p> <div class="signature">-- <br> Einfach mal was von der <a href="https://wiki.selfhtml.org/wiki/Kategorie:ToDo" rel="nofollow noopener noreferrer">ToDo-Liste</a> auf die Was-Solls-Liste setzen.“ </div> ToDo: CSS-background im SELF-Wiki Tue, 29 Jun 21 11:56:58 Z https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1789762#m1789762 https://forum.selfhtml.org/self/2021/jun/29/todo-css-background-im-self-wiki/1789762#m1789762 <p>Servus!</p> <blockquote> <p>Hallo Matthias,</p> <p>de facto existiert eine Tripelung, weil unter CSS/Eigenschaften die Eigenschaften ja auch nochmal aufgeführt sind.</p> <p>An der Stelle tue ich mich mit dem Konzept schwer: Referenz mit Beschreibung und Beispiel, okay, aber im Tutorial-Teil müsste man das Thema dann doch anders angehen als durch eine Auflistung von Eigenschaften, die letztlich die Referenz wiederholt, oder?</p> </blockquote> <blockquote> <ul> <li><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/Gestaltung_mit_CSS" rel="nofollow noopener noreferrer">CSS/Tutorials/Hintergrund/Gestaltung mit CSS</a></li> </ul> <p>Daneben existiert aber eine weitere Seite im alten 2.er Stil, die <strong>alle</strong> Einzeleigenschaften beschreibt und somit eine Dopplung darstellt:</p> <ul> <li><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/background" rel="nofollow noopener noreferrer">CSS/Tutorials/Hintergrund/background</a></li> </ul> <p>Hier müsste je<strong>man</strong>d schauen, dass …</p> <ul> <li>die Dopplungen beseitigt</li> </ul> </blockquote> <p>Das war mein Formulierungsfehler: Die zweite Seite <strong>ist eine Dopplung</strong>. Inhaltlich entspricht sie der Referenz unter <a href="https://wiki.selfhtml.org/wiki/CSS/Eigenschaften" rel="nofollow noopener noreferrer"><strong>CSS/Eigenschaften</strong></a> + einige Live-Beispielen. Einsortiert ist sie als Tutorial.</p> <p>Jas, ein Tutorial soll eine Geschichte erzählen.</p> <p><a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/Gestaltung_mit_CSS" rel="nofollow noopener noreferrer">CSS/Tutorials/Hintergrund/Gestaltung_mit_CSS</a> erzählt vom Einfachen ausgehend eine Geschichte:</p> <ol> <li>Hintergrund mit hellblauer Farbe</li> <li>Hintergrund mit <code>background-image</code> <ul> <li>erst eine Wolke</li> <li>dann ein Verlauf</li> <li>dann Verlauf + Wolke</li> <li>dann <a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/Gestaltung_mit_CSS#animierte_Hintergrundbilder" rel="nofollow noopener noreferrer">bewegen sich die Wolken</a></li> </ul> </li> </ol> <p>Wie geht es weiter?</p> <p>Im 2. Kapitel findet mit Image-Replacement fast nur Theorie statt.</p> <p>Schöner wäre es evtl. das Sprite-Kapitel als <strong>CSS/Tutorials/Hintergrund/Rastergrafiken</strong> neu aufzuziehen:</p> <p>Mit image-set(bild1.jpg, bild2.jpg 1x, bild2.jpg 1x) mehrere Formate einsetzen, dann Hintergrundbilder mit background-position positionieren</p> <p>Dann Kachelung mit background-repeat, wobei das schon im <a href="https://wiki.selfhtml.org/wiki/CSS/Tutorials/Hintergrund/Gestaltung_mit_CSS#mehrere_Hintergrundbilder" rel="nofollow noopener noreferrer">1. Kapitel </a>vorkommt.</p> <p>Das ist halt genau die Frage, wie man diese übriggebliebene Seite mit vielen Beispielen kontextualisieren, d.h. in eine Geschichte einbinden, kann.</p> <p>Herzliche Grüße</p> <p>Matthias Scharwies</p> <div class="signature">-- <br> Einfach mal was von der <a href="https://wiki.selfhtml.org/wiki/Kategorie:ToDo" rel="nofollow noopener noreferrer">ToDo-Liste</a> auf die Was-Solls-Liste setzen.“ </div>