tag:forum.selfhtml.org,2005:/self Welchen nutzen haben die Bezeichner id und for im HTML – SELFHTML-Forum 2018-04-09T16:50:53Z https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718587#m1718587 Dieter 2018-04-05T15:04:50Z 2018-04-05T15:04:50Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo alle miteinander!</p> <p>Ich versuche mich in den Anfängen mit Bootstrap.</p> <p>Kann mir bitte jemand sagen für was ich die Bezeichner</p> <p>for="inputName"</p> <p>id="inputName"</p> <p>verwende. Oder kann ich dies vernachlässigen.</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>inputName<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-sm-2 control-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-sm-10<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-control<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>inputName<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><?php echo htmlentities($user['name']); ?><span class="token punctuation">"</span></span> <span class="token attr-name">required</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718591#m1718591 dedlfix 2018-04-05T15:14:45Z 2018-04-05T15:14:45Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>Ich versuche mich in den Anfängen mit Bootstrap.</p> </blockquote> <p>Das ist allgemeines HTML und nicht Bootstrap-spezifisch.</p> <blockquote> <p>Kann mir bitte jemand sagen für was ich die Bezeichner</p> <p>for="inputName"</p> <p>id="inputName"</p> <p>verwende. Oder kann ich dies vernachlässigen.</p> </blockquote> <p>Kann man, sollte man aber nicht, weil damit wichtige Funktionalität verlorengeht.</p> <p><code>label for</code> und <code>input id</code> spielen so zusammen, dass das Label nun dem Input-Feld zugeordnet ist. Damit hat das Inputfeld nun auch logisch eine Beschriftung zugeordnet bekommen und nicht nur optisch, weil das in der Ausgabe mehr oder weniger zufällig beieinandersteht. Damit können nun auch assistive Techniken wie Screenreader zum Inputfeld die passende Beschriftung vorlesen. Außerdem kann man nun auf das Label klicken und der Cursor setzt sich ins zugeordnete Eingabefeld. Vielleicht gibts auch noch ein paar andere Eigenschaften. Weglassen bringt jedenfalls keine Vorteile.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718593#m1718593 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T15:24:02Z 2018-04-05T15:24:02Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@Dieter</p> <blockquote> <p>Ich versuche mich in den Anfängen mit Bootstrap.</p> </blockquote> <p>Bedauernswert. Wer treibt dich zu/in diesen Wahnsinn?</p> <p></p> <blockquote> <p>Kann mir bitte jemand sagen für was ich die Bezeichner</p> <p>for="inputName"</p> <p>id="inputName"</p> <p>verwende.</p> </blockquote> <p>Das <code>for</code>-Attribut dient dazu, eine <a href="https://wiki.selfhtml.org/wiki/HTML/Formulare/label" rel="nofollow noopener noreferrer">Beschriftung (<code>label</code>)</a> einem Eingabefeld zuzuordnen. Die Werte der Attribute müssen dazu übereinstimmen.</p> <blockquote> <p>Oder kann ich dies vernachlässigen.</p> </blockquote> <p>Keinesfalls. Ohne zugeordnete Beschriftung ist ein Formular für etliche Nutzer nicht bedienbar.</p> <p>Die Zuordnung kann auch implizit erfolgen, wenn das <code>input</code>-Element innerhalb des <code>label</code>-Elements ist:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span><span class="token punctuation">></span></span> Name: <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> </code></pre> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718610#m1718610 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-05T16:04:00Z 2018-04-05T16:18:19Z Welchen nutzen haben die Bezeichner id und for im HTML <p>hallo</p> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Hier wäre doch eventuell ein <fieldset> richtig?</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718640#m1718640 marctrix self@mhis.de http://mhis.de 2018-04-06T06:51:38Z 2018-04-06T06:54:55Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej Dieter,</p> <blockquote> <p>Ich versuche mich in den Anfängen mit Bootstrap.</p> </blockquote> <p>In der Hoffnung, dass du noch mitliest: aus der folgenden Frage entnehme ich, dass du in HTML auch noch einigermaßen am Anfang stehst.</p> <p>Daher würde ich Dir nicht raten, Bootstrap zu nutzen. Das Problem: Bootstrap verspricht, dass du zu schnellen Ergebnissen kommst. Die Wahrheit ist aber, dass es Dir das Erlernen von HTML nicht abnimmt. Du musst Bootstrap (seine ganzen Klassen, was die tun und zu welchem Verhalten sie führen), also <strong>zusätzlich</strong> zu HTML lernen.</p> <p>Das Problem mit Bootstrap ist nämnlich, dass es sich „nur“ um das Aussehen einer einer Webseite kümmert.</p> <p>Das eigentliche Dokument, das in HTMl geschrieben wird, muss aber zunächst einmal ordentlich ausgezeichnet werden,. sonst erkauft man sich das hübsche Aussehen nur mit zahlreichen Nachteile. Ein paar davon sind: deine Seiten sind durch Automaten schlecht analysierbar, was unter anderem dazu führt, dass du bei Suchmaschinen so weit unten landest, dass niemand deine Seite imWeb findet, dass Deine Seite für manche Menschen unbedienbar und für alle anderen schlechter als nötig bedienbar sind.</p> <p>Bootstrap macht Deine Seite auch langsamer, vor allem wenn du nach dem Prinzip arbeitest: „Ich weiß nicht, was ich davon wirklich brauche, also nehme ich erst mal alles.“</p> <p>An Bootstrap scheiden sich die Geister und mit der neuesten Version kann man ganz ordentliche Seiten erstellen, aber: man muss dafür HTML <strong>und</strong> Botstrap recht gut kennen!</p> <p>Ich würde erst mal mit HTML beginnen. Und CSS für das Layout. Alles was Bootstrap kann, kann man auch selber umsetzen. Das zu lernen (z.B. „wie gestalte ich einen Button“ oder „wie ordne ich Elemente auf meiner Seite an“) sind jeweils überschaubare „Päckchen“. Die zu lernen bekommt jeder hin.</p> <p>Am Ende kannst du dich auch noch über eine selbst gemachte Seite freuen. Der Riesen-Vorteil bei dieser Art zu arbeiten: du weißt genau, was du getan hast und kannst Deine Seite später weiter anpassen. Man hat immer wieder neue Ideen — auch solche, die sich mit Bootstrap nicht oder nur umständlich umsetzen lassen.</p> <p>Bootstrap hat eigentlich nur einen Vorteil: es spart Menschen, die beruflich Webseiten entwicklen, eine Menge Zeit, weil es immer wiederkehrende Routine-Aufgaben abnimmt.</p> <p>Das ließe sich auch anders realisieren, aber das führt an dieser Stelle etwas zu weit…</p> <blockquote> <p>Kann mir bitte jemand sagen für was ich die Bezeichner</p> <p><code>for="inputName"</code></p> <p><code>id="inputName"</code></p> <p>verwende.</p> </blockquote> <p>Damit sorgst du dafür, dass die Bezeichnung eines Formulareldes (<code>label</code>) und das Formularfeld selber logisch miteinander verbunden werden. Das ist für viele Dinge nötig. Wenn du das korrekt verwendet hast, kann man beispielsweise auf das <code>label</code> klicken und dadurch den Fokus in das Feld setzen. Besonders praktisch, wenn das Feld eine winzige Checkbox ist. Sicher hast du dich selber auch schon mal über Seiten geärgert, wo man nciht auf „Ich habe die AGBs gelesen und akzeptiert“ klicken kann, sondern statt dessen das winzige Kästchen daneben treffen muss.</p> <p>Ein anderer toller Einsatzbereich sind Fehlermeldungen. Wenn du irgendwo auf einer Webseite eine Fehlermeldung ausgibst, kannst du diese in ein <code>label </code>mit <code>for</code>-Atrtribut packen. Wenn der Benutzer dann so etwas wie z.B. „Das Feld Nachname ist nicht korrekt ausgefüllt“ anklickt, landet er direkt im betreffenden Feld und kann seine Angaben sofort korrigieren. Das funktioniert weil die Fehlermeldung und das <code>input</code> logisch miteinander verknüpft sind und diese Verknüpfung kann von Software (z.B. der Browser) erkannt werden.</p> <blockquote> <p>Oder kann ich dies vernachlässigen.</p> </blockquote> <p>Wenn du das tust, funktionieren Deine Webseiten für viele Menschen deutlich schlechter und ist für andere gar nicht mehr bedienbar.</p> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>inputName<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-sm-2 control-label<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Name<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-sm-10<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-control<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>inputName<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><?php echo htmlentities($user['name']); ?><span class="token punctuation">"</span></span> <span class="token attr-name">required</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Bootstrap benötigt all die vielen div-elemente und klassen dafür, damit alle Möglichkeiten, die Bootstrap für die Positionierung von Beschriftung und Feld existieren auch angewendet werden können. Für ein konkretes Projekt sind (nicht immer, aber) meist viel weniger Elemente nötig.</p> <p>Bootstrap macht deine Webseite unnötig kompliziert und aufgebläht. — Es sei denn, du schmeißt wirklich konsequent alles Überflüssige raus, was leider selten gemacht wird…</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718595#m1718595 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T15:26:26Z 2018-04-05T15:26:26Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <p>Kann man, sollte man aber nicht,</p> </blockquote> <p>Was ist das für eine missglückte Formulierung?</p> <p>Was du sagen wolltest: Kann man nicht,</p> <blockquote> <p>weil [ansonsten] wichtige Funktionalität verlorengeht.</p> </blockquote> <p>Du sagst es.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718674#m1718674 marctrix self@mhis.de http://mhis.de 2018-04-06T10:25:56Z 2018-04-06T10:25:56Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej dedlfix,</p> <blockquote> <p>Kann man, sollte man aber nicht, weil damit wichtige Funktionalität verlorengeht.</p> </blockquote> <p>Sorry für die etwas länglichen Beiträge zum Thema von mir, <a href="/users/27" class="mention registered-user" rel="noopener noreferrer">@dedlfix</a></p> <p>Ich kürze die ganze Diskussion mal ab und kopiere den Betreff dieses Threads hier rein (Hervorhebung von mir):</p> <p><em>Welchen <strong>nutzen</strong> haben die Bezeichner id und for im HTML</em></p> <p>Die Frage nach dem „Nutzen“ habe ich bei der Beantwortung schlichtweg wörtlich genommen…</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718596#m1718596 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-05T15:29:42Z 2018-04-05T15:29:42Z Welchen nutzen haben die Bezeichner id und for im HTML <p>hallo</p> <blockquote> <p>Was du sagen wolltest: Kann man nicht,</p> </blockquote> <p>Nicht?</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span><span class="token punctuation">></span></span>Dies ist das Label<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>Input</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>und_ich_bin_das_assoziierte_Inputelement<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> </code></pre> <p>Der Nachteil ist, dass man damit Freiheiten im CSS verliert.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718604#m1718604 dedlfix 2018-04-05T15:42:05Z 2018-04-05T15:42:05Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <blockquote> <p>Kann man, sollte man aber nicht,</p> </blockquote> <p>Was ist das für eine missglückte Formulierung?</p> </blockquote> <p>Ist sie das? Ich finde sie völlig richtig, ich bin schließlich kein Extremist.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718602#m1718602 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T15:41:12Z 2018-04-05T15:41:12Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@beatovich</p> <blockquote> <blockquote> <p>Was du sagen wolltest: Kann man nicht,</p> </blockquote> <p>Nicht?</p> </blockquote> <p>Das hast du jetzt aber schön aus dem Zusammenhang gerissen.</p> <blockquote> <p>Der Nachteil ist, dass man damit Freiheiten im CSS verliert.</p> </blockquote> <p>Ja?</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>span</span><span class="token punctuation">></span></span>Name:<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>span</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> </code></pre> <p>vs.</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>span</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Name:<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>span</span><span class="token punctuation">></span></span> </code></pre> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718607#m1718607 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T15:47:27Z 2018-04-05T15:47:27Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <blockquote> <blockquote> <p>Kann man, sollte man aber nicht,</p> </blockquote> <p>Was ist das für eine missglückte Formulierung?</p> </blockquote> <p>Ist sie das?</p> </blockquote> <p>Ja, IMHO.</p> <blockquote> <p>Ich finde sie völlig richtig, ich bin schließlich kein Extremist.</p> </blockquote> <p>Und deshalb sagst du auch immer: Klar kann man bei der Ausgabe von Daten auf <code>htmlspecialchars()</code> verzichten, sollte man aber nicht?</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718634#m1718634 marctrix self@mhis.de http://mhis.de 2018-04-06T05:15:46Z 2018-04-06T05:15:46Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej dedlfix,</p> <blockquote> <blockquote> <blockquote> <p>Kann man, sollte man aber nicht,</p> </blockquote> <p>Was ist das für eine missglückte Formulierung?</p> </blockquote> <p>Ist sie das? Ich finde sie völlig richtig, ich bin schließlich kein Extremist.</p> </blockquote> <p><a href="/users/20" class="mention registered-user" rel="noopener noreferrer">@Gunnar Bittersmann</a> hat völlig recht. <code>label</code> gehört einem input zugeordnet (entweder per <code>for</code>-Attribut oder durch Verschachtelung). Sonst „kann“ man eine Webseite auch gleich ausschließlich aus <code>div</code> und <code>span</code> zusammenbauen.</p> <p>Es macht dann aber keinen Sinn mehr und ist auch eigentlich kein HTML mehr sondern nur noch optisch gestalteter plain text…</p> <p>Es ist auch nicht extrem, auf die Formulierung „Kann man, sollte man aber nicht“ einfach zu verzichten. </p> <p>Sag einfach, was das Attribut macht und dass die Zuordnung sonst nicht funktioniert, also die logische Zuordnung von Beschriftung und Feld kaputt ist.</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718609#m1718609 dedlfix 2018-04-05T15:50:43Z 2018-04-05T15:50:43Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>Und deshalb sagst du auch immer: Klar kann man bei der Ausgabe von Daten auf <code>htmlspecialchars()</code> verzichten, sollte man aber nicht?</p> </blockquote> <p>Sowas würde ich nie sagen, viel zu pauschal die Aussage und damit falsch. Eine Kausalität zum Thema kann ich auch nicht erkennen.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718617#m1718617 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T16:46:00Z 2018-04-05T16:46:00Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <blockquote> <p>Und deshalb sagst du auch immer: Klar kann man bei der Ausgabe von Daten auf <code>htmlspecialchars()</code> verzichten, sollte man aber nicht?</p> </blockquote> <p>Sowas würde ich nie sagen, viel zu pauschal die Aussage und damit falsch.</p> </blockquote> <p>Und wenn ich geschrieben hätte <em>„Klar kann man bei der Ausgabe von <strong>Nutzereingaben</strong> auf <code>htmlspecialchars()</code> verzichten, sollte man aber nicht?“</em>, dann wäre es wieder zu speziell gewesen?</p> <p>(Dass es sich dabei um Ausgaben per <code><?php echo … ?></code> in HTML-Code hinein handelt, sollte aus dem Kontext klar sein.)</p> <blockquote> <p>Eine Kausalität zum Thema kann ich auch nicht erkennen.</p> </blockquote> <p>Schade.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718612#m1718612 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T16:20:09Z 2018-04-05T16:20:09Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@beatovich</p> <blockquote> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Hier wäre doch eventuell ein <fieldset> richtig?</p> </blockquote> <p>Nicht wirklich. Ein <code>fieldset</code> gruppiert mehrere zusammengehörende Eingabeelemente. Ein <code>fieldset</code> um ein Eingabeelement ist nutzlos, eher schädlich.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718613#m1718613 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-05T16:29:50Z 2018-04-05T16:29:50Z Welchen nutzen haben die Bezeichner id und for im HTML <p>hallo</p> <blockquote> <blockquote> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Hier wäre doch eventuell ein <fieldset> richtig?</p> </blockquote> <p>Nicht wirklich. Ein <code>fieldset</code> gruppiert mehrere zusammengehörende Eingabeelemente. Ein <code>fieldset</code> um ein Eingabeelement ist nutzlos, eher schädlich.</p> </blockquote> <p>Und welchen Schaden bringt ein fieldset hier, der ein div-Element nicht mitbringt?</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718614#m1718614 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T16:34:14Z 2018-04-05T16:34:14Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@beatovich</p> <blockquote> <blockquote> <p>Nicht wirklich. Ein <code>fieldset</code> gruppiert mehrere zusammengehörende Eingabeelemente. Ein <code>fieldset</code> um ein Eingabeelement ist nutzlos, eher schädlich.</p> </blockquote> <p>Und welchen Schaden bringt ein fieldset hier, der ein div-Element nicht mitbringt?</p> </blockquote> <p>AFAIK lesen (manche?) Screenreader bei jedem Eingabefeld eines <code>fieldset</code>s dessen <code>legend</code> nochmal mit vor.</p> <p>Achso, du wolltest gar kein <code>legend</code>-Element? Hm, ich glaube, <code>fieldset</code> ohne <code>legend</code> macht generell wenig Sinn.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718643#m1718643 marctrix self@mhis.de http://mhis.de 2018-04-06T07:20:55Z 2018-04-06T07:20:55Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej beatovich,</p> <blockquote> <blockquote> <blockquote> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Hier wäre doch eventuell ein <fieldset> richtig?</p> </blockquote> <p>Nicht wirklich. Ein <code>fieldset</code> gruppiert mehrere zusammengehörende Eingabeelemente. Ein <code>fieldset</code> um ein Eingabeelement ist nutzlos, eher schädlich.</p> </blockquote> <p>Und welchen Schaden bringt ein fieldset hier, der ein div-Element nicht mitbringt?</p> </blockquote> <p>Vermutlich soll ein Element mit der Klasse <code>form-group</code> tatsächlich etwas gruppieren — was bedeutet, das es hier fehl am Platze ist.</p> <p>Bootstrap muss eben auch erlernt und nicht einfach nur in das eigene Projekt hineinkopiert werden.</p> <p>Zuum Nachteil falsch verwendeter HTML-Elemente: diese bringen ja nun mal eine Logik mit, die bei falscher Verwendung Verwirrung stiftet. Für <code>fieldset</code> ist das beispielsweise die implizite Rolle <code>group</code>. Was will mir der Seitenanbieter denn mitteilen, wenn er behauptet, dass Gruppen existieren,die ich nicht erkenne? — Sicher habe ich dann etwas übersehen. Oder nicht?</p> <p>Diese Fragen drängen sich unwillkürlich auf und ein Benutzer kann sich dagegen nicht wehren. Bis er es aufgibt, diese Fragen zu klären, hast du ihm schlicht Lebenszeit geklaut, die er mit etwas angenehmeren hätte verbringen können.</p> <p>Was den Schaden betrifft: Als jemand, dem es wichtig ist, über die eigene Zeit selbstbestimmt zu entscheiden würde ich schon das Gefühl haben, geschädigt worden zu sein durch die Unachtsamkeit eines anderen. Nach dieser Diskussion weißt du sogar, was passiert, wenn man falsch auszeichnet und ich finde es dann schon mindestens grob fahrlässig, wenn nicht sogar vorsätzlich, dass du meine Zeit und die von hunderten und tausenden anderen verplemperst, je nachdem wie gut deine Seite läuft.</p> <p>Es mögen nur Sekunden oder maximnal Minuten sein. Aber die Laune ist hin und das in der Summe aller Besucher ist dann eine ungeheure Verschwendung. Wenn der Grund schlicht Gleichgültigkeit oder gar Bequemlichkeit ist, fände ich das extrem egoistisch.</p> <p>Wobei es ja einfacher wäre kein <code>fieldset</code> zu schreiben, statt es dort zu verwenden, wo es nicht benötigt ist. Also warum überhaupt diese Diskussion? </p> <p>Marc</p> <p>PS: Wenn es denn ein <code>div</code> mit der Klasse <code>form-group</code> sein soll, sollte dann auch <code>role="group"</code> mitgegeben werden. Browser machen seltsame Dinge mit <code>fieldset</code> und <code>legend</code>. Dann muss man statt <code>legend</code> aber auch eine Überschrift verwenden, bitte…</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718616#m1718616 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-05T16:39:07Z 2018-04-05T16:39:07Z Welchen nutzen haben die Bezeichner id und for im HTML <p>hallo</p> <blockquote> <p>Achso, du wolltest gar kein <code>legend</code>-Element? Hm, ich glaube, <code>fieldset</code> ohne <code>legend</code> macht generell wenig Sinn.</p> </blockquote> <p>In html5 ist legend Pflicht, auch wenn's anderswo noch als optional gilt.</p> <p>Aber dein Argument ist eigentlich kein Argument, fieldset nur beim Gruppieren mehrerer Elemente zu verwenden, sondern ein Argument, es gar nicht zu verwenden. Ich weiss, nicht, ob ich das Verhalten von Screenreadern hier berücksichtigen würde.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718619#m1718619 dedlfix 2018-04-05T17:17:15Z 2018-04-05T17:17:15Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>@@dedlfix</p> <blockquote> <blockquote> <p>Und deshalb sagst du auch immer: Klar kann man bei der Ausgabe von Daten auf <code>htmlspecialchars()</code> verzichten, sollte man aber nicht?</p> </blockquote> <p>Sowas würde ich nie sagen, viel zu pauschal die Aussage und damit falsch.</p> </blockquote> <p>Und wenn ich geschrieben hätte <em>„Klar kann man bei der Ausgabe von <strong>Nutzereingaben</strong> auf <code>htmlspecialchars()</code> verzichten, sollte man aber nicht?“</em>, dann wäre es wieder zu speziell gewesen?</p> </blockquote> <p>Sie ist weiterhin zu pauschal und falsch.</p> <blockquote> <p>(Dass es sich dabei um Ausgaben per <code><?php echo … ?></code> in HTML-Code hinein handelt, sollte aus dem Kontext klar sein.)</p> </blockquote> <p>Egal, du wolltest auf etwas anderes raus, aber auch den Schuh zieh ich mir nicht an.</p> <blockquote> <blockquote> <p>Eine Kausalität zum Thema kann ich auch nicht erkennen.</p> </blockquote> <p>Schade.</p> </blockquote> <p>Warum sollte meine Meinung zum Thema X einen Zusammenhang zu meiner Meinung zum Thema Y haben? Und warum sollten meine Meinungen absolut und pauschalisiert und ohne Beachtung der jeweiligen Umstände sein?</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718621#m1718621 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T17:35:05Z 2018-04-05T17:35:05Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <p>Warum sollte meine Meinung zum Thema X einen Zusammenhang zu meiner Meinung zum Thema Y haben?</p> </blockquote> <p>Es ging hier wohl nicht um Meinungen zu verschiedenen Themen, sondern um eine Formulierung.</p> <p>Oder bist du der Meinung, Sicherheit einer Webanwendung ist Pflicht, Benutztbarkeit einer Webanwendung aber optional?</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718623#m1718623 dedlfix 2018-04-05T17:54:30Z 2018-04-05T17:54:30Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <blockquote> <p>Warum sollte meine Meinung zum Thema X einen Zusammenhang zu meiner Meinung zum Thema Y haben?</p> </blockquote> <p>Es ging hier wohl nicht um Meinungen zu verschiedenen Themen, sondern um eine Formulierung.</p> </blockquote> <p>Und was habe ich da formuliert, eine Meinung oder vielleicht ein Gedicht?</p> <blockquote> <p>Oder bist du der Meinung, Sicherheit einer Webanwendung ist Pflicht, Benutztbarkeit einer Webanwendung aber optional?</p> </blockquote> <p>Sagtest du nicht gerade, es geht hier nicht um Meinungen? Jetzt also doch wieder? Außerdem versuchst du hier grad wieder meine Meinung zu pauschalisieren.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718624#m1718624 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T18:23:30Z 2018-04-05T18:23:30Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <blockquote> <p>Oder bist du der Meinung, Sicherheit einer Webanwendung ist Pflicht, Benutztbarkeit einer Webanwendung aber optional?</p> </blockquote> <p>Außerdem versuchst du hier grad wieder meine Meinung zu pauschalisieren.</p> </blockquote> <p>„Ich pauschalisiere nie.“</p> <p>Außerdem hättest du auch einfach meine Frage beantworten können.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718625#m1718625 dedlfix 2018-04-05T18:39:43Z 2018-04-05T18:39:43Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>Außerdem hättest du auch einfach meine Frage beantworten können.</p> </blockquote> <p>Hätte ich tun können, wollte ich aber nicht. War mir zu provokant, und die beiden Themen sind für mich nicht gegeneinander aufwiegbar.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718626#m1718626 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-05T18:45:06Z 2018-04-05T18:45:06Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <p>und die beiden Themen sind für mich nicht gegeneinander aufwiegbar.</p> </blockquote> <p>Für mich auch nicht. Sowohl Sicherheit als auch Benutztbarkeit sind Pflicht.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718635#m1718635 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-06T05:29:05Z 2018-04-06T06:37:13Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@marctrix</p> <blockquote> <p>Es ist auch nicht extrem, auf die Formulierung „Kann man, sollte man aber nicht“ einfach zu verzichten. </p> </blockquote> <p>Oder so zu formulieren, dass deutlich wird, wie’s gemeint ist: „Kann man machen, ist dann aber halt Kacke.“</p> <p>Aber das ist wohl auch schon wieder zu extrem‽</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718658#m1718658 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-06T09:19:55Z 2018-04-06T09:22:34Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@marctrix</p> <blockquote> <p>Das Problem mit Bootstrap ist nämnlich, dass es sich „nur“ um das Aussehen einer einer Webseite kümmert.</p> </blockquote> <p>Bei aller Abscheu, die ich gegenüber Bootstrap emfinde: nein, das stimmt so nicht.</p> <p>Bootstrap kümmert sich <em>auch</em> um das Aussehen einer Webseite. Es bringt bspw. ein „Grid“-System mit sich (das in der aktuellen 4er Version auf Flexbox und unzähligen <em lang="en">media queries</em> basiert), welches heute niemand mehr braucht.</p> <p>Bootstrap bringt aber auch Komponenten mit – und diese weitgehend barrierefrei (in der aktuellen 4er Version, von veraltetem Kram davor wollen wir nicht sprechen). Vermutlich besser, als es jemand ohne Kenntnisse von HTML und ARIA hinbekommen würde.</p> <p>Bspw. ein <a href="https://getbootstrap.com/docs/4.0/components/navbar/#nav" rel="nofollow noopener noreferrer">Drop-Down-Menü</a>, das auch tatsächlich halbwegs benutzbar zu sein scheint. Nur dass dort falsch <code class="language-html bad"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></code> anstatt <code class="language-html good"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span><span class="token punctuation">></span></span></code> verwendet wird.</p> <blockquote> <p>Bootstrap hat eigentlich nur einen Vorteil: es spart Menschen, die beruflich Webseiten entwicklen, eine Menge Zeit, weil es immer wiederkehrende Routine-Aufgaben abnimmt.</p> </blockquote> <p>Das kann ich ich überhaupt nicht bestätigen.</p> <p>Im Gegenteil: Bootstrap macht Webentwicklung deutlich zeitaufwändiger, weil man vor lauter <code>div</code>s im Markup kaum noch Überblick hat und weil man sich um die ganzen präsentationsbezogenen Klassen im Markup kümmern muss, anstatt das Aussehen in ein paar Zeilen CSS anzugeben.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718652#m1718652 dedlfix 2018-04-06T08:27:18Z 2018-04-06T08:27:18Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <blockquote> <blockquote> <blockquote> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Hier wäre doch eventuell ein <fieldset> richtig?</p> </blockquote> <p>Nicht wirklich. Ein <code>fieldset</code> gruppiert mehrere zusammengehörende Eingabeelemente. Ein <code>fieldset</code> um ein Eingabeelement ist nutzlos, eher schädlich.</p> </blockquote> <p>Und welchen Schaden bringt ein fieldset hier, der ein div-Element nicht mitbringt?</p> </blockquote> <p>Vermutlich soll ein Element mit der Klasse <code>form-group</code> tatsächlich etwas gruppieren — was bedeutet, das es hier fehl am Platze ist.</p> </blockquote> <p>Bezieht sich das "es" auf das div oder das fieldset?</p> <p>Jedenfalls sollte man etwas kennen, bevor mal darüber urteilt, sonst ist die ganze schöne Argumentation hinfällig, weil sie vom Ziel als nicht besonders glaubwürdig und vertane Zeit das zu lesen eingestuft wird. Auf Tools herumzuhacken bringt den Probleminhaber nicht weiter und sorgt auch nicht unbedingt für die nötige Motivation.</p> <p>Mein Anliegen ist es, dem Probleminhaber nicht von oben herab Vorschriften zu machen, sondern ihn da abzuholen, wo er ist und ihn mitzunehmen. Dazu fand ich, dass "kann man, sollte man aber nicht" ein guter Einstieg auf die Frage nach dem "kann man …?" ist. Mehr sollte es gar nicht sein, und die eigentliche Aussage folgte auf dem Fuße. Ebenso eine Überreaktionen aufgrund dieser einleitenden Formulierung. Es gibt kein Gesetz, dass ein Input ein Label braucht, und deshalb erläutere ich das anhand der Vorteile, weil ich darauf hoffe, dass der Leser es nun aufgrund von Verständnis für die Arbeitsweise und die Folgen einsetzt und nicht nur als unumstößliche Vorschrift.</p> <p>Zurück zum Thema. Die form-group gruppiert alle Elemente, die zu einem Formularelement gehören. Das betrifft nicht nur Label und Input sondern auch alle Elemente, die Hilfetexte oder Fehlermeldungen dafür beinhalten. Semantisch gesehen bilden diese Elemente eine Komponente. Komponenten sind auch kein unbekanntes Konzept mehr, wenn es darum geht, Anwendungen für das Web zu erstellen, wozu ich auch einfache Formulare zähle.</p> <blockquote> <p>Zuum Nachteil falsch verwendeter HTML-Elemente: diese bringen ja nun mal eine Logik mit, die bei falscher Verwendung Verwirrung stiftet. Für <code>fieldset</code> ist das beispielsweise die implizite Rolle <code>group</code>. Was will mir der Seitenanbieter denn mitteilen, wenn er behauptet, dass Gruppen existieren,die ich nicht erkenne? — Sicher habe ich dann etwas übersehen. Oder nicht?</p> </blockquote> <blockquote> <p>Diese Fragen drängen sich unwillkürlich auf und ein Benutzer kann sich dagegen nicht wehren. Bis er es aufgibt, diese Fragen zu klären, hast du ihm schlicht Lebenszeit geklaut, die er mit etwas angenehmeren hätte verbringen können.</p> </blockquote> <p>Ich kann dieser Argumentation nicht so richtig folgen, denn ich kenne niemanden, der eine Website nutzen möchte und sich dazu die Semantik der verwendeten Elemente anschaut und sich daraufhin die Frage nach dem Sinn des Lebens stellt. Screenreader-Benutzer habe ich noch nicht kennengelernt, aber auch da vermute ich Menschen, die nicht gleich in Depression verfallen, nur weil die Semantik der Elemente ihren Screenreadern eine Herausforderung gibt. (Und nein, das soll keine Aufforderung sein, ihnen das Leben absichtlich zu erschweren. Das muss ich leider dazusagen, weil sonst gleich wieder das negativst mögliche hinzuinterpretiert und mir vorgeworfen wird.)</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718655#m1718655 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-06T08:49:22Z 2018-04-06T10:12:57Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <p>Es gibt kein Gesetz, dass ein Input ein Label braucht</p> </blockquote> <p>Das ist falsch.</p> <p>In den USA gilt <a href="https://en.wikipedia.org/wiki/Section_508_Amendment_to_the_Rehabilitation_Act_of_1973" lang="en" rel="nofollow noopener noreferrer">Section 508 Amendment to the Rehabilitation Act of 1973</a>. Zumindest für Bundesbehörden, aber AFAIK müssen auch kommerzielle Anbieter ihre Webangebote barrierefrei machen.</p> <p><em lang="en">“In Norway, all websites are required to be accessible.”</em> (Quelle: <a href="https://twitter.com/CSSconfeu/status/981829472386207744" rel="nofollow noopener noreferrer">@CSSconfeu</a>)</p> <p>Deutschland hinkt da hinterher, aber zumindest gilt die <a href="https://de.wikipedia.org/wiki/Barrierefreie-Informationstechnik-Verordnung" rel="nofollow noopener noreferrer">BITV (Barrierefreie-Informationstechnik-Verordnung)</a> für Behörden der Bundesverwaltung.</p> <blockquote> <p>weil ich darauf hoffe, dass der Leser es nun aufgrund von Verständnis für die Arbeitsweise und die Folgen einsetzt und nicht nur als unumstößliche Vorschrift.</p> </blockquote> <p>Da ist was dran. Man sollte seine Webangebote barrierefrei machen aus dem Selbstverständnis, niemanden auszuschließen, nicht aufgrund der Furcht vor Strafen. Hier gilt dasselbe wie <a href="https://forum.selfhtml.org/self/2018/apr/5/spracheinstellung-in-browser-webseite-usw/1718600#m1718600" rel="noopener noreferrer">dort</a>: Wenn du die Gefahr einer Abmahnung als Begründung anführst, sagst du, dass dir <em>dein</em> Wohl wichtig ist, das Wohl der <em>Nutzer</em> deiner Seiten aber scheißegal ist.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718659#m1718659 marctrix self@mhis.de http://mhis.de 2018-04-06T09:27:35Z 2018-04-06T09:30:07Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej dedlfix,</p> <blockquote> <blockquote> <p>Vermutlich soll ein Element mit der Klasse <code>form-group</code> tatsächlich etwas gruppieren — was bedeutet, das es hier fehl am Platze ist.</p> </blockquote> <p>Bezieht sich das "es" auf das div oder das fieldset?</p> </blockquote> <p>Auf die Klasse, falls sie denn etwas gruppieren soll. Aber du hast recht. In der Regel möchte man sicherlich <code>label</code> und <code>input</code> gruppieren und dann ist das tatsächlich genau der richtige Weg.</p> <p>Diese Möglichkeit hatte ich nicht bedacht. Das war an dieser Stelle ein ziemlich doofer Denkfehler.</p> <p>Danke für die Aufklärung!</p> <p>Da wir hier beim auseinanderklamüsern von Formulierungen sind: Mit dem Wörtchen "Vermutlich" habe ich meine Spekulation kenntlich gemacht. Gut, dass du es beim Zitieren nicht weggelassen hast; schade, dass du es bei Deinem Widerspruch nciht berücksichtigt, hast. Hier hätte ich eine Formulierung glücklicher gefunden wie: „<a href="/users/821" class="mention registered-user" rel="noopener noreferrer">@marctrix</a> , du liegst mit Deiner Vermutung richtig, allerdings werden hier nicht zusamenghörige Felder gruppiert, sondern alles, was zu einem Feld dazu gehört, das können Dinge wie <code>label</code>, eine Fehlerbeschreibung u.a.m. sein. Eine semantische Gruppierung mittels <code>fieldset</code> oder <code>role="group"</code> wäre hier fehl am Platz.“</p> <p>Hätte ich persönlich konstruktiver gefunden und weniger „von oben herab“…</p> <blockquote> <p>Jedenfalls sollte man etwas kennen, bevor mal darüber urteilt,</p> </blockquote> <p>Ja, aber man kann nicht verlangen Bootstrap oder Atomphysik bis ins letzte Detail zu kennen, wenn man es ablehnen möchte.</p> <p>Sonst gäbe es ja eine Pflicht für jedermann Atombomben zu mögen…</p> <p>Man darf etwas durchaus nicht mögen <strong>und</strong> ablehnen, ohne <strong>alles</strong> darüber zu wissen. Ich habe mit Bootstrap durchaus gearbeitet und kenne es leidlich und finde es trotzdem schrecklich. Aber nicht so ein beleidigtes "find-ich-doof-will-ich-mich-nicht-mit-beschäftigen"-schrecklich. Mehr so ein "habe-ich-mir-angesehen-macht-mir-aber-alles-kaputt"-schrecklich.</p> <p>Es widerspricht den für mich geltenden grundlegendsten Design-Prinzipien wie:</p> <ul> <li>beschäftige dich mit etwas, bevor du es verwendest (müsste nicht so sein, wird aber häufig so verwendet)</li> <li>Trennung von Layout und Inhalt</li> <li>Benutzbarkeit für <strong>alle</strong> — gerade für diejenigen, die am stärksten vom Web profitieren</li> </ul> <p>usw…</p> <blockquote> <p>Es gibt kein Gesetz, dass ein Input ein Label braucht</p> </blockquote> <p>Aber eine Verordnung (https://de.wikipedia.org/wiki/Barrierefreie-Informationstechnik-Verordnung) und eine EU-Richtlinie (https://ec.europa.eu/transparency/regdoc/rep/1/2015/DE/1-2015-615-DE-F1-1.PDF — sorry mein Firefox hat mir die Buttons über der Textarea geklaut), die in nationales Recht umzustezen sein wird (und beispielsweise in Österreich schon umgesetzt wurde. Dort müssen im B2B-Bereich erstellte Webseiten grundsätzlich WCAG-konform sein), wenn du schon Korinthen kacken möchtest… </p> <blockquote> <p>Auf Tools herumzuhacken bringt den Probleminhaber nicht weiter und sorgt auch nicht unbedingt für die nötige Motivation.</p> </blockquote> <p>Auf welchen Tools hacke ich denn rum?</p> <p>Meine Abneigung gegen Bootstrap ist gut begründet. Wenn ich etwas schlecht finde und die Gründe dafür angebe, hat das mit rumhacken wohl nichts zu tun.</p> <p>Ich lehne ja auch Atombomben nicht ohne Grund ab. Und wenn ich damit die Motivation verderbe, bootstrap oder Atombomben zu verwenden: gut!</p> <p>Dass ich Atombomben und bootstrap immer wieder in einem Atemzug nenne, finde ich amüsant. Hätte gar nicht gedacht, dass sich der Vergleich so treffend so lange durchziehen lässt. </p> <p>Aber witzig ist nicht Provokation. wenn ich dich provozieren will, mache ich das dann schon unmissverständlich. Insofern: no pun intended!</p> <p>Bisschen Humor verträgt die Diskussion hoffentlich…</p> <p>Noch etwas zu bootstrap: ich lehne es (überraschend für dich?) übrigens nciht vollständig ab. Es ist ein prima Tool für rapid prototyping, insbesondere wenn man Bootstrap Studio verwendet. Habe ich gekauft und in Verwendung!</p> <p>Ich würde es nur niemals produktiv einsetzen, es sei denn, ich werde von einem Auftraggeber gezwungen. Man muss sich halt anpassen und das ganze Leben ist ein Kompromiss.</p> <p><strong>Alle</strong> Projekte, bei denen ich es produktiv im Einsatz gesehen habe würde ich übrigens als "quick & dirty" bezeichnen. Was eigentlich gar nicht Bootstrap selber anzulasten ist, sondern den Anwendern. Aber die Krux liegt in der scheinbaren Leichtigkeit, mit der sich Projekte umsetzen lassen. Lassen sie sich aber nicht. Nur wenn man es nciht ordentlich macht. Denn quick & dirty kostet nie viel Zeit. Geht auch ohne bootstrap schnell, wie der Name schon sagt…</p> <p>Leider gilt das auch für viele andere Tools, die oft nur eingesetzt werden, um den <strong>Entwicklern</strong> die Arbeit zu erleichtern. Damit die nicht <strong>einmal</strong> nachdenken müssen, müssen hunderte oder tausende von Nutzern immer und immer wieder mit schlecht durchdachten Webseiten arbeiten.</p> <blockquote> <p>Mein Anliegen ist es, dem Probleminhaber nicht von oben herab Vorschriften zu machen, sondern ihn da abzuholen, wo er ist und ihn mitzunehmen. Dazu fand ich, dass "kann man, sollte man aber nicht" ein guter Einstieg auf die Frage nach dem "kann man …?" ist.</p> </blockquote> <p>Ich fand es nicht gelungen und habe daher einen anderen Ansatz gewählt. Mag sein, dass du Deinen Ansatz für den einzig richtigen hältst. Ich halte meinen nicht für den einzig richtigen, aber im direkten Vergleich für den besseren und habe den daher auch umgesetzt und deinem Entwurf als Alternative zur Seite gestellt.</p> <p>Unterschiedliche Meinungen zu einem Thema zu hören — finde ich — bringt einen Anfänger weiter, als der Irrglaube, es gäbe den einzig richtigen Weg. Mag er selber die Argumente von Dir und mir gegeneinander abwägen und sich <strong>eine eigene Meinung</strong> bilden…</p> <p>Auch ist die Provokation nicht von mir ausgegangen.</p> <p>Insofern verstehe ich nicht, warum du dich von mir so angegriffen fühlst.</p> <blockquote> <p>Zurück zum Thema. Die form-group gruppiert alle Elemente, die zu einem Formularelement gehören.</p> </blockquote> <p>Danke für die Aufklärung!</p> <blockquote> <blockquote> <p>Zuum Nachteil falsch verwendeter HTML-Elemente: diese bringen ja nun mal eine Logik mit, die bei falscher Verwendung Verwirrung stiftet. Für <code>fieldset</code> ist das beispielsweise die implizite Rolle <code>group</code>. Was will mir der Seitenanbieter denn mitteilen, wenn er behauptet, dass Gruppen existieren,die ich nicht erkenne? — Sicher habe ich dann etwas übersehen. Oder nicht?</p> </blockquote> <blockquote> <p>Diese Fragen drängen sich unwillkürlich auf und ein Benutzer kann sich dagegen nicht wehren. Bis er es aufgibt, diese Fragen zu klären, hast du ihm schlicht Lebenszeit geklaut, die er mit etwas angenehmeren hätte verbringen können.</p> </blockquote> <p>Ich kann dieser Argumentation nicht so richtig folgen, denn ich kenne niemanden, der eine Website nutzen möchte und sich dazu die Semantik der verwendeten Elemente anschaut</p> </blockquote> <p>Ich auch nicht. Ich kenne aber Menschen, die einen Screenreader nutzen und denen das deshalb automatisch ausgegeben wird.</p> <p>Offenbar ist dein Bekanntenkreis deutlich homogener als meiner. Darum hör doch ruhig mal zu, was Menschen mit einem anderen Hintergrund wahrnehmen und berichten.</p> <blockquote> <p>und sich daraufhin die Frage nach dem Sinn des Lebens stellt.</p> </blockquote> <p>Ziemlich provokante Formulierung für jemanden der selbst bei jedem Anlass in die Luft geht! </p> <p>Aber egal. Kannst du mit mir ruhig machen, ich kann das ab. So leicht lass ich mich nicht aus der Ruhe bringen…</p> <p>Nur wenn dir das selber passiert, solltest du vielleicht auch ein bisschen mehr Gelassenheit an den Tag legen, wenn andere dasselbe Stilmittel verwenden. </p> <blockquote> <p>Screenreader-Benutzer habe ich noch nicht kennengelernt, aber auch da vermute ich Menschen, die nicht gleich in Depression verfallen, nur weil die Semantik der Elemente ihren Screenreadern eine Herausforderung gibt. (Und nein, das soll keine Aufforderung sein, ihnen das Leben absichtlich zu erschweren. Das muss ich leider dazusagen, weil sonst gleich wieder das negativst mögliche hinzuinterpretiert und mir vorgeworfen wird.)</p> </blockquote> <p>Nein, jedenfalls nicht von mir. Überhaupt werfe ich selten jemandem etwas vor. Jetzt wüsste ich nur noch gerne, wo du was in meinem Posting von „Depressionen“ gelesen hast, dann können wir das auch beenden. — Oder höre ich da wieder eine klitzekleine, leicht provokante Übertreibung raus? </p> <p>Insofern: immer entspannt bleiben. Wir wollen doch alle nur helfen und wenn wir andere Wege für sinnvoll halten, muss man die doch nicht jedesmal komplett durchdiskutieren.</p> <p>Die kann man doch einfach auch mal nebeneinander stehen lassen: die Argumente eines Bootstrap-Enthusiasten und die eines Bootstrap-Skeptikers.</p> <p>Kann für Mitlesende nur von Vorteil sein!</p> <p>Übrigens meine ich immer noch, ein paar schöne Beispiele <strong>für</strong> den Nutzen des Attributes <code>for</code> gefunden zu haben.</p> <p>Schade, dass ich dich auf der sachlichen Ebene nicht von den Vorteilen einer bestmöglichen Auszeichnung überzeugen konnte - ich werde mir in Zukunft mehr Mühe geben…</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718657#m1718657 dedlfix 2018-04-06T09:10:12Z 2018-04-06T09:10:12Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <blockquote> <p>Es gibt kein Gesetz, dass ein Input ein Label braucht</p> </blockquote> <p>Das ist falsch.</p> <p>In den USA gilt <a href="https://en.wikipedia.org/wiki/Section_508_Amendment_to_the_Rehabilitation_Act_of_1973" lang="en" rel="nofollow noopener noreferrer">Section 508 Amendment to the Rehabilitation Act of 1973</a>. Zumindest für Bundesbehörden, aber AFAIK müssen auch kommerzielle Anbieter ihre Webangebote barrierefrei machen.</p> <p><em lang="en">“In Norway, all websites are required to be accessible.”</em> (Quelle: <a href="https://twitter.com/CSSconfeu/status/981829472386207744" rel="nofollow noopener noreferrer">@CSSconfeu</a>)</p> </blockquote> <p>Ach, da steht drin, dass ein Input ein Label braucht und man nicht auch auf andere Weise die Zugänglichkeit sicherstellen kann? Das wäre jedenfalls für ein Gesetz außerordentlich spezifisch.</p> <p>Mir ist schon klar, dass Label die wohl einfachste Möglichkeit ist, das zu erreichen. Aber wenn der Kontext die Bedienung unterstützt wird wohl dem Gesetz auch Genüge getan sein.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718661#m1718661 marctrix self@mhis.de http://mhis.de 2018-04-06T09:36:30Z 2018-04-06T09:36:30Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej dedlfix,</p> <blockquote> <p>Mir ist schon klar, dass Label die wohl einfachste Möglichkeit ist, das zu erreichen. Aber wenn der Kontext die Bedienung unterstützt wird wohl dem Gesetz auch Genüge getan sein.</p> </blockquote> <p>Die Umsetzung muss WCAG-konform sein…</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718665#m1718665 marctrix self@mhis.de http://mhis.de 2018-04-06T09:56:50Z 2018-04-06T09:56:50Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> </blockquote> <blockquote> <p>Bootstrap bringt aber auch Komponenten mit – und diese weitgehend barrierefrei (in der aktuellen 4er Version, von veraltetem Kram davor wollen wir nicht sprechen). Vermutlich besser, als es jemand ohne Kenntnisse von HTML und ARIA hinbekommen würde.</p> </blockquote> <p>Mit dieser Einschränkung stimmt es weitestgehend. Daher schrieb ich ja auch, man kann es <strong>zusätzlich</strong> zu HTML gerne <strong>lernen</strong>.</p> <p>Muss man dann aber auch, statt einfach nur Beispiele voller <code>div</code>s zusammen zu kopieren.</p> <blockquote> <blockquote> <p>Bootstrap hat eigentlich nur einen Vorteil: es spart Menschen, die beruflich Webseiten entwicklen, eine Menge Zeit, weil es immer wiederkehrende Routine-Aufgaben abnimmt.</p> </blockquote> <p>Das kann ich ich überhaupt nicht bestätigen.</p> </blockquote> <p>Das sagen die Befürworter <strong>mit denen ich zusammen arbeiten musste</strong> aber immer wieder: „<em>Das gibt es doch schon fertig in Bootstrap. Musst du nur noch die Größe anpassen, die Farbe, die Schriftarten und die Rahmen. Dann machst du einfach noch Schatten dazu und die Abstände weg und schon bist du fertig.</em>“ </p> <p>Das wird dann oft gemacht, indem eine projekt.css hinzugefügt wird, in der Bootstrap-Angaben überschrieben werden.</p> <p>Dann kommt die Designerin mit einem andere Layout und man beginnt damit, mal eben schnell die eigenen CSS-Angaben wieder zu überschreiben. Wofür heißt es denn sonst <strong>Cascading</strong> Style Sheet </p> <p>Und im HTML weit und breit nur <code>div</code>s — selbst in Projekten wo das Geld für einen Menschen vorhanden sein müsste, der saubere Auszeichnung kann; Projekte mit hunderttausenden von Besuchern, die auf der Boostrap-Seite stolz als Referenzen präsentiert werden. Schade, dass da nirgends erwähnt wird, dass man Bootstrap <strong>so</strong> nicht verwenden sollte. Die ganzen präsentationsbezogenen Klassen würden ja (wenn man es schon übers Herz bringt, die zu verwenden) auch in sauber ausgezeichnetem HTML funktionieren…</p> <p>Sagen wir mal so: es erspart es, sich mit den Details von CSS auseinader zu setzen…</p> <p>Das scheint mir bei den Projekten, an denen ich mitgewirkt habe, jedenfalls die Triebfeder zu sein: man muss CSS weder beherrschen, noch sich um Neuerungen kümmern.</p> <p>Dabei halte ich persönlich das natürlich für eine ungute Herangehensweise.</p> <p>Langfristig <strong>kostet</strong> das sicher Zeit und für qualitativ sinnvoll erachte <strong>ich</strong> das auch nicht.</p> <p>Dazu müsste man aber zwei Frontender beschäftigen (wegen der Vertretungsfunktion), würde dafür dann Ressourcen bei den Programmierern frei bekommen. Ab 10 bis 12 Entwicklern sicher sinnvoll (ein Frontender auf 5-6 Programmierer). Sieht aber kein Agentur-Inhaber so…</p> <p>Ist schon eine verrückte Welt… </p> <blockquote> <p>Im Gegenteil: Bootstrap macht Webentwicklung deutlich zeitaufwändiger, weil man vor lauter <code>div</code>s im Markup kaum noch Überblick hat und weil man sich um die ganzen präsentationsbezogenen Klassen im Markup kümmern muss, anstatt das Aussehen in ein paar Zeilen CSS anzugeben.</p> </blockquote> <p>Wenn man CSS beherrscht, stimmt das… </p> <p>Daher riet ich ja auch von Anfang dazu, nicht immer gleich „alles“ können zu wollen, sondern die Lern-Häppchen in appetitlichen Brocken zu servieren: Buttons, ein erstes, konkretes Seitenlayout, usw…</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718666#m1718666 marctrix self@mhis.de http://mhis.de 2018-04-06T10:02:14Z 2018-04-06T10:03:08Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <p>Das Problem mit Bootstrap ist nämnlich, dass es sich „nur“ um das Aussehen einer einer Webseite kümmert.</p> </blockquote> <p>Bei aller Abscheu, die ich gegenüber Bootstrap emfinde: nein, das stimmt so nicht.</p> </blockquote> <p>Ja, es müsste ungefähr so heißen:</p> <p><em>Das Problem mit Bootstrap ist nämlich, dass es sich „nur“ um das Aussehen <strong>und Verhalten</strong> einer einer Webseite kümmert.</em></p> <p>Was eich eigentlich sagen wollte: nicht um die semantisch korrekte Strukturierung.</p> <p>Es ging mir letztendlich um die <em>sepraration of concerns</em>. Es käme mir aber albern vor, diesen Begriff in einem Atemzug mit Bootstrap namentlich zu erwähnen… </p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718741#m1718741 dedlfix 2018-04-06T19:21:07Z 2018-04-06T19:21:07Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <blockquote> <p>Auf Tools herumzuhacken bringt den Probleminhaber nicht weiter und sorgt auch nicht unbedingt für die nötige Motivation.</p> </blockquote> <p>Auf welchen Tools hacke ich denn rum?</p> <p>Meine Abneigung gegen Bootstrap ist gut begründet. Wenn ich etwas schlecht finde und die Gründe dafür angebe, hat das mit rumhacken wohl nichts zu tun.</p> </blockquote> <p>Die Aussage war allgemein gehalten und ohne persönliche Ansprache. Wir führen ja hier nicht nur ein Unter-Vier-Augengespräch, weswegen ich auch die anderen Mitleser im Sinn habe.</p> <blockquote> <p>Ich lehne ja auch Atombomben nicht ohne Grund ab. Und wenn ich damit die Motivation verderbe, bootstrap oder Atombomben zu verwenden: gut!</p> </blockquote> <p>Es ging mir um die Motiavation, sich auf Argumente einzulassen.</p> <blockquote> <p><strong>Alle</strong> Projekte, bei denen ich es produktiv im Einsatz gesehen habe würde ich übrigens als "quick & dirty" bezeichnen. Was eigentlich gar nicht Bootstrap selber anzulasten ist, sondern den Anwendern.</p> </blockquote> <p>Und warum ist dann Bootstrap die Zielscheibe und nicht nur diese speziellen Anwender? Ich finde es zum Beispiel für meine Belange gerade "quick und trotzdem nicht dirty".</p> <p>Solche Generalschelte ist so altbekant wie langweilig und ich kann sie deshalb genausowenig ernst nehmen wie ähnliche Schelte an PHP, die Sprache sei totaler Mist, nur weil es Anwender gibt, die damit nicht eingermaßen ordentlich programmieren können.</p> <blockquote> <p>Insofern verstehe ich nicht, warum du dich von mir so angegriffen fühlst.</p> </blockquote> <p>Als angegriffen hab ich das nicht empfunden.</p> <blockquote> <p>Ziemlich provokante Formulierung für jemanden der selbst bei jedem Anlass in die Luft geht! </p> </blockquote> <p>Wie soll ich das deuten? Witzig wegen des Smileys oder doch ernst? Jedenfalls kann ich das nicht an mir erkennen. Auf alle Fälle fehlen in der Betrachtung die Anlässe, zu denen ich mich enthalte. Und es braucht schon deutlich mehr und gewichtigere Anlässe, um überhaupt in gefährliche Sphären zu kommen.</p> <p>Aber gut, wir sind hier nach wie vor mit schriftlicher Kommunikation unterwegs und da ist es nicht so einfach, genau dieselbe Stimmung beim Leser zu erzeugen, wie sie beim Schreiben beabsichtigt war.</p> <blockquote> <blockquote> <p>Screenreader-Benutzer habe ich noch nicht kennengelernt, aber auch da vermute ich Menschen, die nicht gleich in Depression verfallen, nur weil die Semantik der Elemente ihren Screenreadern eine Herausforderung gibt. (Und nein, das soll keine Aufforderung sein, ihnen das Leben absichtlich zu erschweren. Das muss ich leider dazusagen, weil sonst gleich wieder das negativst mögliche hinzuinterpretiert und mir vorgeworfen wird.)</p> </blockquote> <p>Nein, jedenfalls nicht von mir.</p> </blockquote> <p>War auch nur vorbeugend dazugeschrieben, weil es nicht das erste mal gewesen wäre, wenn mir hier nicht g16nannte Mitleser meine Aussagen derart ergänzen.</p> <blockquote> <p>Insofern: immer entspannt bleiben. Wir wollen doch alle nur helfen und wenn wir andere Wege für sinnvoll halten, muss man die doch nicht jedesmal komplett durchdiskutieren.</p> </blockquote> <p>Finde ich auch, hat man meiner Antwort aber nicht gegönnt.</p> <blockquote> <p>Schade, dass ich dich auf der sachlichen Ebene nicht von den Vorteilen einer bestmöglichen Auszeichnung überzeugen konnte</p> </blockquote> <p>Tja, das geht auch nur schwer, wenn ich diese Meinung schon grundsätzlich habe. Nur ein paar Aspekte betrachte ich nicht ganz so kompromisslos, besonders wenn ohne Berücksichtigung des Anwendungsfalls gepredigt wird.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718667#m1718667 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-06T10:10:54Z 2018-04-06T10:10:54Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@marctrix</p> <blockquote> <blockquote> <p>Mir ist schon klar, dass Label die wohl einfachste Möglichkeit ist, das zu erreichen. Aber wenn der Kontext die Bedienung unterstützt wird wohl dem Gesetz auch Genüge getan sein.</p> </blockquote> <p>Die Umsetzung muss WCAG-konform sein…</p> </blockquote> <p>dedlfix wollte vielleicht darauf rumreiten, dass außer dem <code>label</code>-Element noch andere Möglichkeiten gibt, ein Eingabefeld WCAG-konform zu beschriften (<code>aria-label</code>, <code>aria-labelledby</code>).</p> <p>Dann reite ich aber darauf rum, dass er von „Label“ sprach, nicht von <code>label</code>-Element.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718694#m1718694 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-06T12:30:42Z 2018-04-06T12:30:42Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@marctrix</p> <blockquote> <p>Das sagen die Befürworter <strong>mit denen ich zusammen arbeiten musste</strong> aber immer wieder: „<em>Das gibt es doch schon fertig in Bootstrap. Musst du nur noch die Größe anpassen, die Farbe, die Schriftarten und die Rahmen. Dann machst du einfach noch Schatten dazu und die Abstände weg und schon bist du fertig.</em>“ </p> </blockquote> <p>Ach du S… </p> <p>Design ist keine Fassade. <a href="https://ar.al/notes/design-is-not-veneer/" lang="en" rel="nofollow noopener noreferrer">Design is not veneer.</a></p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718669#m1718669 marctrix self@mhis.de http://mhis.de 2018-04-06T10:17:39Z 2018-04-06T10:17:39Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej Gunnar,</p> <blockquote> <p>dedlfix wollte vielleicht darauf rumreiten, dass außer dem <code>label</code>-Element noch andere Möglichkeiten gibt, ein Eingabefeld WCAG-konform zu beschriften (<code>aria-label</code>, <code>aria-labelledby</code>).</p> <p>Dann reite ich aber darauf rum, dass er von „Label“ sprach, nicht von <code>label</code>-Element.</p> </blockquote> <p>Das ist doch unnötig. Es gibt so <a href="https://gutezitate.com/zitat/136545" rel="nofollow noopener noreferrer">viel schönere Möglichkeiten zu reiten</a>.</p> <p>Es ist auch keine geeignete Art, Kollegen für die barrierefreie Umsetzung von Webseiten zu begeistern.</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718818#m1718818 Henry 2018-04-07T22:27:48Z 2018-04-07T22:47:33Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo Gunnar,</p> <blockquote> <p>Design ist keine Fassade.</p> </blockquote> <p>doch ist es. Sieht man auch in anderen Bereichen. Mode zum Beispiel, oft nicht funktionell, Aussehen ist alles, leider. Bei Webseiten sehe ich das aber anders. Für <strong>mich persönlich</strong> ist das auch immer eine Art Kunst, ähnlich einem Gemälde und so ist mir das Aussehen genau so wichtig(viell. sogar wichtiger) als der Inhalt. Aber du als US-Fan (glaube ich zumindest) kennst ja von dort noch ganz andere Beispiele aus allen Bereichen, denn dort ist Show alles, tolle Häuser von weitem von nahem Kulissenqualität, schöne alte Autos (Qualität/Detailliebe mangelhaft), mag ich trotzdem. Bin aber kein Ami-Kritiker, ich mag die.</p> <p>Tja, und was Bootstrap betrifft, sind wir eh einer Meinung. Aber darüber hatte ich mich ja <a href="https://forum.selfhtml.org/self/2018/feb/6/boostrap-js-bug/1715150#m1715150" rel="noopener noreferrer">schon mal ausgelassen</a>. Weiß auch nicht was ich von einem Produkt halten soll, dass sich nach außen hin als opensource-typ gibt, aber nur kostenpflichtige Templates bereitstellt, obwohl es ja auch genügend kostenlose im Netz gibt. Da finde ich den Ansatz von bspw. WP in dieser Hinsicht glaubwürdiger. Ja, und was <a href="http://markdotto.com/2012/01/17/bootstrap-in-a-list-apart-342/" rel="nofollow noopener noreferrer">Mark Ottos Motivation</a> betrifft, hmmm… weiß nicht er schreibt für alistapart, da müsste er eigentlich wissen wie perfekte Harmonie von Inhalt und Design mit minimalem Code aussehen sollte.</p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718762#m1718762 marctrix self@mhis.de http://mhis.de 2018-04-07T11:05:07Z 2018-04-07T11:05:07Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej dedlfix,</p> <blockquote> <blockquote> <blockquote> <p>Auf Tools herumzuhacken bringt den Probleminhaber nicht weiter und sorgt auch nicht unbedingt für die nötige Motivation.</p> </blockquote> <p>Auf welchen Tools hacke ich denn rum?</p> <p>Meine Abneigung gegen Bootstrap ist gut begründet. Wenn ich etwas schlecht finde und die Gründe dafür angebe, hat das mit rumhacken wohl nichts zu tun.</p> </blockquote> <p>Die Aussage war allgemein gehalten und ohne persönliche Ansprache. Wir führen ja hier nicht nur ein Unter-Vier-Augengespräch, weswegen ich auch die anderen Mitleser im Sinn habe.</p> <blockquote> <p>Ich lehne ja auch Atombomben nicht ohne Grund ab. Und wenn ich damit die Motivation verderbe, bootstrap oder Atombomben zu verwenden: gut!</p> </blockquote> <p>Es ging mir um die Motiavation, sich auf Argumente einzulassen.</p> </blockquote> <p>Wenn du diese Gefahr siehst, ist es natürlich wichtig einzuschreiten! Das sollte nicht passieren.</p> <p>Meine Kernaussage war halt, bootstrap erst mal hinten an zu stellen, weil html meiner Meinung nach der Anfang von allem ist, wenn man Webseiten erstellen möchte.</p> <blockquote> <blockquote> <p><strong>Alle</strong> Projekte, bei denen ich es produktiv im Einsatz gesehen habe würde ich übrigens als "quick & dirty" bezeichnen. Was eigentlich gar nicht Bootstrap selber anzulasten ist, sondern den Anwendern.</p> </blockquote> <p>Und warum ist dann Bootstrap die Zielscheibe und nicht nur diese speziellen Anwender? Ich finde es zum Beispiel für meine Belange gerade "quick und trotzdem nicht dirty".</p> </blockquote> <p>Habe ich gesagt: die Webseite von bootstrap bewirbt prominent solche schlecht gemachten Webseiten und alle Beispiele beschränken sich auf die Funktionalität/Darstellung. Es würde imho schon helfen, wenn es ein paar realistischere Beispiele gäbe, wie hier im Wiki, wo zwar bestimmte Techniken erklärt werden, das aber in vernünftig ausgezeichneten html-Dokumenten. Die gesamte bootstrap-Seite bietet nur div-Wüsten an, die dann halt kopiert werden.</p> <p>Es ist ja auch das Versprechen, schnell fertig zu werden, ohne css oder html lernen zu müssen. Und das reicht ja auch, um optisch einigermaßen ordentlich scheinende Seiten hinzustellen, die aber nur hübsche Datenhalden sind. Ich sehe auch keinerlei Bestrebungen seitens der Entwickler irgendwie dagegen zu steuern…</p> <blockquote> <p>Solche Generalschelte ist so altbekant wie langweilig und ich kann sie deshalb genausowenig ernst nehmen wie ähnliche Schelte an PHP, die Sprache sei totaler Mist, nur weil es Anwender gibt, die damit nicht eingermaßen ordentlich programmieren können.</p> </blockquote> <p>Ich kenne viel mehr gute als schlechte phpler — bei den bootstraplern glaube ich anhand von dem, wie du dich her äußerst, dass du ordentliche Arbeit ablieferst. Damit bist du der einzige (!) Entwickler, den ich kenne, der bootstrap mit ordentlich ausgezeichnetem html verbindet.</p> <p>Obwohl es noch eine Agentur gibt, die das in barrierefreien Webseiten einsetzen. Also der eine frontender da.</p> <p>Es mag mehr geben, sicher gerade in deinem kollegenkreis, aber es hat meiner Meinung nach schon mit dem Gesamtpaket bootstrap zu tun (Selbstdarstellung, Auswahl der Referenzen, Beispiele, fehlende Hinweise auf und Beispiele für Barrierefreiheit und Semantik mit bootstrap), dass bootstrap nicht von einigen, sondern von den meisten <strong>nur</strong> dafür verwendet wird, hübschen Mist zu bauen.</p> <blockquote> <p>War auch nur vorbeugend dazugeschrieben, weil es nicht das erste mal gewesen wäre, wenn mir hier nicht g16nannte Mitleser meine Aussagen derart ergänzen.</p> </blockquote> <p>Ja, ist mir schon öfter passiert, dass ich den Eindruck habe, jemand unterstellt mir, dass ich mir die Gesamtheit von Gunnars Aussagen und die Art, wie er es ausdrückt aneigne, wenn ich ihm fachlich zustimme.</p> <p>Aber ich finde unsere Diskussion ist hier doch noch zu einem recht versöhnlichen Ende gekommen, gehe jetzt auf den Rest auch nicht mehr im Detail ein, sondern stimme dir in den weiteren Punkten restlos zu.</p> <p>Viele Grüße, schöne Wochenende und nichts für ungut!</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718763#m1718763 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-07T11:19:05Z 2018-04-07T11:19:45Z bootstrap <p>hallo</p> <blockquote> <p>Meine Kernaussage war halt, bootstrap erst mal hinten an zu stellen, weil html meiner Meinung nach der Anfang von allem ist, wenn man Webseiten erstellen möchte.</p> </blockquote> <p>Ich habe eigentlich keine Erfahrung mit bootstrap. Es würde mich deshalb eher interessieren, worin denn genau die Gefahren oder Tücken von bootstrap im allgemeinen und speziellen liegen. Das aber weniger in der Form eines Forum-Artikels sondern in der Form eines Wiki-Beitrags, den man verlinken kann.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718765#m1718765 dedlfix 2018-04-07T11:34:59Z 2018-04-07T11:34:59Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>Es ist ja auch das Versprechen, schnell fertig zu werden, ohne css oder html lernen zu müssen. Und das reicht ja auch, um optisch einigermaßen ordentlich scheinende Seiten hinzustellen, die aber nur hübsche Datenhalden sind. Ich sehe auch keinerlei Bestrebungen seitens der Entwickler irgendwie dagegen zu steuern…</p> </blockquote> <p>Dieses Versprechen, nichts lernen zu müssen, kann ich auf der Bootstrap-Webseite nicht finden. Und was sollen die Entwickler denn anders machen? Sie sind nicht verantwortlich für das, was andere daraus machen. Wie sollen sie wirken? Nur zertifiziertes Zeug kommt in den Store und andere Anbieterplattformen werden mittels Anwenderbevormundung ausgesperrt, à la: du darfst zwar mein Gerät kaufen, aber nur ich bin darauf der Superuser und bestimme, was gut für die Welt ist?</p> <blockquote> <p>Damit bist du der einzige (!) Entwickler, den ich kenne, der bootstrap mit ordentlich ausgezeichnetem html verbindet.</p> </blockquote> <p>Nicht vorschnell urteilen. Ordentliche Arbeit ist für mich kein Selbstzweck. Wenn für die Zielerreichung Dinge wie aria-Attribute nicht benötigt werden, dann lass ich die weg, auch wenn andere der Meinung, das gehöre zu "ordentlich" dazu. Auch verrenke ich mich beispielsweise nicht, um eine perfekt formatierte HTML-Ausgabe hinzubekommen. Hauptsache in meiner Entwicklungsumgebung kann ich damit leicht arbeiten. Im Browser ist sowieso der DOM-Explorer das Mittel der Wahl beim Untersuchen und nur ganz selten der nackte Code.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718764#m1718764 Mitleser 2018-04-07T11:20:34Z 2018-04-07T11:20:34Z bootstrap <blockquote> <p>Ich habe eigentlich keine Erfahrung mit bootstrap. Es würde mich deshalb eher interessieren, worin denn genau die Gefahren oder Tücken von bootstrap im allgemeinen und speziellen liegen. Das aber weniger in der Form eines Forum-Artikels sondern in der Form eines Wiki-Beitrags, den man verlinken kann.</p> </blockquote> <p>Dafür!</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718767#m1718767 Matthias Apsel matthias.apsel@selfhtml.org http://brückentage.info 2018-04-07T11:53:00Z 2018-04-07T11:53:00Z bootstrap <p>Hallo beatovich,</p> <blockquote> <p>Ich habe eigentlich keine Erfahrung mit bootstrap. Es würde mich deshalb eher interessieren, worin denn genau die Gefahren oder Tücken von bootstrap im allgemeinen und speziellen liegen. Das aber weniger in der Form eines Forum-Artikels</p> </blockquote> <p>Marctrix:</p> <p>„aber es hat meiner Meinung nach schon mit dem Gesamtpaket bootstrap zu tun (Selbstdarstellung, Auswahl der Referenzen, Beispiele, fehlende Hinweise auf und Beispiele für Barrierefreiheit und Semantik mit bootstrap), dass bootstrap nicht von einigen, sondern von den meisten nur dafür verwendet wird, hübschen Mist zu bauen.“</p> <blockquote> <p>sondern in der Form eines Wiki-Beitrags, den man verlinken kann.</p> </blockquote> <p>Das wäre sehr schön.</p> <p>Bis demnächst<br> Matthias</p> <div class="signature">-- <br> Rosen sind rot. </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718768#m1718768 dedlfix 2018-04-07T13:00:24Z 2018-04-07T13:00:24Z bootstrap <p>Tach!</p> <blockquote> <p>Ich habe eigentlich keine Erfahrung mit bootstrap. Es würde mich deshalb eher interessieren, worin denn genau die Gefahren oder Tücken von bootstrap im allgemeinen und speziellen liegen.</p> </blockquote> <p>Mal ketzerisch zusammengefasst: Es ist das gleiche wie bei einem Hammer. Man kann damit Nägel einschlagen, aber auch Köpfe und auf den eigenen Daumen. Beim Runterfallen können auch noch Fliesen und Zehen kaputtgehen. Andererseits geht bei Verwendung von Bootstrap nicht wirklich was kaputt. Im schlimmsten Fall hat man eine Website mit Verbesserungspotential.</p> <p>Bootstrap ist eine Sammlung von CSS, organisiert hauptsächlich in Klassen. Aber auch grundlegendes CSS für eine durchgehende Typographie, das direkt auf den Elementen aufsetzt, beispielsweise h(1-6) oder ul/li. Dazu gibt es eine Dokumentation mit Vorschlägen, wie man HTML-Elemente zusammen mit diesen Klassen verwenden kann. Die Klassen sind so allgemein gehalten, dass sie nicht nur mit bestimmten Elementen zusammenarbeiten. Ob man eine div-Suppe erstellt oder alle Möglichkeiten von HTML5 zur Strukturierung verwendet, ist keine Vorgabe von Bootstrap. Allerdings sind die Beispiele meist auf divs aufgebaut, solange nicht eindeutig ein HTML-Element für eine bestimmte Aufgabe genommen werden kann. Soll heißen, Tabellen und Listen sind schon mit table und ul/ol/li ausgezeichnet, aber da wo man je nach letztendlichem Kontext zwischen section, footer, aside und so weiter wählen kann, ergibt es nicht viel Sinn, eine allgemeingehaltene Dokumentation mit diesen speziellen Elementen statt neutralen divs vorzubelegen. Am Ende sind nicht wenige Anwender eh nicht in der Lage an dem kopierten Beispiel-Code sinnvolle Änderungen vorzunehmen. Da finde ich es auch besser, allgemein passende divs im Ergebnis zu haben, als kaum passende Spezialelemente.</p> <p>Eine der "Gefahren oder Tücken" ist also, dass die Anwender nicht genügend nachdenken oder HTML-Wissen haben, vielleicht auch zu ängstlich sind, etwas kaputt zu machen, um die in den Beispielen verwendeten divs durch für ihren Anwendungsfall geeignetere Elemente zu ersetzen.</p> <p>Ein wesentlicher Bestandteil von Bootstrap ist das 12-Spalten-Grid-System, das auch responsibel ist. Bisher mit herkömmlicher Float-Technik realisiert, mittlerweile auch mit den Möglichkeiten moderner Browser mitgehend. Das sorgt dafür, dass man recht unkompliziert den Elementen der Webseite eine einheitliche Ausrichtung und Größe geben kann, und das auch für unterschiedliche Viewportgrößen. Es nimmt einem aber nicht die generelle Arbeit ab, sich über Positionen, Größen und Anordnungen auf unterschiedlich großen Viewports Gedanken zu machen.</p> <p>Weiterhin gibt es <a href="https://getbootstrap.com/docs/4.0/components/" rel="nofollow noopener noreferrer">Komponenten</a> für eine ganze Reihe von Bedienelementen, die so direkt nicht in HTML zu finden sind. Die Komponenten brauchen teilweise Javascript für ihre volle Funktionalität.</p> <p>Nun hat man bei einem allgemeinen Framework das Problem, dass man den Kontext beim Anwender nicht kennt. Aber wie soll man Bezeichnern eine Semantik verleihen, wenn man von dieser Bedeutung beim individuellen Verwender keine Kenntnis hat? Bei <a href="https://getbootstrap.com/docs/4.0/utilities/colors/" rel="nofollow noopener noreferrer">Farben</a> ist das noch einigermaßen möglich, wenn man sich auf allgemein übliche Verwendung bezieht, wie Rot = Gefahr. Für andere Formatierelemente hat man dann Klassennamen, die diese optischen Auswirkungen repräsentieren, das so genannte präsentationsbezogene Markup.</p> <p>Das ist also eine weitere "Gefahr oder Tücke", oder jedenfalls wird es gern als Kritikpunkt aufgezählt. So richtig nachvollziehen kann ich das nicht. Am Ende haben HTML-Elemente auch nur für sich eine Semantik, und die eigentliche Semantik des Anwendungsfalls geht darin auch weitgehend verloren. Eine Liste mit Links unterscheidet sich zum Beispiel nicht von einer Liste mit Mitarbeiternamen. Die Liste ist aus Sicht der Anwendung auch nur ein präsentationsbezogenes Element.</p> <p>Es gibt auch noch eine Menge andere Dinge in und um Bootstrap herum, die ich nicht weiter thematisieren kann, weil ich noch keinen Bedarf hatte, mich damit zu beschäftigen.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718779#m1718779 marctrix self@mhis.de http://mhis.de 2018-04-07T17:19:01Z 2018-04-07T17:19:01Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej dedlfix,</p> <blockquote> <blockquote> <p>Es ist ja auch das Versprechen, schnell fertig zu werden, ohne css oder html lernen zu müssen. Und das reicht ja auch, um optisch einigermaßen ordentlich scheinende Seiten hinzustellen, die aber nur hübsche Datenhalden sind. Ich sehe auch keinerlei Bestrebungen seitens der Entwickler irgendwie dagegen zu steuern…</p> </blockquote> <p>Dieses Versprechen, nichts lernen zu müssen, kann ich auf der Bootstrap-Webseite nicht finden.</p> </blockquote> <p>Nein, die Bootstrap-Klassen muss man schon verstehen.</p> <p>Ich für meinen Teil würde sagen, da kann man auch gleich CSS lernen. Ist auch hervorragend dokumentiert. </p> <blockquote> <p>Und was sollen die Entwickler denn anders machen? Sie sind nicht verantwortlich für das, was andere daraus machen. Wie sollen sie wirken? Nur zertifiziertes Zeug kommt in den Store</p> </blockquote> <p>Store? Heißt die Referenzen-Seite so?</p> <p>Oder haben wir uns missverstanden?</p> <blockquote> <p>andere Anbieterplattformen werden mittels Anwenderbevormundung ausgesperrt, à la: du darfst zwar mein Gerät kaufen, aber nur ich bin darauf der Superuser und bestimme, was gut für die Welt ist?</p> </blockquote> <p>Du meinst so wie Apple?</p> <p>Es gibt schlechtere Ansätze. Aber jeder hat seine Vor- und Nachteile.</p> <p>Ich sage es mal so: wenn ich ein Tool bereit stelle, dann würde ich gerne zeigen, was für tolle Sachen Leute damit entwickelt haben.</p> <p>Was Bootstrap in seinem „darauf-bin-ich-stolz“-Kasten zeigt, finde ich nicht zum vorzeigen.</p> <p>Aber es geht dabei ja nur „große“ Seiten zu zeigen, die toll aussehen, um nich mehr unbedarfte Anwender anzulocken. Kein Wunder, dass die es dann mi hz besser machen.</p> <p>Das fatale: durch die hohe Verbreitung dieser schlechten Beispiele und die vielen Nachahmer macht man das web signifikant schlechter!</p> <blockquote> <blockquote> <p>Damit bist du der einzige (!) Entwickler, den ich kenne, der bootstrap mit ordentlich ausgezeichnetem html verbindet.</p> </blockquote> <p>Nicht vorschnell urteilen. Ordentliche Arbeit ist für mich kein Selbstzweck.</p> </blockquote> <p>Wie könnte es? Gut strukturiertes HTML hat ganz konkrete praktische Vorteile.</p> <p>Und ein sinnvolles Element zu nehmen, statt eines bedeutungslosen ist keine Zeitersparnis.</p> <blockquote> <p>Wenn für die Zielerreichung Dinge wie aria-Attribute nicht benötigt werden, dann lass ich die weg, auch wenn andere der Meinung, das gehöre zu "ordentlich" dazu.</p> </blockquote> <p>Wie können die für eine Zielerreichung unnötig sein? Muss nicht jede Website von jedem bedienbar sein?</p> <p>Und wie arbeitest du denn? Für vieles habe ich fertige Codeschnipsel. Da wäre es aufwändiger die aria-Attribute rauszunehmen, statt sie drin zu lassen. Wenn man sich angewöhnt hat, barrierearm zu entwickeln, wäre es ein Mehraufwand Barrieren einzubauen.</p> <blockquote> <p>Auch verrenke ich mich beispielsweise nicht, um eine perfekt formatierte HTML-Ausgabe hinzubekommen.</p> </blockquote> <p>Ich schreibe ein <code>main</code> genau so entspannt wie ein div <code>id=”main“</code>.</p> <p>Wo soll denn da der Aufwand sein?</p> <blockquote> <p>Hauptsache in meiner Entwicklungsumgebung kann ich damit leicht arbeiten. Im Browser ist sowieso der DOM-Explorer das Mittel der Wahl beim Untersuchen und nur ganz selten der nackte Code.</p> </blockquote> <p>?!?</p> <p>Was das bedeuten soll, kann ich nicht verstehen. Das soll doch wohl nicht heißen, wenn du es bei der Arbeit bequem hast, ist das Ziel doch erreicht?!?</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718813#m1718813 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-07T21:16:47Z 2018-04-07T21:16:47Z bootstrap <p>@@dedlfix</p> <blockquote> <p>Mal ketzerisch zusammengefasst: Es ist das gleiche wie bei einem Hammer. Man kann damit Nägel einschlagen,</p> </blockquote> <p>Mal ketzerisch den Vergleich berichtigt: Mit dem Hammer Bootstrap schlägst du keine Nägel in die Wand, sondern Schrauben.</p> <blockquote> <p>Andererseits geht bei Verwendung von Bootstrap nicht wirklich was kaputt.</p> </blockquote> <p>Doch, die <em lang="en">performance</em>, und damit die <em lang="en">user experience</em>. Der ganze Bootstrap-Code (300 Kilobyte, wir sprachen drüber) muss ja erstmal übertragen und geparst werden.</p> <blockquote> <p>Eine der "Gefahren oder Tücken" ist also, dass die Anwender nicht genügend nachdenken oder HTML-Wissen haben, vielleicht auch zu ängstlich sind, etwas kaputt zu machen, um die in den Beispielen verwendeten divs durch für ihren Anwendungsfall geeignetere Elemente zu ersetzen.</p> </blockquote> <p>Das kann ich bestätigen. Ich hatte unlängst statt <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>container<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></code>, <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></code> und <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-…<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></code> – um den Gammelcode wenigstens etwas überschaubarer zu machen – <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>bs-container</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>container<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></code>, <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>bs-row</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></code> und <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>bs-col</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-…<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></code> verwendet. Dann sieht man wenigstens bei den End-Tags <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>bs-col</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>bs-row</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>bs-container</span><span class="token punctuation">></span></span></code>, welches Element da nun gerade zugeht, anstatt unleserliches <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span></code> im Code zu haben. Das wurde nicht verstanden, dass das überhaupt nichts kaputtmacht; und ich musste die sprechenden Elementbezeichner durch <code>div</code>s ersetzen, weil Bootstrap macht das in den Beispielen ja auch so. </p> <blockquote> <p>Ein wesentlicher Bestandteil von Bootstrap ist das 12-Spalten-Grid-System […] Das sorgt dafür, dass man recht unkompliziert den Elementen der Webseite eine einheitliche Ausrichtung und Größe geben kann</p> </blockquote> <p>Eben das ist nicht der Fall!</p> <p>Bei Boostrap brauchst du 3fache Verschachtelung:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>container<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Item 1<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Item 2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>Unkompliziert geht so:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>container<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span>Item 1<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span>Item 2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <blockquote> <p>und das auch für unterschiedliche Viewportgrößen.</p> </blockquote> <p>Und hierbei ist es noch weniger der Fall.</p> <p>Bootstrap: für jeden Breakpoint noch eine zusätzliche Klasse mehr.</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>container<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-12 col-sm-6 col-md-4 col-lg-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Item 1<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-12 col-sm-6 col-md-4 col-lg-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Item 2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>Unkompliziert geht so: für obiges unkomplizierte Markup bspw.:</p> <pre><code class="block language-css"><span class="token selector">.containder</span> <span class="token punctuation">{</span> <span class="token property">display</span><span class="token punctuation">:</span> grid<span class="token punctuation">;</span> <span class="token property">grid-template-columns</span><span class="token punctuation">:</span> <span class="token function">repeat</span><span class="token punctuation">(</span>auto-fill<span class="token punctuation">,</span> <span class="token function">minmax</span><span class="token punctuation">(</span>15em<span class="token punctuation">,</span> 1fr<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Einfach nur die Mindestbreite der Griditems angeben – <a href="https://codepen.io/gunnarbittersmann/pen/JNvpea" rel="noopener noreferrer">fertig</a>. Keine <em lang="en">media queries</em> – das Rechnen kann man dem Rechner überlassen.</p> <p>Bei Bootstrap hat man deutlich höheren Aufwand beim Erstellen des Codes; und nochmal viel höheren Aufwand bei späteren Änderungen.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718780#m1718780 Matthias Apsel matthias.apsel@selfhtml.org http://brückentage.info 2018-04-07T17:26:06Z 2018-04-07T17:26:06Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo marctrix,</p> <blockquote> <blockquote> <p>Hauptsache in meiner Entwicklungsumgebung kann ich damit leicht arbeiten. Im Browser ist sowieso der DOM-Explorer das Mittel der Wahl beim Untersuchen und nur ganz selten der nackte Code.</p> </blockquote> <p>?!?</p> <p>Was das bedeuten soll, kann ich nicht verstehen.</p> </blockquote> <p>Da ging es lediglich um die HTML-Code-Einrückung.</p> <p>Bis demnächst<br> Matthias</p> <div class="signature">-- <br> Rosen sind rot. </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718783#m1718783 dedlfix 2018-04-07T17:52:35Z 2018-04-07T17:52:35Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <blockquote> <p>Wenn für die Zielerreichung Dinge wie aria-Attribute nicht benötigt werden, dann lass ich die weg, auch wenn andere der Meinung, das gehöre zu "ordentlich" dazu.</p> </blockquote> <p>Wie können die für eine Zielerreichung unnötig sein? Muss nicht jede Website von jedem bedienbar sein?</p> </blockquote> <p>Das ist es ja eben. Nicht jede Website muss von jedem bedienbar sein. Eine Website ist es nicht nur, wenn das Ding im Web steht, sondern auch wenn es Webtechniken verwendet, ansonsten aber im Intranet oder anderen privaten Räumen steht. Auch für (geschlossene) Nutzergruppen, bei denen Nicht-Sehende aufgrund des Themas nicht teilhaben können, benötigen die Websites keine Screenreader-Unterstützung.</p> <blockquote> <p>Und wie arbeitest du denn? Für vieles habe ich fertige Codeschnipsel. Da wäre es aufwändiger die aria-Attribute rauszunehmen, statt sie drin zu lassen. Wenn man sich angewöhnt hat, barrierearm zu entwickeln, wäre es ein Mehraufwand Barrieren einzubauen.</p> </blockquote> <p>Ohne aria, war bisher nicht nötig. Wenn ich Web-Frontends erstelle, dann für Anwendungen mit bekanntem und/oder überschaubarem Nutzerkreis. Websites der allgemeine Art oder für öffentliches Publikum erstelle ich nicht, abgesehen von Anpassungen an Fertiglösungen, wie Shop-Systeme.</p> <blockquote> <blockquote> <p>Auch verrenke ich mich beispielsweise nicht, um eine perfekt formatierte HTML-Ausgabe hinzubekommen.</p> </blockquote> <p>Ich schreibe ein <code>main</code> genau so entspannt wie ein div <code>id=”main“</code>.</p> <p>Wo soll denn da der Aufwand sein?</p> </blockquote> <p>Perfekt formatiert, nicht perfekt ausgezeichnet. Der Aufwand beginnt, wenn man die Seite serverseitig zusammenbaut und neben den Einrückungen für HTML noch Einrückungen für PHP oder andere Template-Sprachen hinzukommen, die man in der Ausgabe nicht mehr sieht, wohl aber die dadurch entstandenen Tabulator- oder Leerzeichensprünge. Oder wenn Teile der Seite in separaten Template-Dateien stecken, bei denen die IDE nicht weiß (wissen kann), in welcher Verschachtlungstiefe sie letztlich landen werden, dann sieht es in der fertigen Seite auch gehüpft und gesprungen aus. Soll es ruhig, sind eh nur funktionslose Whitespace, die lediglich für die Optik und die Übersicht beim Entwickeln eingefügt werden.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718781#m1718781 marctrix self@mhis.de http://mhis.de 2018-04-07T17:51:58Z 2018-04-07T17:51:58Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej Matthias,</p> <blockquote> <blockquote> <p>Was das bedeuten soll, kann ich nicht verstehen.</p> </blockquote> <p>Da ging es lediglich um die HTML-Code-Einrückung.</p> </blockquote> <p>Danke! Das macht natürlich Sinn!</p> <p>Was ich noch sagen wollte: als Programmierer solltest du für Frontend gar nicht zuständig sein, <a href="/users/27" class="mention registered-user" rel="noopener noreferrer">@dedlfix</a> — Programmierung und Frontend ist imho zu viel Stoff, um da auf dem laufenden zu bleiben. Da kommt man ja vor lauter lernerei gar nicht zum arbeiten. Es sei denn man nutzt bootstrap… </p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718786#m1718786 dedlfix 2018-04-07T18:09:37Z 2018-04-07T18:09:37Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>als Programmierer solltest du für Frontend gar nicht zuständig sein, <a href="/users/27" class="mention registered-user" rel="noopener noreferrer">@dedlfix</a> — Programmierung und Frontend ist imho zu viel Stoff, um da auf dem laufenden zu bleiben. Da kommt man ja vor lauter lernerei gar nicht zum arbeiten. Es sei denn man nutzt bootstrap… </p> </blockquote> <p>Man hat nicht immer die Wahl und eine Firma, die für alles hochentwickelte Spezialisten einstellen kann, trotzdem aber ein gewisses Portfolio braucht, um wachsen zu können und nicht nur in einer Nische festzustecken. Und ja, als Allrounder kann man nicht in alle Themen gleichmäßig tief eintauchen. Flexbox und Grid hab ich mir zum Beispiel noch nicht näher angeschaut. Bootstrap sein Dank.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718785#m1718785 marctrix self@mhis.de http://mhis.de 2018-04-07T18:00:46Z 2018-04-07T18:00:46Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hej dedlfix,</p> <blockquote> <p>Das ist es ja eben. Nicht jede Website muss von jedem bedienbar sein. Eine Website ist es nicht nur, wenn das Ding im Web steht, sondern auch wenn es Webtechniken verwendet, ansonsten aber im Intranet oder anderen privaten Räumen steht. Auch für (geschlossene) Nutzergruppen, bei denen Nicht-Sehende aufgrund des Themas nicht teilhaben können, benötigen die Websites keine Screenreader-Unterstützung.</p> </blockquote> <p>Da wir blinde Mitarbeiter haben, muss auch unser Intranet barrierefrei sein. Aber es gibt natürlich Firmen, die Blinde nicht beschäftigen. Das Dumme: sie werden es auch in Zukunft nicht, weil man ja so viel anpassen müsste — Pech wenn man blind ist.</p> <blockquote> <blockquote> <blockquote> <p>Auch verrenke ich mich beispielsweise nicht, um eine perfekt formatierte HTML-Ausgabe hinzubekommen.</p> </blockquote> <p>Ich schreibe ein <code>main</code> genau so entspannt wie ein div <code>id=”main“</code>.</p> <p>Wo soll denn da der Aufwand sein?</p> </blockquote> <p>Perfekt formatiert, nicht perfekt ausgezeichnet. Der Aufwand beginnt,…</p> </blockquote> <p>Ja, das ist tatsächlich von zweifelhaftem Nutzen! Habe gehofft, dass ich nur nicht kapiert habe, was du meinst…</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718791#m1718791 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-07T19:07:28Z 2018-04-07T19:07:28Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <p>Nutzergruppen, bei denen Nicht-Sehende aufgrund des Themas nicht teilhaben können</p> </blockquote> <p>?? WAS??</p> <p>Bei welchen Themen sollten Nicht-Sehende aufgrund des Themas nicht teilhaben können?</p> <p>Übrigens gibt es nicht nur Sehende und Nicht-Sehende, sondern auch Schlecht-Sehende. Und mit zunehmendem Alter kommen wir alle dahin.</p> <blockquote> <p>benötigen die Websites keine Screenreader-Unterstützung.</p> </blockquote> <p>Auch das mag für dich neu und überraschend sein: Nicht nur Nicht-Sehende oder Schlecht-Sehende benutzen Screenreader, sondern auch Bestens-Sehende mit Leseschwäche.</p> <blockquote> <blockquote> <p>Ich schreibe ein <code>main</code> genau so entspannt wie ein div <code>id=”main“</code>.</p> <p>Wo soll denn da der Aufwand sein?</p> </blockquote> <p>Der Aufwand beginnt, wenn man die Seite serverseitig zusammenbaut und neben den Einrückungen für HTML noch Einrückungen für PHP oder andere Template-Sprachen hinzukommen, die man in der Ausgabe nicht mehr sieht, wohl aber die dadurch entstandenen Tabulator- oder Leerzeichensprünge.</p> </blockquote> <p>Verstehe ich das jetzt richtig? Du willst nicht die richtigen HTML-Elemente verwenden, weil dir deine IDE deinen Code nicht richtig formatiert?</p> <p>Was hast du heute zu dir genommen?</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718787#m1718787 dedlfix 2018-04-07T18:15:47Z 2018-04-07T18:15:47Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>Da wir blinde Mitarbeiter haben, muss auch unser Intranet barrierefrei sein. Aber es gibt natürlich Firmen, die Blinde nicht beschäftigen. Das Dumme: sie werden es auch in Zukunft nicht, weil man ja so viel anpassen müsste — Pech wenn man blind ist.</p> </blockquote> <p>Dafür gäbe es ja das eine oder andere Fördermittel. Es liegt nicht immer nur am Willen, es gibt auch genügend Tätigkeitsfelder, da geht es nicht ohne Augenlicht.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718795#m1718795 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-07T19:27:05Z 2018-04-07T19:27:05Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <p>Und ja, als Allrounder kann man nicht in alle Themen gleichmäßig tief eintauchen. Flexbox und Grid hab ich mir zum Beispiel noch nicht näher angeschaut.</p> </blockquote> <p>Das wäre Frontend-Entwicklung.</p> <p>Und jemand, der sich Flexbox und Grid noch nicht angeschaut hat, ist wohl keiner, der sich „Allrounder“ nennen dürfte.</p> <blockquote> <p>Bootstrap sein Dank.</p> </blockquote> <p>Das ist nicht Frontend-Entwicklung.</p> <blockquote> <p>Man hat nicht immer die Wahl und eine Firma, die für alles hochentwickelte Spezialisten einstellen kann</p> </blockquote> <p>Ein Frontend-Entwickler ist ein hochentwickelter Spezialist?</p> <p>„Bootstrap sei Dank, müssen wir keinen Frontend-Entwickler einstellen.“<br> „Also keinen, der einen Blick für Usability, Barrierefreiheit, … UX hat?“<br> „Nö, das ist uns alles scheißegal!“</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718794#m1718794 dedlfix 2018-04-07T19:19:00Z 2018-04-07T19:19:00Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>Bei welchen Themen sollten Nicht-Sehende aufgrund des Themas nicht teilhaben können?</p> </blockquote> <p>Zum Beispiel Ärzte, die Röntgen- und andere Bilder beurteilen sollen.</p> <blockquote> <p>Übrigens gibt es nicht nur Sehende und Nicht-Sehende, sondern auch Schlecht-Sehende. Und mit zunehmendem Alter kommen wir alle dahin.</p> </blockquote> <p>Ja, aber dann werden wir nicht mehr den Tätigkeiten nachgehen können, für die man gute Seefähigkeit braucht und ist dann auch nicht mehr Teil der Nutzergruppe.</p> <blockquote> <blockquote> <p>benötigen die Websites keine Screenreader-Unterstützung.</p> </blockquote> <p>Auch das mag für dich neu und überraschend sein: Nicht nur Nicht-Sehende oder Schlecht-Sehende benutzen Screenreader, sondern auch Bestens-Sehende mit Leseschwäche.</p> </blockquote> <p>Die sind dann auch eher weniger in zum Beispiel oben genannter Nutzergruppe vertreten.</p> <blockquote> <p>Verstehe ich das jetzt richtig? Du willst nicht die richtigen HTML-Elemente verwenden, weil dir deine IDE deinen Code nicht richtig formatiert?</p> </blockquote> <p>Nein, das hast du nicht richtig verstanden.</p> <blockquote> <p>Was hast du heute zu dir genommen?</p> </blockquote> <p>Und das musste nun wirklich nicht sein.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718800#m1718800 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-07T19:49:45Z 2018-04-07T19:49:45Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <blockquote> <p>… Schlecht-Sehende. Und mit zunehmendem Alter kommen wir alle dahin.</p> </blockquote> <p>Ja, aber dann werden wir nicht mehr den Tätigkeiten nachgehen können, für die man gute Seefähigkeit braucht</p> </blockquote> <p>Das Erfassen des Inhalts einer Webseite gehört nicht zu den Tätigkeiten, für die man eine gute Sehfähigkeit<sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup> brauchen sollte. Jetzt kannst du dir freilich wieder eine spezielle Nische aus den Fingern saugen …</p> <blockquote> <p>Bestens-Sehende mit Leseschwäche.</p> <p>Die sind dann auch eher weniger in zum Beispiel oben genannter Nutzergruppe vertreten.</p> </blockquote> <p>Was genau hat Legastenie mit Intelligenz zu tun? Warum sollte ein Legasteniker nicht ein hervorragender Radiologe sein?</p> <blockquote> <blockquote> <p>Verstehe ich das jetzt richtig? Du willst nicht die richtigen HTML-Elemente verwenden, weil dir deine IDE deinen Code nicht richtig formatiert?</p> </blockquote> <p>Nein, das hast du nicht richtig verstanden.</p> </blockquote> <p>Da bin ich aber froh. (Darüber, dass ich das falsch verstanden habe; nicht darüber, dass ich das dann gar nicht verstanden habe.)</p> <blockquote> <blockquote> <p>Was hast du heute zu dir genommen?</p> </blockquote> <p>Und das musste nun wirklich nicht sein.</p> </blockquote> <p>Die Alternative, es nicht durch die Blume zu sagen, hätte dir noch weniger gefallen. </p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> <hr class="footnotes-sep"> <section class="footnotes"> <ol class="footnotes-list"> <li id="fn1" class="footnote-item"><p>Seefähigkeit? Ist das die Fähigkeit, auf hoher See seinen Mageninhalt drinzubehalten? <a href="#fnref1" class="footnote-backref">↩︎</a></p> </li> </ol> </section> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718798#m1718798 dedlfix 2018-04-07T19:45:42Z 2018-04-07T19:45:42Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <blockquote> <p>Und ja, als Allrounder kann man nicht in alle Themen gleichmäßig tief eintauchen. Flexbox und Grid hab ich mir zum Beispiel noch nicht näher angeschaut.</p> </blockquote> <p>Das wäre Frontend-Entwicklung.</p> <p>Und jemand, der sich Flexbox und Grid noch nicht angeschaut hat, ist wohl keiner, der sich „Allrounder“ nennen dürfte.</p> </blockquote> <p>Also <a href="https://www.duden.de/rechtschreibung/Allrounder" rel="nofollow noopener noreferrer">der Duden definiert</a> das als "wendige, vielseitig interessierte männliche Person, die Kenntnisse und Fähigkeiten auf zahlreichen Gebieten besitzt und anwendet" - "vielseitig einsetzbares Gerät". Das steht nicht, dass man dabei perfekt in all den Themen sein muss, und nach dem mir bekannten Sprachgebrauch erwartet man auch keine allumfassende Perfektion von solch einer Person oder Gegenstand.</p> <blockquote> <p>„Bootstrap sei Dank, müssen wir keinen Frontend-Entwickler einstellen.“<br> „Also keinen, der einen Blick für Usability, Barrierefreiheit, … UX hat?“<br> „Nö, das ist uns alles scheißegal!“</p> </blockquote> <p>Schon wieder diese Unterstellungen. Langsam nervt es.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718803#m1718803 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-07T20:07:59Z 2018-04-07T20:07:59Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <blockquote> <blockquote> <p>Und jemand, der sich Flexbox und Grid noch nicht angeschaut hat, ist wohl keiner, der sich „Allrounder“ nennen dürfte.</p> </blockquote> <p>Also <a href="https://www.duden.de/rechtschreibung/Allrounder" rel="nofollow noopener noreferrer">der Duden definiert</a> das …</p> </blockquote> <p>In dem Kontext irrelevant.</p> <blockquote> <p>… als "wendige, vielseitig interessierte männliche Person</p> </blockquote> <p>Was hat das Geschlecht damit zu tun, Allrounder zu sein oder nicht?</p> <p>Im Kontext Webentwicklung ist ein Allrounder jemand, der sich auf allen Gebieten der Webentwicklung auskennt: Serverkonfiguration, Datenbanken, serverseitiger Programmierung (z.B. PHP), clientseitiger Programmierung (JavaScript), HTML, CSS, Barrierefreiheit, Performanz, Design, …</p> <p>Es mag einige Genies geben, die das drauf haben. Bei den meisten wäre ich aber skeptisch: Die haben von allem ein bisschen Ahnung, aber von nichts richtig. Oder von ein oder zwei Gebieten davon richtig Ahnung, aber von den anderen doch zu wenig, um sich wirklich Allrounder nennen zu dürfen.</p> <p>Problematisch wird’s, wenn Spezialisten als Allrounder eingesetzt werden und Gebiete abdecken sollen, von denen sie eigentlich wenig verstehen.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718804#m1718804 dedlfix 2018-04-07T20:13:12Z 2018-04-07T20:13:12Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Tach!</p> <blockquote> <p>Das Erfassen des Inhalts einer Webseite gehört nicht zu den Tätigkeiten, für die man eine gute Sehfähigkeit[^see] brauchen sollte. Jetzt kannst du dir freilich wieder eine spezielle Nische aus den Fingern saugen …</p> </blockquote> <p>Das habe ich nicht nötig. Diese und andere Nischen existieren. Ich sagte bereits, dass es sich nicht um Webseiten für breites Publikum handelt, sondern um spezielle Anwendungen, die ich erstelle.</p> <p>Du kannst auch ein Computerspiel nehmen, bei dem du mit dem Screenreader keinen Zentimeter weit kommst. Was nützt es dann, wenn du einen Kalkulator für dieses Spiel mit dem Screenreader bedienen kannst?</p> <blockquote> <blockquote> <blockquote> <p>Was hast du heute zu dir genommen?</p> </blockquote> <p>Und das musste nun wirklich nicht sein.</p> </blockquote> <p>Die Alternative, es nicht durch die Blume zu sagen, hätte dir noch weniger gefallen. </p> </blockquote> <p>Mir hätte es gefallen, wenn wir uns auf fachlicher Ebene unterhalten würden, ohne dass du ins Persönliche abgleitest.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718805#m1718805 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-07T20:22:04Z 2018-04-08T01:03:50Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@dedlfix</p> <p>Schade, um die Antwort auf die eigentlich spannende Frage hast du dich gedrückt: Warum sollte ein Legasteniker nicht ein hervorragender Radiologe sein?</p> <p>Was darauf hinausläuft: Warum sollte Textinhalt auf Webseiten für Radiologen nicht per Screenreader wiedergegeben werden können?</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718816#m1718816 Henry 2018-04-07T21:49:47Z 2018-04-07T21:49:47Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo Gunnar,</p> <p>was mich mal bei dieser ganzen Diskussion(weil keine Erfahrungwerte) hier interessiert ist dies:</p> <ul> <li> <p>Wie kamen Screenreader vor Aria mit Webseiten zurecht?</p> </li> <li> <p>Für wen ist die Semantik und immer neue Tags praktisch hilfreich?</p> </li> <li> <p>Welche Vorteile haben die neuen Tags (zb. main)?</p> </li> </ul> <p>Das ist jetzt nicht irgendwie provozierend oder ironisch gemeint, sondern interessiert mich echt, weil vieles nutzt man, weil andere es empfehlen aber leider auch oft ohne zu hinterfragen. Wäre mal schön zu wissen welche Erfahrungen echte Screenreader-Nutzer haben. Oder mal anders gefragt:</p> <p>Wenn die genannten Punkte absolut zu beachten sind, warum hat das W3C dies nicht als Bedingung oder zumindest als Fehler deklariert, wenn man dagegen verstößt? Also wie eine Programmiersprache, die auch nicht weiter macht wenn irgendwas essentiell richtig sein muss. Weil, hier artet eine andere Ansicht ja oft schnell zur Hexenjagd aus.</p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718849#m1718849 marctrix self@mhis.de http://mhis.de 2018-04-08T14:58:40Z 2018-04-08T14:58:40Z bootstrap <p>Hej Gunnar,</p> <blockquote> <p>@@dedlfix</p> </blockquote> <blockquote> <blockquote> <p>Ein wesentlicher Bestandteil von Bootstrap ist das 12-Spalten-Grid-System […] Das sorgt dafür, dass man recht unkompliziert den Elementen der Webseite eine einheitliche Ausrichtung und Größe geben kann</p> </blockquote> <p>Eben das ist nicht der Fall</p> </blockquote> <p>Sehe ich natürlich genauso. Aber das sagte ich ja bereits.</p> <p>Die Komponenten sind halt out-of-the-box nutzbar. Dafür muss man sich mit total bescheuerten Namen rumschlagen, wie z.B. error für rot. WTF?</p> <p>Und ganz schlimm wird es, wenn der Designer später feststellt, dass <strong>ein Teil</strong> der roten Buttons bitte grau sein soll.</p> <p>Tja Pech gehabt! Da steht man dann und muss zwischen zwei Übeln wählen: an alle stellen gehen, wo Buttons grau sein sollen (in beten, dass man keine vergisst) und die Klasse durch eine andere mit ebenso bescheuertem Namen ersetzen (oft will man ja einen roten Button einsetzen, obwohl der gar keine Fehlermeldung enthält) - oder man hat das Glück dass man die Buttons, die grau werden sollen durch irgendein Merkmal im html von den Buttons unterscheiden kann, die rot bleiben sollen (z.B. weil die sich in unterschiedlichen Containern befinden beispielsweise).</p> <p>Dann muss man damit leben dass man haufenweise Buttons hat, die behaupten Fehler zu enthalten, was überhaupt nicht stimmt und logisch wie optisch unterschiedlich sind.</p> <p>Wer soll da noch durchblicken? — unverständlicherweise kommen die Befürworter dann immer noch mit dem Argument, dass bootstrap gut kommentiert sei. Was nützt das, wenn man seinen Code so verhunzen muss, dass man dann mehr Dokumentationsaufwand für das Projekt hat, als ohne bootstrap?</p> <p>Und wie soll die Doku aussehen? Soll man da hinein schreiben, dass man Buttons, die nichts mit Fehlern zu tun haben, die Klasse error mitgegeben hat und dass die mal so und mal so aussehen, je nachdem, welchen Zweck die tatsächlich haben?</p> <blockquote> <pre><code class="block language-css"><span class="token selector">.containder</span> <span class="token punctuation">{</span> <span class="token property">display</span><span class="token punctuation">:</span> grid<span class="token punctuation">;</span> <span class="token property">grid-template-columns</span><span class="token punctuation">:</span> <span class="token function">repeat</span><span class="token punctuation">(</span>auto-fill<span class="token punctuation">,</span> <span class="token function">minmax</span><span class="token punctuation">(</span>15em<span class="token punctuation">,</span> 1fr<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Dürfte für die allermeisten Fälle tatsächlich reichen, ist aber kein 12-Spalten-Grid…</p> <blockquote> <p>Bei Bootstrap hat man deutlich höheren Aufwand beim Erstellen des Codes; und nochmal viel höheren Aufwand bei späteren Änderungen.</p> </blockquote> <p>Und einen höheren Lernaufwand vor der ersten Benutzung!</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718820#m1718820 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-08T00:47:05Z 2018-04-08T00:47:05Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@Henry</p> <blockquote> <ul> <li>Wie kamen Screenreader vor Aria mit Webseiten zurecht?</li> </ul> </blockquote> <p>Wenn du mit Webseiten vor ARIA statische Webseiten meinst: bestens – bei vernünftigem Markup. Die <a href="https://www.w3.org/TR/using-aria/#rule1" rel="nofollow noopener noreferrer">erste Regel der Verwendung von ARIA</a> besagt ja: Verwende kein ARIA, wenn es ein HTML-Element für diesen Zweck gibt.</p> <p>ARIA wird verwendet:</p> <ul> <li> <p>bei dynamischen Seiten (<em lang="en">rich Internet applications</em>), wo Seiteninhalte erscheinen und verschwinden (nachgeladene Inhalte, Akkordeons, Tabs, Statusmeldungen, modale Dialogfenster, …)</p> </li> <li> <p>bei bestehenden Webseiten, die kein vernünftiges Markup verwenden, bei denen aber die Änderung von HTML-Elementen nicht (mit vertretbarem Aufwand) möglich ist</p> </li> </ul> <blockquote> <ul> <li>Für wen ist die Semantik und immer neue Tags praktisch hilfreich?</li> </ul> </blockquote> <p>Für alle.</p> <p>Für Nutzer assisiver Technologien sowieso …</p> <blockquote> <ul> <li>Welche Vorteile haben die neuen Tags (zb. main)?</li> </ul> </blockquote> <p>… Screenreader-Nutzer können z.B. zum Hauptinhalt springen (wenn ihr Screenreader das anbietet).</p> <p>Für alle Nutzer: Ein(e) Browser(erweiterung) könnte anbieten, bei <code>time</code>-Elementen eine einfache Übernahme eines Termins in den Kalender zu ermöglichen.</p> <p>Für Autoren: Einfaches Styling für Elementtypen. Bspw. kein Zeilenumbruch in Datum/Uhrzeit:<br> <code class="language-css"><span class="token selector">time</span> <span class="token punctuation">{</span> <span class="token property">white-space</span><span class="token punctuation">:</span> nowrap <span class="token punctuation">}</span></code></p> <blockquote> <p>Wenn die genannten Punkte absolut zu beachten sind, warum hat das W3C dies nicht als Bedingung oder zumindest als Fehler deklariert, wenn man dagegen verstößt?</p> </blockquote> <p>Es gibt die <a href="https://www.w3.org/Translations/WCAG20-de/" rel="nofollow noopener noreferrer">Richtlinien für barrierefreie Webinhalte (WCAG)</a> und <a href="https://www.w3.org/Translations/WCAG20-de/#intro-related-docs" rel="nofollow noopener noreferrer">unterstützende Dokumente</a>.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718821#m1718821 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-08T01:01:21Z 2018-04-08T01:01:21Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@Henry</p> <blockquote> <blockquote> <p>Design ist keine Fassade.</p> </blockquote> <p>doch ist es.</p> </blockquote> <p>Nein.</p> <blockquote> <p>Mode zum Beispiel, oft nicht funktionell, Aussehen ist alles, leider.</p> </blockquote> <p>Auf dem Laufsteg, vielleicht. Ansonsten haben Kleidungsstücke jeweils einen Zweck und werden für diesen Zweck designt.</p> <p>Es gibt kein Design ohne Zweck; ansonst ist es – wie Aral Balkan immer sagt – Dekoration. Jemand, der irgendwas ohne Zweck „hübsch macht“, ist kein Designer, sondern Künstler, Dekorateur.</p> <blockquote> <p>Bei Webseiten sehe ich das aber anders. Für <strong>mich persönlich</strong> ist das auch immer eine Art Kunst, ähnlich einem Gemälde</p> </blockquote> <p>Design ist nicht Kunst.</p> <blockquote> <p>und so ist mir das Aussehen genau so wichtig(viell. sogar wichtiger) als der Inhalt.</p> </blockquote> <p>Das Aussehen transportiert den Inhalt; auch das gehört zu Design dazu.</p> <p>Beim Design kommt es aber weniger drauf an, ob ein Button nun blau oder türkis ist, sondern vielmehr, ob der Button überhaupt da sein muss.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718837#m1718837 Henry 2018-04-08T10:17:38Z 2018-04-08T10:17:38Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo Gunnar,</p> <p>danke für die Aufklärung.</p> <blockquote> <p>… Screenreader-Nutzer können z.B. zum Hauptinhalt springen (wenn ihr Screenreader das anbietet).</p> </blockquote> <p>Wobei das mit dem Hauptinhalt heute oft nicht mehr so einfach zu lokalisieren ist. Oft gibt es nicht den einen Hauptinhalt, sondern vieles, daher fände ich zb. <div class="maincontent"> sinnvoller. Hinzu kommt ja lazy-loading. Du stehst doch in Kontakt mit Marco Zehe, glaube ich zumindest, könntest du ihn nicht mal zu einem Artikel motivieren, was sich so in den Jahren verändert hat und wie groß der Nutzen von neuen Tags und Aria für ihn ist?</p> <blockquote> <p>Für alle Nutzer: Ein(e) Browser(erweiterung) könnte anbieten, bei <code>time</code>-Elementen eine einfache Übernahme eines Termins in den Kalender zu ermöglichen.</p> </blockquote> <p>Auch da, anstatt wieder ein neuer Tag, hätte da nicht ein Attribut bzw. neuesAttribut bsp. <span xtype="time" datetime="2003-04-14 21:00"> gereicht. Will damit sagen, zumindest programmiere ich so in zb. php, <strong>Mache den Kern so simple als möglich, Veränderungen und Ergänzungen möglichst modular, verändere nie den Kern, wo es nicht sein muss</strong>.</p> <blockquote> <p>Für Autoren: Einfaches Styling für Elementtypen. Bspw. kein Zeilenumbruch in Datum/Uhrzeit:<br> <code class="language-css"><span class="token selector">time</span> <span class="token punctuation">{</span> <span class="token property">white-space</span><span class="token punctuation">:</span> nowrap <span class="token punctuation">}</span></code></p> </blockquote> <p>Na ja, würde ja auch gehen: <code>[type="time"]{white-space: nowrap ;} bzw. fiktiv [xtype="time"]</code></p> <blockquote> <p>Es gibt die <a href="https://www.w3.org/Translations/WCAG20-de/" rel="nofollow noopener noreferrer">Richtlinien für barrierefreie Webinhalte (WCAG)</a> und [unterstützende Dokumente]</p> </blockquote> <p>Je eben, es sind Richtlinien, also Empfehlungen und keine Must-Do, wie es hier im Forum annonciert wird. Wenn die das genau so sehen würden, hätten die doch die Macht gehabt das zu erzwingen?</p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718839#m1718839 Henry 2018-04-08T11:13:42Z 2018-04-08T11:13:42Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo Gunnar,</p> <blockquote> <p>Auf dem Laufsteg, vielleicht. Ansonsten haben Kleidungsstücke jeweils einen Zweck und werden für diesen Zweck designt.</p> </blockquote> <p>Glaubst du das wirklich? Wir reden jetzt hier nicht von speziellen Outdoor-Klamotten, sondern von Alltagskleidung und ist die Funktionalität fast immer dem aktuellen Modegeschmack untergeordnet. Beobachte mal, wie oft Frauen (in den letzten Jahren auch immer mehr Männer) sich den Arsch abfrierern, aber dennoch die Kleidung nicht wechseln wollen, weil ist ja schick so, dieses Halbjäckchen, was sie gerade an hat. Na ja, und von Mode der 70er(schlaghosen, etc. brauch ich gar nicht anzufangen).</p> <p>Aber um das mal ganz klar zu sagen, wenn deine Aussage stimmen würde, gäbe es keine hochhackigen Schuhe, oder siehst du darin auch Zweck? Vermutlich tust du das, denn jetzt wirst du antworten wollen, es gibt ja den speziellen Zweck, Männer für den Anblick zu begeistern… (Was ich übrigens gottseidank nicht teile, für mich nur eine Modererscheinung, die allerdings schon viel zu lange anhält). Kurzum, mit Zweck meine ich allerdings einen echten Nutzen/Zweck wie Tragekomfort, Schutz, Wärme, usw…, und der ist oft nicht gegeben.</p> <blockquote> <p>Es gibt kein Design ohne Zweck; ansonst ist es – wie Aral Balkan immer sagt – Dekoration. Jemand, der irgendwas ohne Zweck „hübsch macht“, ist kein Designer, sondern Künstler, Dekorateur.</p> </blockquote> <p>Ja und? Gute Webdesigner kann man oft m.M.n. gerechtfertigterweise als Künstler bezeichnen, als zb. <a href="https://www.welt.de/kultur/article876097/Auch-Mark-Rothko-darf-70-Millionen-kosten.html" rel="nofollow noopener noreferrer">drei Farben auf einer Leinwand</a>.</p> <p>Der folgende Screenshot bringt mich zu einer anderen Frage, darf man so was einfach publizieren? Falls nicht, bitte wieder löschen.</p> <p><a href="/images/ebb73a63-dd29-42a3-ae4d-1289323bb8f3.png" rel="noopener noreferrer"><img src="/images/ebb73a63-dd29-42a3-ae4d-1289323bb8f3.png?size=medium" alt="" loading="lazy"></a></p> <blockquote> <p>Design ist nicht Kunst.</p> </blockquote> <p>Darüber streiten die Gelehrten noch, genauso über den begriff Kunst allgemein. Ich mache es mir da einfach und unterscheide erst mal gar nicht und bilde mir eine (lediglich) persönliche Meinung nach Abschluss der Arbeit.</p> <blockquote> <p>Beim Design kommt es aber weniger drauf an, ob ein Button nun blau oder türkis ist, sondern vielmehr, ob der Button überhaupt da sein muss.</p> </blockquote> <p>Sag das mal einem Mode<strong>designer</strong> wie Lagerfeld </p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718848#m1718848 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-08T14:28:54Z 2018-04-08T15:15:06Z Welchen nutzen haben die Bezeichner id und for im HTML <p>@@Henry</p> <blockquote> <p>Wobei das mit dem Hauptinhalt heute oft nicht mehr so einfach zu lokalisieren ist. Oft gibt es nicht den einen Hauptinhalt, sondern vieles,</p> </blockquote> <p>Über die Seite zerstreut?</p> <blockquote> <p>daher fände ich zb. <div class="maincontent"> sinnvoller.</p> </blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>maincontent<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>Hauptsächlich wäre zu sagen, dass …<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#main2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>lesen Sie weiter<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>bullshit<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>Das hat mit der Sache überhaupt nichts zu tun.<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>maincontent<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>main2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>Hach, da sind Sie ja wieder. Wo waren wir stehengeblieben?<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>Inwiefern soll das sinnvoll sein?</p> <blockquote> <p>Auch da, anstatt wieder ein neuer Tag, hätte da nicht ein Attribut bzw. neuesAttribut bsp. <span xtype="time" datetime="2003-04-14 21:00"> gereicht.</p> </blockquote> <p>HTML5 ist eben den umgekehrten Weg gegangen und hat aus häufig verwendeten Attributwerten wie "header", "footer", "main(content)" usw. Elementtypen gemacht. Welchen Vorteil hätte es, nur einen Elementtypen zu verwenden und die Art des Elements in einem zusätzlichen Attribut anzugeben?</p> <pre><code class="block bad language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>maincontent<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>heading<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Die Hauptsache<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>paragraph<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Hauptsächlich wäre zu sagen, dass …<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>gegenüber</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>main</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h1</span><span class="token punctuation">></span></span>Die Hauptsache<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h1</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>Hauptsächlich wäre zu sagen, dass …<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>main</span><span class="token punctuation">></span></span> </code></pre> <p>Ich sehe den Nachteil, dass der Quelltext mit lauter <code>div</code>s schlechter lesbar wäre. (s.a. <a href="https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718813#m1718813" rel="noopener noreferrer">dieses Posting</a> ab „Das kann ich bestätigen.“)</p> <p>Außerdem kann man für verschiedene Elementtypen Regeln angeben; bspw. <code>main</code> darf nicht in <code>header</code> vorkommen. Wie willst du das mit Attributen machen? <code>div</code> darf in <code>div</code> vorkommen; es sei denn, es handelt sich um eines mit einem <code>type</code>-Attribut mit dem Wert "maincontent", welches nicht in einem solchen mit einem <code>type</code>-Attribut mit dem Wert "header" vorkommen darf; oder es handelt sich um …</p> <p>Da kommste in Teufels Küche. HTML ist jetzt schon überfrachtet mit solchen Wenn-dann-ansonsten-Regeln – was es früher nicht gab, als HTML noch über eine einfache DTD definiert wurde.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718840#m1718840 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-08T11:27:57Z 2018-04-08T11:28:35Z Welchen nutzen haben die Bezeichner id und for im HTML <p>hallo</p> <p>Die Frage ist, ist Design eine Fassade?</p> <p>Wenn Design auch das bezeichnet, was für unsere Sinne unmittelbar erfahrbar ist, so bezeichnet Design auch die nur mittelbaren Eigenschaften.</p> <p>Aber eins kann man über Design gewiss sagen: Es ist kein Zufallsprodukt sondern widerspiegelt im Optimalfall gewollte und gut informierte Entscheidungen. Und bereffs Webdesign ist gemeint, dass man seine Designentscheidungen auf der Basis wie der offensichtlichen wie auch der eher verborgenenen Eigenschaften fälle.</p> <p>Ob jemand mit diesen Entscheidungen nicht einverstanden ist, ist eine andere Frage.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718841#m1718841 Henry 2018-04-08T11:41:05Z 2018-04-08T11:41:05Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo beatovich,</p> <blockquote> <p>Und bereffs Webdesign ist gemeint, dass man seine Designentscheidungen auf der Basis wie der offensichtlichen wie auch der eher verborgenenen Eigenschaften fälle.</p> </blockquote> <p>Im Grunde bestimmt das anvisierte Ziel den Ansatz. Design fürs Marketing bzw. kommerziellen Nutzen, lässt dem "Künstler" relativ wenig Spielraum, weil dort psychologische Aspekte primär abzuhandeln sind (und btw. @Gunnar gerade da ist sogar oft die Farbe des Buttons sehr wichtig. *behaupten zumindest Medienpsychologen), während rein privates bzw. künstlerisches Design alle Freiheiten genießt.</p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718842#m1718842 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-08T12:19:03Z 2018-04-08T12:19:03Z Welchen nutzen haben die Bezeichner id und for im HTML <p>hallo</p> <blockquote> <p>Im Grunde bestimmt das anvisierte Ziel den Ansatz. Design fürs Marketing bzw. kommerziellen Nutzen, lässt dem "Künstler" relativ wenig Spielraum, weil dort psychologische Aspekte primär abzuhandeln sind (und btw. @Gunnar gerade da ist sogar oft die Farbe des Buttons sehr wichtig. *behaupten zumindest Medienpsychologen), während rein privates bzw. künstlerisches Design alle Freiheiten genießt.</p> </blockquote> <p>Ein Künstler ist ein Gestaltforscher, sein Werk ein Experiment. Natürlich will man sich in bestimmten Situationen nicht auf Experimente verlassen.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718843#m1718843 Henry 2018-04-08T12:47:10Z 2018-04-08T12:47:10Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo beatovich,</p> <blockquote> <p>Ein Künstler ist ein Gestaltforscher, sein Werk ein Experiment. Natürlich will man sich in bestimmten Situationen nicht auf Experimente verlassen.</p> </blockquote> <p>Wenn der Begriff denn so einfach zu definieren wäre. Nicht nur, dass es nahezu unbegrenzte Ansichten dazu gibt, diese ändern sich auch noch im Lauf der Zeitgeschichte.</p> <p><a href="https://de.wikipedia.org/wiki/Kunst" rel="nofollow noopener noreferrer">https://de.wikipedia.org/wiki/Kunst</a></p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718844#m1718844 beatovich https://beat-stoecklin.ch/pub/musik-gitarrenunterricht-laufental.html 2018-04-08T13:21:47Z 2018-04-08T13:21:47Z Welchen nutzen haben die Bezeichner id und for im HTML <p>hallo</p> <blockquote> <p>Wenn der Begriff denn so einfach zu definieren wäre. Nicht nur, dass es nahezu unbegrenzte Ansichten dazu gibt, diese ändern sich auch noch im Lauf der Zeitgeschichte.</p> </blockquote> <p>Wenn Begriffe (für dich) zu schwierig sind, dann solltest du sie gar nicht erst in eine Diskussion argumentativ einführen. Das war ein Kunstschuss in den Fuss.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718845#m1718845 Henry 2018-04-08T13:33:11Z 2018-04-08T13:33:11Z Welchen nutzen haben die Bezeichner id und for im HTML <p>Hallo beatovich,</p> <blockquote> <p>Wenn Begriffe (für dich) zu schwierig sind.…</p> </blockquote> <p>ziemlich überheblich.</p> <blockquote> <p>Das war ein Kunstschuss in den Fuss.</p> </blockquote> <p>wohl eher für dich. Sehr anmaßend von dir deine, von irgendwoher zitierte, Definition als allgemeingültig festzulegen.</p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718873#m1718873 at 2018-04-08T21:18:29Z 2018-04-08T21:18:29Z bootstrap <p>Hallo marctrix,</p> <p>ich zitiere mal nur den ersten Absatz, meine aber auch die darauf folgenden.</p> <blockquote> <p>Die Komponenten sind halt out-of-the-box nutzbar. Dafür muss man sich mit total bescheuerten Namen rumschlagen, wie z.B. error für rot. WTF?</p> </blockquote> <p>Ich verstehe zumindest intellektuell die Kritik an präsentationsbezogenen Klassenbezeichnungen, auch wenn ich mit ihr nicht übereinstimme. Die Kritik an semantischen Klassenbezeichnungen, noch dazu wenn es dafür keine besser geeigneten vorgefertigten Elemente oder Attribute gibt, kann ich hingegen nicht einmal nachvollziehen. Auf mich wirkt diese Kritik daher so, als sei das Verständnis für semantische Klassenbezeichnungen der anderweitig begründeten Abneigung gegenüber Bootstrap zum Opfer gefallen.</p> <p>Die semantische Klassen(teil)bezeichnung – du nennst sie <code>error</code>, in Bootstrap heißt sie <code>danger</code> – steht eben nicht für rot, sondern für die Kennzeichnung eines kritischen Zustandes oder kritischer Auswirkungen, so wie <code><h1></code> auch nicht für großen, fetten Text steht, sondern für die in ihrem Kontext wichtigste Überschrift. Wenn die nun weniger groß werden soll, ersetzt sie doch hoffentlich auch niemand durch beispielsweise eine <code><h3></code>. Ebenso spricht nichts dafür, bei der Verwendung von Bootstrap semantische Klassenbezeichnungen gegen irgendetwas anderes auszutauschen.</p> <p>Es ist ja durchaus nicht so, dass Bootstrap nur von Menschen verwendet wird, die gar kein CSS können. Es wird aber häufig von Menschen eingesetzt, die nicht selbst herumtüfteln wollen, bis die Bestandteile ihrer Website beispielsweise gefällige Dimensionen und Abstände zueinander haben. CSS lernt sich für viele, insbesondere Entwickler, einfacher als die Regeln übersichtlicher und harmonischer Gestaltung, wie einem immer wieder geradezu schmerzhaft vor Augen geführt wird. Elementen in bestimmten Fällen eine andere Farbe zuzuweisen, ist denen in aller Regel möglich, auch weil Bootstrap sichtlich darum bemüht ist, die Spezifität seiner CSS-Regeln gering zu halten.</p> <p>MfG, at</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718877#m1718877 Henry 2018-04-08T22:48:20Z 2018-04-08T23:05:21Z bootstrap <p>Hallo at,</p> <blockquote> <p>Auf mich wirkt diese Kritik daher so, als sei das Verständnis für semantische Klassenbezeichnungen der anderweitig begründeten Abneigung gegenüber Bootstrap zum Opfer gefallen.</p> </blockquote> <p>Hat sicherlich Einfluss darauf.</p> <blockquote> <p>Es wird aber häufig von Menschen eingesetzt, die nicht selbst herumtüfteln wollen, bis die Bestandteile ihrer Website beispielsweise gefällige Dimensionen und Abstände zueinander haben.</p> </blockquote> <p>Das funktioniert aber nur, wenn bei fertigen Templates nur der Inhalt ausgetauscht wird, was ja auch in den meisten Fällen so ist. Nur, warum dann noch Bootstrap, gibt schließlich auch schöne Templates ohne Bootstrap?</p> <p>Ich sehe das so, wenn in einer relativ(also simplen) überschaubaren Bootstrap-seite im Schnitt >100 mal <div> vorkommt, ist irgendwas schief gelaufen. Warum dennoch der Erfolg von Bootstrap? Nicht weil es so leicht anpassbar wäre, was es nämlich nicht ist (wenn man eigene Vorstellungen hat und nicht nur das Template 1:1 nutzt), sondern weil Menschen sich täuschen lassen, tolles Riesenbild, Schriftgrösse riesig, viele Animationen… (Sieht alles eindrucksvoll aus und ist doch in Wahrheit sehr leicht selbst zu coden) Bootstrap ist nicht nur ein Layout sondern zugleich ein Sammelsurium von Javascriptspielereien, die auch wiederum auf Jquery basieren, auch wenn sie es bootstrap-eigen suggerieren. Das sieht erst mal gut aus und macht Eindruck auf den Normaluser. Kann ich alles nachvollziehen, nicht aber bei Fachleuten, die in der Lage sein müssten gleichwertige Templates mit max 20% des Codes zu produzieren, und ohne Hilfen wie Jquery, usw… Aber, und diese Frage habe ich hier schon oft gestellt ohne bisher mal eine Antwort zu bekommen, warum haben die meisten Fachleute, selbst eine eher weniger ansehnliche Seite, fehlt die Kreativität? Dann ist natürlich auch der Hang zu fertigen Templates verständlich, muss aber <a href="https://templated.co/" rel="nofollow noopener noreferrer">dennoch nicht Bootstrap</a> sein.<strong>>100 DIV kann nicht der richtige Weg sein.</strong> </p> <p>Gruss<br> Henry</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718883#m1718883 marctrix self@mhis.de http://mhis.de 2018-04-09T06:47:09Z 2018-04-09T06:53:48Z bootstrap <p>Hej at,</p> <blockquote> <p>ich zitiere mal nur den ersten Absatz, meine aber auch die darauf folgenden.</p> <blockquote> <p>Die Komponenten sind halt out-of-the-box nutzbar. Dafür muss man sich mit total bescheuerten Namen rumschlagen, wie z.B. error für rot. WTF?</p> </blockquote> <p>Ich verstehe zumindest intellektuell die Kritik an präsentationsbezogenen Klassenbezeichnungen, auch wenn ich mit ihr nicht übereinstimme. Die Kritik an semantischen Klassenbezeichnungen, noch dazu wenn es dafür keine besser geeigneten vorgefertigten Elemente oder Attribute gibt, kann ich hingegen nicht einmal nachvollziehen.</p> </blockquote> <p>Nach den Diskussionen zu urteilen, in denen du dich zu Bootstrap geäußert hast, denke ich mal, dass du es besser machst.</p> <p>Wenn du meine anderen Postings liest, wirst du feststellen, das Bootstrap meiner hier nirgends widerlegten Meinung nach (wie viele andere Frameworks) ausschließlich dazu genutzt wird, Entwicklern die Arbeit zu machen. Nicht dazu, effizient gute Seiten zu erstellen. Seltene Ausnahmen bestätigen die Regel.</p> <p>Und ich habe erläutert, warum ich der Meinung bin, dass Bootstrap selber durch sein Auftreten, die Auswahl von Vorzeige-Websites uswusf zu genau diesem Verhalten animiert.</p> <p>Dein Argument klingt so wie die der Waffenlobby in Amerika (Waffen töten keine Menschen, Menschen töten Menschen) oder: nur weil Ferrari-Käufer gerne schnell fahren, ist es doch nicht die schuld von Ferrari, dass die Fahrer sich nicht an Verkehrsregeln halten.</p> <p>Für mich ist es eher so, dass ich davon überzeugt bin, dass es den meisten Männern (und vielen Frauen) schwer fällt, sich in einem Ferrari an die Geschwindigkeitsbegrenzung zu halten, weil das Auto einfach nach einem mindestens gelegentlichen Tritt aufs Gaspedal schreit.</p> <p>Bootstrap dagegen spricht den faulen Schweinehund in uns an. Wenn man Bootstrap verwendet ist eine Seite recht schnell “hübsch”. Wie viele Webseiten-Betreiber machen sich dann noch ernsthaft die Mühe, das Bootstrap-CSS umzuschreiben oder statt der bereitgestellten Klassen eigene zu verwenden?</p> <p>Es gib keine Statistik darüber, aber ich behaupte jetzt mal rotzfrech, dass mehr als die Hälfte der Seiten, die mit Bootstrap erstellt wurden, an roten Elementen die Klasse <code>danger</code> stehen haben. Dabei: Gefahrenhinweise dürften in Webseiten extrem selten vorkommen.</p> <p>Wozu also eine Klasse <code>danger</code> unter dem Deckmäntelchen von Semantik bereitstellen, wenn es in der Praxis auf den meisten Sites keine Anwendungsmöglichkeit dafür gibt? Doch wohl nur als Feigenblatt! Um hinterher Menschen wie dir die Möglichkeit geben zu können, Bootstrap stelle ja semantische Klassen bereit und die dummen Anwender benutzen sie halt falsch.</p> <p>Was sollen sie denn sonst tun? Auf die schönen fertigen Komponenten verzichten und eigene schreiben? — Wozu dann überhaupt noch Bootstrap verwenden?</p> <p>Insofern verstehe ich nicht, wie du Probleme haben kannst, meine Argumentation nachzuvollziehen.</p> <p>Selbst das Argument mit der Ästhetik ist fadenscheinig. Wenn man dem halben Web ansieht, dass es mit 12-spalten-Grid-Systemen erstellt ist, die mehr oder weniger alle auf 960px o.ä. basieren, ist es irgendwie auch ganz schön langweilig. Da bin ich um jedes Fefes Blog, Space Jam oder Hamsterrad-Hausfrauen-Seitchen froh, das sich mal nicht an das Raster hält.</p> <p>Leider ist es dann auch mit der Zugänglichkeit [1] nicht weit her, aber ich habe mich jetzt mal hier auf den Aspekt der Hübschheit bezogen…</p> <p>Marc</p> <p>[1] Die dürfte bei Bootstrap 4 Seiten in vielen Fällen besser sein!</p> <p>PS: In die Argumentation, warum ich selber Bootstrap nciht einsetze, bin ich ja irgendwie „reingeraten“. Ich habe ja nichts dagegen, wenn jemand anders mit bootstrap arbeite, wenn er es ordentlich macht. Was ich hier nur zu Beginn der Diskussion gesagt habe: HTML und CSS muss man trotzdem lernen und meiner Meinung nach kann man (muss man aber nicht) auf Bootstrap dann ziemlich einfach verzichten.</p> <p>PPS: Das Design sollte von einem Designer entwickelt werden, das Frontend von einem Frontender und das Backend von einem Backender. Wenn eine Seite doof aussieht, weil der Entwickler kein Designer ist, ist Bootstrap nicht die Lösung. In Firmen, die zu klein für Spezialisierung sind, muss man sich halt Freelancer mit ins Boot holen. Oder man macht halt halbgares Zeug, sollten dann aber auch dazu stehen und nicht so tun, als ließe sich der Mangel an Kompetenz mit einem Haufen Tools ersetzen, die in den Händen ungelernter niemals ihr volles Potential entfalten werden…</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718949#m1718949 Gunnar Bittersmann selfhtml@bittersmann.de https://bittersmann.de 2018-04-09T12:19:16Z 2018-04-09T12:19:16Z bootstrap <p>@@at</p> <blockquote> <p>Die semantische Klassen(teil)bezeichnung – […] <code>danger</code> steht eben nicht für rot, sondern für die Kennzeichnung eines kritischen Zustandes oder kritischer Auswirkungen</p> </blockquote> <p>Gute Frage: Gibt es in Bootstrap semantische Klassenbezeichnungen?</p> <p>Ja, die gibt es. Und nein, die gibt es nicht.</p> <p><code>danger</code> ist ein gutes Beispiel dafür: Hinweismeldungen bei nicht vollständig oder nicht richtig ausgefüllten Formularfeldern sollen auf rotem Hintergrund angezeigt werden. Nun haben nicht vollständig oder nicht richtig ausgefüllte Formularfelder aber keine kritischen Auswirkungen; sie sind nicht <code>danger</code>. Sie sind <code>warning</code>. Bei <code>warning</code> werden sie aber auf gelbem Hintergrund angezeigt …</p> <p>Nun gibt es zwei Möglichkeiten, die Hinweismeldungen rot zu bekommen. Der richtige™ Weg wäre, im eigenen Stylesheet der Klasse <code>alert-warning</code> roten Hintergrund zu verpassen. (Und der Klasse <code>alert-danger</code> zusätzlich einen Totenkopf, oder blinken lassen.) Das wird aber nicht gemacht.</p> <p>Stattdessen wird den Hinweismeldungen die Klasse <code>alert-danger</code> verpasst. (Und das denke ich mir nicht aus, das habe ich genauso erlebt.) Sie sind rot, alles schick. <code>danger</code> steht eben <strong>doch</strong> für rot.</p> <p>Die Klassen sollten nicht <code>*-danger</code> und <code>*-warning</code> heißen, sondern gemäß ihrer Verwendung <code>bg-red</code> und <code>bg-yellow</code>. Wenn schon präsentationsbezogenes Markup, dann richtig!</p> <p>Nun könnte man auf die Idee kommen und sagen: Bootstrap macht alles richtig, es wird von Entwicklern nur falsch verwendet. Unsinn! Die Entwickler verwenden es genau so, wie es ihrer Motivation entspricht, warum sie Bootstrap überhaupt verwenden – nämlich um die Darstellung im Markup zu kontrollieren, nicht per CSS. Um keine Zeile CSS schreiben zu müssen – weil sie es nicht wollen oder weil sie es gar nicht können.</p> <p>Den Anwendern von Bootstrap ist da gar kein Vorwurf zu machen. Der Vorwurf geht an die Entwickler von Bootstrap: Sie haben keine oder eine falsche Vorstellung, wer denn ihre Zielgruppe ist.</p> <p>Semantische Klassenbezeichnungen in Bootstrap sind ein Mythos.</p> <p>LLAP </p> <div class="signature">-- <br> <em>„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“</em> —Kurt Weidemann </div> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718882#m1718882 dedlfix 2018-04-09T06:22:38Z 2018-04-09T06:22:38Z bootstrap <p>Tach!</p> <blockquote> <blockquote> <p>Es wird aber häufig von Menschen eingesetzt, die nicht selbst herumtüfteln wollen, bis die Bestandteile ihrer Website beispielsweise gefällige Dimensionen und Abstände zueinander haben.</p> </blockquote> </blockquote> <p>Genau das ist mein Grund, es zu verwenden.</p> <blockquote> <p>Das funktioniert aber nur, wenn bei fertigen Templates nur der Inhalt ausgetauscht wird, was ja auch in den meisten Fällen so ist. Nur, warum dann noch Bootstrap, gibt schließlich auch schöne Templates ohne Bootstrap?</p> </blockquote> <p>Fertige Templates brauche ich beispielsweise nicht, ich nehme das Baukastensystem und baue mir daraus meine Oberfläche. Ein anderes Template müsste genauso komponentenbasiert sein und nicht nur sozusagen 90% fertig sein plus einzufügende Texte.</p> <p>Wenn du hingegen mit fertigen Templates zufrieden bist, oder dich hauptsächlich bei den Bootstrap-Template-Anbietern umschaust (oder das für deine Zwecke zumindest dienlich sein könnte), dann hast du eine andere Herangehensweise/Notwendigkeit als ich. Dann bietet dir auch Bootstrap vermutlich nicht mehr als jedes andere "90%-Template".</p> <blockquote> <p>Ich sehe das so, wenn in einer relativ(also simplen) überschaubaren Bootstrap-seite im Schnitt >100 mal <div> vorkommt, ist irgendwas schief gelaufen. Warum dennoch der Erfolg von Bootstrap? Nicht weil es so leicht anpassbar wäre, was es nämlich nicht ist (wenn man eigene Vorstellungen hat und nicht nur das Template 1:1 nutzt),</p> </blockquote> <p>Wenn du 90% umschreiben musst, um zu deinen Vorstellung von Aussehen zu kommen, dann ist Bootstrap vielleicht das falsche Werkzeug für dich. Aber das muss ja nicht auf alle anderen zutreffen. Das was ich anpassen wollte, habe ich bisher ohne Probleme hinbekommen. Aber da du hier Template erwähnst, hast du vielleicht die negativen Erfahrungen mit einem (oder mehreren) speziellen Template(s) gemacht und nicht mit dem grundlegenden Baukastensystem. Das kann bei individuellen Templates durchaus so sein, dass man da hin zu 90% geht und nicht nur den Rahmen plus Bausteine hat. Diese Erfahrung teile ich übrigens auch, dass ein dem Aussehen nach für den eigenen Zweck passend erscheinendes Template einige Fummelei bedeuten kann, hat(te in dem Fall) aber mit dem eigentlichen Bootstrap nicht viel gemein.</p> <blockquote> <p>sondern weil Menschen sich täuschen lassen, tolles Riesenbild, Schriftgrösse riesig, viele Animationen… (Sieht alles eindrucksvoll aus und ist doch in Wahrheit sehr leicht selbst zu coden)</p> </blockquote> <p>Dazu zähle ich mich nicht. Animationen fliegen bei mir als erstes raus, wenn ich eine Projektvorlage nehme. Tolles Riesenbild kann auf der Startseite als Blickfang liegen, wenn es nicht grad eine Intranetanwendung ist, die sich nicht erst noch ihre Anwender suchen muss. Riesige Schrift ist den kleinen Mobilbildschirmen geschuldet. Überall hat die aber auch nichts zu suchen. Ich erinnere mich aber noch genau an die Zeit bevor die Mobilen ihren Siegeszug antraten, da brauchte ich eine Mindestschriftgröße im Browser, weil jede Website es damals schick fand, in 5px-Schrift daherzukommen.</div class="kleine übertreibung"><sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup></p> <blockquote> <p>Bootstrap ist nicht nur ein Layout sondern zugleich ein Sammelsurium von Javascriptspielereien, die auch wiederum auf Jquery basieren, auch wenn sie es bootstrap-eigen suggerieren.</p> </blockquote> <p>Nicht wenn ich es zusammen mit Angular einsetze, da verwende ich mit ngx-bootstrap eine JQuery-freie Integration von Bootstrap-Komponenten in Angular.</p> <p>Abgesehen davon, braucht man für die gleichen Spielereien auf Nicht-Bootstrap-Seiten ebenfalls Javascript. Das ist also keine Besonderheit von Bootstrap. Man kann es auch ohne Javascript verwenden, wenn man diese Komponenten nicht braucht.</p> <blockquote> <p>Das sieht erst mal gut aus und macht Eindruck auf den Normaluser. Kann ich alles nachvollziehen, nicht aber bei Fachleuten, die in der Lage sein müssten gleichwertige Templates mit max 20% des Codes zu produzieren, und ohne Hilfen wie Jquery, usw…</p> </blockquote> <p>Die Stimmen der Fachleute kamen ja auch hier deutlich zum Vorschein, und sie schlugen in deine Kerbe.</p> <blockquote> <p>Aber, und diese Frage habe ich hier schon oft gestellt ohne bisher mal eine Antwort zu bekommen, warum haben die meisten Fachleute, selbst eine eher weniger ansehnliche Seite, fehlt die Kreativität?</p> </blockquote> <p>Na aber hallo, warum gibt es wohl Fachleute? Weil nicht jeder überall so gut sein kann, wie ein Fachleut auf seinem Gebiet. Kreativität im Gestalten ist genauso eine Fähigkeit wie logisches Denken fürs Programmieren. Da hat nicht jeder gleich viel in seinem Repertoire.</p> <blockquote> <p>Dann ist natürlich auch der Hang zu fertigen Templates verständlich, muss aber <a href="https://templated.co/" rel="nofollow noopener noreferrer">dennoch nicht Bootstrap</a> sein.<strong>>100 DIV kann nicht der richtige Weg sein.</strong> </p> </blockquote> <p>Wie gesagt, das Bootstrapverwenderbild, das du hier vom beschreibst, trifft auch mich nicht zu. Wie da allerdings die Zahlenverteilung bei den Verwendern ist, die Bootstrap als grundlegendes Komponentensystem vs. auf Bootstrap aufbauende Templates verwenden, mag ich nicht beurteilen.</p> <p>dedlfix.</p> <hr class="footnotes-sep"> <section class="footnotes"> <ol class="footnotes-list"> <li id="fn1" class="footnote-item"><p>Wir wollen mal nicht zu viel Semantik hier reinbringen. <a href="#fnref1" class="footnote-backref">↩︎</a></p> </li> </ol> </section> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718885#m1718885 marctrix self@mhis.de http://mhis.de 2018-04-09T07:01:02Z 2018-04-09T07:01:02Z bootstrap <p>Hej dedlfix,</p> <p>ist mir wichtig zu sagen, dass ein Plus von mir ist… </p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718904#m1718904 dedlfix 2018-04-09T09:26:25Z 2018-04-09T09:26:25Z bootstrap <p>Tach!</p> <blockquote> <p>Wenn du meine anderen Postings liest, wirst du feststellen, das Bootstrap meiner hier nirgends widerlegten Meinung nach (wie viele andere Frameworks) ausschließlich dazu genutzt wird, Entwicklern die Arbeit zu machen. Nicht dazu, effizient gute Seiten zu erstellen. Seltene Ausnahmen bestätigen die Regel.</p> </blockquote> <p>Ist es denn bei den Frontendern so unüblich, Komponenten zu verwenden, die von anderen geschrieben wurden? Als Programmierer ist es nicht unüblich, Frameworks zu verwenden, die einem einen Großteil der nicht zum eigentlichen Anwendungsfall gehörenden Arbeit abnehmen und/oder einen Rahmen vorgeben, den man mit der Individualität der Anwendung füllt. Natürlich gibts auch da welche, die lieber alles zu Fuß entwickeln, außer der verwendeten Programmiersprache. Aus dieser Sicht jedenfalls empfinde ich Bootstrap als die Fortsetzung dieser Wiederverwendungsidee. Es muss nicht unbedingt Bootstrap sein, auch andere ähnliche Systeme, wie Material Design können dazu zählen. (Material Design hab ich mir aber noch nicht genauer angeschaut, da mag ich auch falsch liegen mit der Einschätzung.)</p> <blockquote> <p>Bootstrap dagegen spricht den faulen Schweinehund in uns an. Wenn man Bootstrap verwendet ist eine Seite recht schnell “hübsch”.</p> </blockquote> <p>Auch der Mangel an gestalterischer Kreativität ist es bei mir. Meine Anwendungen aus früherer Zeit entsprachen hinter den Kulissen auch bereits meinem damaligen Kenntnisstand und dem damals üblichen, hatten aber außer Funktionalität nichts zu bieten. War alles nur Intranet-Zeugs, nichts öffentliches. Aber auch damals sah die Intranetanwendung für die ganze Firma besser aus als das Werkzeug für drei Kollegen und mich, weil ich mich bei ersterer an die Vorgaben des Intranetauftritts halten konnte.</p> <p>Es ist die Gesamtheit des Bootstrap-Ansatzes, der mir hilft, eine optische Konsistenz zu meiner Anwendung hinzuzufügen, die ich mit den nativen Elementen von CSS nicht so hinbekomme.</p> <blockquote> <p>Wie viele Webseiten-Betreiber machen sich dann noch ernsthaft die Mühe, das Bootstrap-CSS umzuschreiben oder statt der bereitgestellten Klassen eigene zu verwenden?</p> </blockquote> <p>Das würde nach meiner Ansicht der Idee des Baukastensystems auch zuwiderlaufen, wenn man sich da noch um großartige Individualität innerhalb der Bausteine kümmern müsste.</p> <blockquote> <p>Es gib keine Statistik darüber, aber ich behaupte jetzt mal rotzfrech, dass mehr als die Hälfte der Seiten, die mit Bootstrap erstellt wurden, an roten Elementen die Klasse <code>danger</code> stehen haben. Dabei: Gefahrenhinweise dürften in Webseiten extrem selten vorkommen.</p> </blockquote> <p>Vielleicht. Bei mir ist rot nur am Löschbestätigungsbutton oder Fehlermeldungen zu finden. Passt also, wie ich finde. Bei Anwendungen, die Werkzeug sind, habe ich keine großartige Intention, die Farben anders als nach dieser Einteilung und für den ungefähr vorgesehenen Zweck zu verwenden.</p> <blockquote> <p>Wozu also eine Klasse <code>danger</code> unter dem Deckmäntelchen von Semantik bereitstellen, wenn es in der Praxis auf den meisten Sites keine Anwendungsmöglichkeit dafür gibt?</p> </blockquote> <p>Seh ich nicht ganz so verbissen. Wie die Klassennamen heißen, ist doch außer für den Entwickler nicht weiter relevant? Die könnte auch ein Minifizierer problemlos ersetzen.</p> <blockquote> <p>Um hinterher Menschen wie dir die Möglichkeit geben zu können, Bootstrap stelle ja semantische Klassen bereit und die dummen Anwender benutzen sie halt falsch.</p> </blockquote> <p>Welche Auswirkungen hat die Semantik an der Stelle auf andere als den/die Entwickler? Stört das Besucher beim Bedienen der Seite, wenn die Begriffe falsch verwendet werden?</p> <blockquote> <p>Was sollen sie denn sonst tun? Auf die schönen fertigen Komponenten verzichten und eigene schreiben? — Wozu dann überhaupt noch Bootstrap verwenden?</p> <p>Insofern verstehe ich nicht, wie du Probleme haben kannst, meine Argumentation nachzuvollziehen.</p> </blockquote> <p>Man könnte das auch so sehen, dass ihr die Probleme der Verwender nicht wahrhaben wollt. Wenn sie (oder ich) Bootstrap nicht verwenden, dann lösen sich die Probleme mit Bootstrap nicht auf, sondern werden durch noch größere ersetzt. Ein semantisch einwandfreier optischer Unfall verkauft sich jedenfalls nicht. Und auf Bootstrap oder ähnliche Baukästen zu verzichten, stellt mir auch noch keinen Volblut-Frontender an die Seite. Wenn ihr Bootstrap verschwinden sehen wollt, müsstet anfangen, für diese Herausforderungen Lösungen zu finden. "Nimm einen Frontender dazu" wäre aber zu einfach, jedenfalls solange der nicht genauso kostenfrei wie Bootstrap ist. All die Nachteile aufzuzählen bringt uns nicht weiter.</p> <p>dedlfix.</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1718921#m1718921 marctrix self@mhis.de http://mhis.de 2018-04-09T10:04:16Z 2018-04-09T10:06:00Z bootstrap <p>Hej dedlfix,</p> <blockquote> <blockquote> <p>Wenn du meine anderen Postings liest, wirst du feststellen, das Bootstrap meiner hier nirgends widerlegten Meinung nach (wie viele andere Frameworks) ausschließlich dazu genutzt wird, Entwicklern die Arbeit zu machen. Nicht dazu, effizient gute Seiten zu erstellen. Seltene Ausnahmen bestätigen die Regel.</p> </blockquote> <p>Ist es denn bei den Frontendern so unüblich, Komponenten zu verwenden, die von anderen geschrieben wurden?</p> </blockquote> <p>Es gibt zu wenige Frontender, als dass ich von üblich sprechen kann. Meistens müssen Leute das Frontend mitmachen, die ohne Bootstrap o.ä. aufgeschmissen sind und dann eben so etwas abliefern, was man als div-Wüste bezeichnet.</p> <p>Ich kann aber mal von mir reden. Ich bin ein großer Freund von Fertig-Lösungen, es ist nämlich ein Irrglaube, alles besser machen zu können, als andere.</p> <p>Oft steckt in einer einzelnen Komponente monatelange oder jahrelange Arbeit und hunderte von Rückmeldungen aus der Community — Bugmeldungen, Feature-Requests usw.</p> <p>Ich nehme dann aber gezielt einzelne Komponenten, wie ein responsives, barrierefreies Menü oder eine Lösung für Modals.</p> <p>Allerdings komme ich damit nicht immer hin, denn wenn das Design wirklich individuell ist, braucht es eine Individuallösung.</p> <p>Wenn die mit HTMl und CSS nicht umsetzbar ist, nehme ich mir immer Hilfe dazu, weil ich eben kein Programmierer bin und alles — den JS-Anteil in hoher Qualität abliefern möchte.</p> <p>Glücklicherweise ist die Self-Community ein reichhaltiger Experten-Pool, so dass ich immer die nötige Hilfe gefunden habe.</p> <blockquote> <p>Als Programmierer ist es nicht unüblich, Frameworks zu verwenden, die einem einen Großteil der nicht zum eigentlichen Anwendungsfall gehörenden Arbeit abnehmen und/oder einen Rahmen vorgeben, den man mit der Individualität der Anwendung füllt.</p> </blockquote> <p>Bei uns verwenden die Backender auch Frameworks. Ziemlich abschreckend für mich, weil ich oft zu hören bekomme, wie aufwändig es doch sei, meine Vorgaben umzusetzen mit ZEND/Symfony/Timeleaf und wie die alle heißen bei PHP und JAVa und natürlich den unterschiedlichen CMSen.</p> <p>Da sehe ich dasselbe Problem wie bei Bootstrap: es wird automatisch was generiert und am liebsten möchte man sich gar nicht mit der Anpassung und Konfiguration auseinandersetzen. Wenn man es doch tut, stellt man ferst, dass es dann sofort recht komplex wird. Man muss dann die ganzen Individualisierungen dokumentieren und anderen Teams bereit stellen, damit alle Zugriff haben. Im konkreten Projekt wird dafür keine Zeit für eingeplant und und irgendwie kommt dann am Ende oft etwas heraus, was für alle nur ein Kompromiss ist — jedenfalls wenn alle bemüht sind.</p> <p>Dabei ist es ja nicht so, dass die Backender Dinge, die sie selber verantworten müssen, nicht hochwertig umsetzen (Sicherheit, Effizienz, Performanz usw). Nur wenn man dann, wenn die mit ihrem Kram zufrieden sind, als außenstehender kommt und sagt, man möchte jetzt noch einen aus Usability- und Accessibility-Gründen draufsetzen, sind die Gesichter lang. Was ich durchaus verstehe.</p> <blockquote> <p>Natürlich gibts auch da welche, die lieber alles zu Fuß entwickeln, außer der verwendeten Programmiersprache. Aus dieser Sicht jedenfalls empfinde ich Bootstrap als die Fortsetzung dieser Wiederverwendungsidee. Es muss nicht unbedingt Bootstrap sein, auch andere ähnliche Systeme, wie Material Design können dazu zählen.</p> </blockquote> <p>Dann sähen alle Websites aus, wie von Google gemacht, wird Google sicher freuen…</p> <blockquote> <blockquote> <p>Bootstrap dagegen spricht den faulen Schweinehund in uns an. Wenn man Bootstrap verwendet ist eine Seite recht schnell “hübsch”.</p> </blockquote> <p>Auch der Mangel an gestalterischer Kreativität ist es bei mir.</p> </blockquote> <p>Und auch der Ausbildung. Design ist ja nicht umsonst ein Studiengang. Geht mir genauso, ich bin ja auch kein Designer. Ich verstehe mich als Schnittstelle (technisch) und Vermittler (menschlich) zwischen Design und Backend und kann keines von beiden, kann aber etwas (besser) was die anderen nicht/schlechter können als ich.</p> <blockquote> <p>Es ist die Gesamtheit des Bootstrap-Ansatzes, der mir hilft, eine optische Konsistenz zu meiner Anwendung hinzuzufügen, die ich mit den nativen Elementen von CSS nicht so hinbekomme.</p> </blockquote> <p>Dafür verwenden wir so genannte Design-Master, die eigentlich nichts anderes als Bootstrap sind, aber viel weniger können. Eben nur die Elemente beinhalten, die das Design vorsieht. Wenn eine Anwendung ein nicht vorhandenes Element/Komponente benötigt, wird diese ergänzt. Das liegt aber sicher auch an unserer Größe. Hier arbeiten ja allein in der IT mehr Menschen, als in einer mittelgroßen Agentur und wir haben zusätzlich externe Hilfe.</p> <p>Mit Extract (einer Möglichkeit aus Photoshop-Dateien gezielt Formatierungen in CSS zu exportieren) hat man aber eine Möglichkeit komplett individuell gestaltete Elemente aus den ungewöhnlichsten Designs zu übernehmen, ohne das überhaupt tippen zu müssen. Man baucht nur noch das HTML selber zu schreiben (muss man bei Bootstrap ja auch, wenn es semantisch und zugänglich sein soll).</p> <p>Es gibt viele Hilfen, die einem die Arbeit erleichtern, die ich selber nutze. Bis hin zur Code-Versollständigung des Editors, so dass man ja eh nicht Ballzuviel tippt.</p> <p>Für mich gilt ganz klar: ich verbringe viel mehr Zeit mit Konzept (also Denkerei), als mit dem Tippen von Code, weil ich darüber nachdenke, wie bleibt mein Kram erweiterbar, was gehört in den master, was in eine Projekt.css, um projektspezifische Abweichungen/Ergänzungen zu ermöglichen usw.</p> <p>Hängt sicher viel von meiner Arbeitsweise ab, dass mir nie klar geworden ist, wo Bootstrap und Co jetzt einen Vorteil bieten, der die für mich persönlich existierenden Nachteile aufwiegt.</p> <blockquote> <blockquote> <p>Wie viele Webseiten-Betreiber machen sich dann noch ernsthaft die Mühe, das Bootstrap-CSS umzuschreiben oder statt der bereitgestellten Klassen eigene zu verwenden?</p> </blockquote> <p>Das würde nach meiner Ansicht der Idee des Baukastensystems auch zuwiderlaufen, wenn man sich da noch um großartige Individualität innerhalb der Bausteine kümmern müsste.</p> </blockquote> <p>Eben. Deshalb ist es so schwer für mich, ein Layout, das am Anfang steht, danach mit einem Baukastensystem umzusetzen, dass von dem Layout nichts weiß. Das fängt schon damit an, dass ich vermutlich seit Jahren kein System mit 12 Rasterspalten benötigt habe.</p> <p>Wir brauchen eigentlich nur ganze Breite, 1/3 zu 2/3, 2/3 zu 1/3 und ganzer Viewport (für Tabellen o.ä), die aus dem System komplett ausbrechen (geht das mit Bootstrap?).</p> <blockquote> <blockquote> <p>Um hinterher Menschen wie dir die Möglichkeit geben zu können, Bootstrap stelle ja semantische Klassen bereit und die dummen Anwender benutzen sie halt falsch.</p> </blockquote> <p>Welche Auswirkungen hat die Semantik an der Stelle auf andere als den/die Entwickler? Stört das Besucher beim Bedienen der Seite, wenn die Begriffe falsch verwendet werden?</p> </blockquote> <p>Nirgends (außer theoretisch, dass man so etwas mal Parsen könnte - aber wer tut das schon).</p> <p>Aber ich als Entwickler muss ja immer wieder mal ran an den Code und dann soll es immer schnell gehen. Da bin ich schon froh, dass in meinen Seiten Elemente anhand ihrer Bedeutung unterscheidbar sind…</p> <blockquote> <p>Man könnte das auch so sehen, dass ihr die Probleme der Verwender nicht wahrhaben wollt.</p> </blockquote> <p>Wieso? - Ich habe ja nichts dagegen, wenn jemand anderes bootstrap verwendet (so lange zugängliche Seiten dabei raus kommen). Ich möchte es nur nicht selber anwenden müssen…</p> <p>Marc</p> https://forum.selfhtml.org/self/2018/apr/5/welchen-nutzen-haben-die-bezeichner-id-und-for-im-html/1719005#m1719005 dedlfix 2018-04-09T16:50:53Z 2018-04-09T16:50:53Z bootstrap <p>Tach!</p> <blockquote> <p>Wir brauchen eigentlich nur ganze Breite, 1/3 zu 2/3, 2/3 zu 1/3 und ganzer Viewport (für Tabellen o.ä), die aus dem System komplett ausbrechen (geht das mit Bootstrap?).</p> </blockquote> <p>Ja geht, man muss das Grid-System nicht verwenden. Auch ein Mischbetrieb ist möglich. Bootstrap ist da ja recht zurückhaltend. Wenn man deren Klassen nicht angibt, ist es Browser-Default (außer genereller Typographie für einige Elemente).</p> <p>Den Rest habe ich gelesen, möchte aber nicht weiter darauf eingehen, außer dass es auch mal interessant ist, andere Arbeitsweisen kennenzulernen.</p> <p>dedlfix.</p>