Mehrsprachigkeit, Beurteilung – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 14:15:13 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737039#m1737039 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737039#m1737039 <p>hallo</p> <p>Aufgabe: Erstelle eine Mehrsprachigkeit für die Kissthemes, die berücksichtigt, dass jede Seite mehr oder minder vollständige Übersetzungen beinhaltet mit jeweils eigenen Sprachoptionen.</p> <p>Lösungsnsatz:</p> <p>Syntaxguideline</p> <p>html lang=de</p> <p>Übersetzungstätigkeit: Konvertiere</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>Deutsch<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <p>nach</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>multi<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 attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>it<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Italiano<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>span</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fr<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Francais<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>span</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>de<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Deutsch<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>p</span><span class="token punctuation">></span></span> </code></pre> <p>Elementtypen spielen keine Rolle.</p> <p>Falls eine Sprachwahl vorliegt, wird diese im html-Element in data-lang gspeichert.</p> <p>Das zugehörige CSS.</p> <p>In _.lang ist der Wert von html lang gespeichert. Dieser Wert bleibt konstant.</p> <pre><code class="block language-css"> <span class="token selector">html[lang="'+_.lang+'"] [lang="multi"] > :not([lang="'+_.lang+'"])</span><span class="token punctuation">{</span><span class="token property">display</span><span class="token punctuation">:</span>none<span class="token punctuation">}</span><span class="token selector">\ html[data-lang="en"] [lang="multi"] > [lang="en"],\ html[data-lang="es"] [lang="multi"] > [lang="es"],\ html[data-lang="de"] [lang="multi"] > [lang="de"],\ html[data-lang="fr"] [lang="multi"] > [lang="fr"],\ html[data-lang="it"] [lang="multi"] > [lang="it"]</span><span class="token punctuation">{</span><span class="token property">display</span><span class="token punctuation">:</span>initial<span class="token punctuation">}</span><span class="token selector">\ html[data-lang] [lang="multi"] > [lang]:last-of-type</span><span class="token punctuation">{</span><span class="token property">display</span><span class="token punctuation">:</span>initial<span class="token punctuation">}</span><span class="token selector">\ html[data-lang="en"] [lang="multi"] > [lang="en"] ~ [lang="'+_.lang+'"],\ html[data-lang="es"] [lang="multi"] > [lang="es"] ~ [lang="'+_.lang+'"],\ html[data-lang="de"] [lang="multi"] > [lang="de"] ~ [lag="'+_.lang+'"],\ html[data-lang="fr"] [lang="multi"] > [lang="fr"] ~ [lang="'+_.lang+'"],\ html[data-lang="it"] [lang="multi"] > [lang="it"] ~ [lang="'+_.lang+'"]</span><span class="token punctuation">{</span><span class="token property">display</span><span class="token punctuation">:</span>none<span class="token punctuation">}</span>\ </code></pre> <p>Das funktioniert, sollte aber rationeller notiert werden.</p> <p>Allgemeine Mechanik</p> <ul> <li>WENN COOKIE -> data-lang = Cookie Wert</li> <li>SONST WENN QUERSTRING -> data-lang = QS Wert</li> <li>SONST keine spezifische Usersprache.</li> </ul> <p>Es ist zu erwarten, dass das Dokument-html von Autoren erstellt wird, die sehr wenig über html wissen. Die Syntax muss entsprechend einfach bleiben.</p> <p>Das hiessige Konzept stellt eine unnötige Schrierigkeit. Die Fallback-Sprachversion muss die letzte notierte Version sein (CSS kann anders nicht greifen.) Sprachversionen müssen unmittelbare Kinder des Elements mit lang="multi" sein.</p> <p>Einschränkung: Diese Form von Mehrsprachigkeit manipuliert keine einzelnen Attributwerte. Betroffen sind Attribute wie aria-label, title</p> <p>Eine funktionierende Implementation liegt vor.</p> <p>Ich möchte jetzt eure Kritik hören.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 14:34:59 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737040#m1737040 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737040#m1737040 <blockquote> <p>Es ist zu erwarten, dass das Dokument-html von Autoren erstellt wird, die sehr wenig über html wissen. Die Syntax muss entsprechend einfach bleiben.</p> </blockquote> <p>Autoren sollten mit der Sprachthematik gar nichts zu tun haben. Sondern einfach nur in ihrer Sprache schreiben.</p> <p>MfG</p> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 16:02:23 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737047#m1737047 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737047#m1737047 <p>@@beatovich</p> <blockquote> <p>Sprachversionen müssen unmittelbare Kinder des Elements mit lang="multi" sein.</p> </blockquote> <p>Welches es nicht geben sollte. <code>multi</code> ist kein gültiger Wert fürs <a href="https://w3c.github.io/html/dom.html#element-attrdef-global-lang" rel="nofollow noopener noreferrer"><code>lang</code>-Attribut</a>; das dürfen nur Sprachkürzel sein. Verwende bspw. <code>class="multilingual"</code>.</p> <p></p> <blockquote> <p>Das funktioniert, sollte aber rationeller notiert werden.</p> </blockquote> <p>Du willst also dasjenige Kind eines <code>.multilingual{:.language-css}</code>-Containers (um beim obigen Vorschlag zu bleiben) anzeigen, dessen Sprache mit der in <code>_.lang</code> vorgegebenen überseinstimmt, und wenn es kein solches gibt, dann das letzte?</p> <p>Also alle anderen ausblenden (hier in Sass-Syntax mit der vorgegebenen Sprache in <code>$lang</code>):</p> <pre><code class="block language-scss"><span class="token property"><span class="token variable">$lang</span></span><span class="token punctuation">:</span> <span class="token string">'en'</span><span class="token punctuation">;</span> .multilingual <span class="token operator">></span> <span class="token punctuation">:</span><span class="token function">not</span><span class="token punctuation">(</span>[lang|=<span class="token string">"#{$lang}"</span>]<span class="token punctuation">)</span><span class="token punctuation">:</span><span class="token function">not</span><span class="token punctuation">(</span><span class="token punctuation">:</span>last-child<span class="token punctuation">)</span><span class="token selector">, .multilingual > [lang|="<span class="token variable">#{$lang}</span>"] ~ :last-child </span><span class="token punctuation">{</span> <span class="token property">display</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Es werden alle Kindelemente von <code class="language-css">.multilingual</code> ausgeblendet, deren Sprache nicht mit <code>$lang</code> übereinstimmt, außer dem letzten, was als Defaultsprache erhalten bleibt. Wenn es ein Kindelement von <code class="language-css">.multilingual</code> gibt, dessen Sprache mit <code>$lang</code> übereinstimmt und dieses nicht das letzte ist, dann wird auch das letzte ausgeblendet.</p> <p>☞ <a href="https://codepen.io/gunnarbittersmann/pen/vQjaXM" rel="noopener noreferrer">Codepen</a> zum Rumspielen</p> <p>Zum Vergleichen habe ich <code>|=</code> verwendet. Womöglich ist aber nicht <code class="language-css">[lang|=<span class="token string">"…"</span>]</code>, sondern <code class="language-css"><span class="token punctuation">:</span><span class="token function">lang</span><span class="token punctuation">(</span>…<span class="token punctuation">)</span></code> die bessere Wahl. ☞ <a href="https://www.w3.org/International/questions/qa-css-lang.de" rel="nofollow noopener noreferrer">Stylen anhand von Sprachattributen</a></p> <p></p> <p>Was es mit dem <code class="language-css">html[data-lang]</code> bei dir auf sich hat, habe ich nicht so ganz verstanden.</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> Mehrsprachigkeit Steuerung UI Mon, 26 Nov 18 11:48:12 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737143#m1737143 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737143#m1737143 <p>folgendes Schreckgespenst</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 attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>langoptions<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Sprachwahl - Language Selection<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>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Deutsch<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Deutsch<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>de<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>de<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>English<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>English<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>en<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>en<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Espagnol<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Espagnol<span class="token punctuation">"</span></span> <span class="token attr-name">aria-current</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lang<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>es<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>es<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Français<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Français<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fr<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>fr<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Italiano<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Italiano<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>it<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>it<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</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>Mängelliste</p> <ul> <li>Event Delegation kommt noch</li> <li>Eventuell das span ersetzen mit fieldset mit visuell verborgenem legend.</li> <li>Vermeide menschenlesbare Information in Attributen (es sei denn sie sind bereits übersetzt).</li> </ul> <p>Das besondere Problem ist das Wort <em>Sprachwahl</em>. Optimaler Weise schreibt man dieses in der Sprache des Lesers. Gerade diese kenne ich aber nicht.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Wed, 28 Nov 18 15:07:04 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737317#m1737317 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737317#m1737317 <p>hallo</p> <p>Eine live Demo zur Mehrsprachigkeit</p> <p><a href="https://beat-stoecklin.ch/pub/website_multilang.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/website_multilang.html</a></p> <p>Ihr könnt auch den Quellcode anschauen.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 14:38:32 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737041#m1737041 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737041#m1737041 <p>hallo</p> <blockquote> <blockquote> <p>Es ist zu erwarten, dass das Dokument-html von Autoren erstellt wird, die sehr wenig über html wissen. Die Syntax muss entsprechend einfach bleiben.</p> </blockquote> <p>Autoren sollten mit der Sprachthematik gar nichts zu tun haben. Sondern einfach nur in ihrer Sprache schreiben.</p> </blockquote> <p>aha!</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 16:24:13 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737048#m1737048 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737048#m1737048 <p>hallo</p> <blockquote> <p>@@beatovich</p> <blockquote> <p>Sprachversionen müssen unmittelbare Kinder des Elements mit lang="multi" sein.</p> </blockquote> <p>Welches es nicht geben sollte. <code>multi</code> ist kein gültiger Wert fürs <a href="https://w3c.github.io/html/dom.html#element-attrdef-global-lang" rel="nofollow noopener noreferrer"><code>lang</code>-Attribut</a>; das dürfen nur Sprachkürzel sein. Verwende bspw. <code>class="multilingual"</code>.</p> </blockquote> <p>Kein Problem.</p> <blockquote> <blockquote> <p>Das funktioniert, sollte aber rationeller notiert werden.</p> </blockquote> <p>Du willst also dasjenige Kind eines <code>.multilingual{:.language-css}</code>-Containers (um beim obigen Vorschlag zu bleiben) anzeigen, dessen Sprache mit der in <code>_.lang</code> vorgegebenen überseinstimmt, und wenn es kein solches gibt, dann das letzte?</p> </blockquote> <p>nicht ganz, siehe unten.</p> <blockquote> <p>Also alle anderen ausblenden (hier in Sass-Syntax mit der vorgegebenen Sprache in <code>$lang</code>):</p> <pre><code class="block language-scss"><span class="token property"><span class="token variable">$lang</span></span><span class="token punctuation">:</span> <span class="token string">'en'</span><span class="token punctuation">;</span> .multilingual <span class="token operator">></span> <span class="token punctuation">:</span><span class="token function">not</span><span class="token punctuation">(</span>[lang|=<span class="token string">"#{$lang}"</span>]<span class="token punctuation">)</span><span class="token punctuation">:</span><span class="token function">not</span><span class="token punctuation">(</span><span class="token punctuation">:</span>last-child<span class="token punctuation">)</span><span class="token selector">, .multilingual > [lang|="<span class="token variable">#{$lang}</span>"] ~ :last-child </span><span class="token punctuation">{</span> <span class="token property">display</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Es werden alle Kindelemente von <code class="language-css">.multilingual</code> ausgeblendet, deren Sprache nicht mit <code>$lang</code> übereinstimmt, außer dem letzten, was als Defaultsprache erhalten bleibt. Wenn es ein Kindelement von <code class="language-css">.multilingual</code> gibt, dessen Sprache mit <code>$lang</code> übereinstimmt und dieses nicht das letzte ist, dann wird auch das letzte ausgeblendet.</p> <p>☞ <a href="https://codepen.io/gunnarbittersmann/pen/vQjaXM" rel="noopener noreferrer">Codepen</a> zum Rumspielen</p> <p>Zum Vergleichen habe ich <code>|=</code> verwendet. Womöglich ist aber nicht <code class="language-css">[lang|=<span class="token string">"…"</span>]</code>, sondern <code class="language-css"><span class="token punctuation">:</span><span class="token function">lang</span><span class="token punctuation">(</span>…<span class="token punctuation">)</span></code> die bessere Wahl. ☞ <a href="https://www.w3.org/International/questions/qa-css-lang.de" rel="nofollow noopener noreferrer">Stylen anhand von Sprachattributen</a></p> </blockquote> <p>SCSS ist hier noch keine Option.</p> <blockquote> <p>Was es mit dem <code class="language-css">html[data-lang]</code> bei dir auf sich hat, habe ich nicht so ganz verstanden.</p> </blockquote> <p><html lang="de" data-lang="fr" data-lang-options="de fr it"></p> <ul> <li>lang="de" stellt hier die Hauptsprache dar, welche auch durch Sprachwahl nicht verändert wird.</li> <li>data-lang="fr" stellt (z.B) die Sprache dar, welche durch User-Action, Cookie oder Querystring gewählt wird/wurde, dieses Attribut kann auch fehlen.</li> <li>data-lang-options="de fr it" diese Sprachwahlbuttons werden auf dieser Seite zur Verfügung gestellt.</li> </ul> <p>Es wäre falsch lang selber zu ändern, da ja die Mehsprachigkeit nur für Teile des Dokuments erstellt ist.</p> <p>In dem Fall ist lang="de" die Fallback-Sprache, falls die gewünschte Sprachversion nicht für einen bestimmten Bereich verfügbar ist.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sun, 25 Nov 18 07:05:51 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737070#m1737070 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737070#m1737070 <p>@@Gunnar Bittersmann</p> <blockquote> <p>Verwende bspw. <code>class="multilingual"</code>.</p> </blockquote> <p>Sagt’s und schreibt im Code <code>multilang</code>. Ich hab’s hier im Thread und in meinen Pens in <code>multilingual</code> geändert, um keine Verwirrung zu stiften. Oder noch mehr? </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> Mehrsprachigkeit, Beurteilung Sun, 25 Nov 18 09:38:09 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737079#m1737079 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737079#m1737079 <p>hallo</p> <blockquote> <pre><code class="block language-scss"><span class="token property"><span class="token variable">$lang</span></span><span class="token punctuation">:</span> <span class="token string">'en'</span><span class="token punctuation">;</span> .multilingual <span class="token operator">></span> <span class="token punctuation">:</span><span class="token function">not</span><span class="token punctuation">(</span>[lang|=<span class="token string">"#{$lang}"</span>]<span class="token punctuation">)</span><span class="token punctuation">:</span><span class="token function">not</span><span class="token punctuation">(</span><span class="token punctuation">:</span>last-child<span class="token punctuation">)</span><span class="token selector">, .multilingual > [lang|="<span class="token variable">#{$lang}</span>"] ~ :last-child </span><span class="token punctuation">{</span> <span class="token property">display</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <blockquote> <p>☞ <a href="https://codepen.io/gunnarbittersmann/pen/vQjaXM" rel="noopener noreferrer">Codepen</a> zum Rumspielen</p> </blockquote> <p>ich habe jetzt folgendes umgesetzt (auf deine Anregung)</p> <pre><code class="block language-css"> <span class="token selector">html[lang|="'+_.lang+'"]:not([data-lang]) [lang=""] > :not([lang|="'+_.lang+'"])</span> <span class="token punctuation">{</span><span class="token property">display</span><span class="token punctuation">:</span>none<span class="token punctuation">}</span> <span class="token selector">html[data-lang|="en"] [lang=""] > :not([lang|="en"]):not(:last-of-type), html[data-lang|="es"] [lang=""] > :not([lang|="es"]):not(:last-of-type), html[data-lang|="de"] [lang=""] > :not([lang|="de"]):not(:last-of-type), html[data-lang|="fr"] [lang=""] > :not([lang|="fr"]):not(:last-of-type), html[data-lang|="it"] [lang=""] > :not([lang|="it"]):not(:last-of-type)</span><span class="token punctuation">{</span><span class="token property">display</span><span class="token punctuation">:</span>none<span class="token punctuation">}</span> <span class="token selector">html[data-lang|="en"] [lang=""] > [lang|="en"] ~ [lang|="'+_.lang+'"], html[data-lang|="es"] [lang=""] > [lang|="es"] ~ [lang|="'+_.lang+'"], html[data-lang|="de"] [lang=""] > [lang|="de"] ~ [lang|="'+_.lang+'"], html[data-lang|="fr"] [lang=""] > [lang|="fr"] ~ [lang|="'+_.lang+'"], html[data-lang|="it"] [lang=""] > [lang|="it"] ~ [lang|="'+_.lang+'"]</span><span class="token punctuation">{</span><span class="token property">display</span><span class="token punctuation">:</span>none<span class="token punctuation">}</span> </code></pre> <p>Eindeutig besser ist hier, dass wir kein display:initial mehr brauchen im Vergleich zu meiner ursprünglichen Version.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 16:40:06 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737049#m1737049 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737049#m1737049 <p>@@beatovich</p> <blockquote> <p>SCSS ist hier noch keine Option.</p> </blockquote> <p>Ja, das hatte ich der Einfachheit halber im Codepen verwendet. Du generierst dein Stylesheet anders, um das <code>_.lang</code> da rein zu bekommen. Nur wie? JavaScript?</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> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 17:29:07 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737052#m1737052 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737052#m1737052 <blockquote> <p>Es werden alle Kindelemente von .multilingual ausgeblendet, deren Sprache nicht mit $lang übereinstimmt,</p> </blockquote> <p>Soll heißen, Du lieferst bei jedem Seitenabruf jede Übersetzung aus?</p> <blockquote> <p>Praktisch haben wir es immer nur mit 2-4 sprachversionen zu tun.</p> </blockquote> <p>Naja. Dann gänge das gerade noch... <a href="https://code.fastix.org/Projekte/PHP%3ALanguageSelector/" rel="nofollow noopener noreferrer">muss bei serverseitigem Skripting aber nicht sein</a>.</p> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 16:50:12 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737050#m1737050 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737050#m1737050 <p>hallo</p> <blockquote> <p>@@beatovich</p> <blockquote> <p>SCSS ist hier noch keine Option.</p> </blockquote> <p>Ja, das hatte ich der Einfachheit halber im Codepen verwendet. Du generierst dein Stylesheet anders, um das <code>_.lang</code> da rein zu bekommen. Nur wie? JavaScript?</p> </blockquote> <p>Ja. Aber ich kann zur Zeit, wo ich das CSS genriere nur das Attribut lang aus dem html Element auswerten, da ja die andere Variable data-lang später noch verändert wird. Trotzdem muss ich wegen der Cookie und QueryString auswertung bereits korrekt reagieren, das heisst, die vorgesehenen Fälle müssen sofort korrekt gerendert werden.</p> <p>Praktisch haben wir es immer nur mit 2-4 sprachversionen zu tun. Ich kann also mit dieser Version leben.</p> <p>Es nimmt mich aber wunder, ob man das doch etwas generalisieren kann, und besonders, ob ich diese Bedingung wegbekomme, dass die Fallbackversion (welche dem lang Attribut im html Element entsprechen soll) immer zuletzt notiert werden soll. Das stört mich aktuell am meisten.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 17:28:48 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737051#m1737051 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737051#m1737051 <p>@@beatovich</p> <blockquote> <p>Ja. Aber ich kann zur Zeit, wo ich das CSS genriere nur das Attribut lang aus dem html Element auswerten, da ja die andere Variable data-lang später noch verändert wird. Trotzdem muss ich wegen der Cookie und QueryString auswertung bereits korrekt reagieren, das heisst, die vorgesehenen Fälle müssen sofort korrekt gerendert werden.</p> </blockquote> <p>Du ermittelst also mit JavaScript aus Cookie und QueryString die Sprache. Dann kannst du doch genau die gezeigte Regel mit JavaScript generieren: <a href="https://codepen.io/gunnarbittersmann/pen/WYJgqY" rel="noopener noreferrer">neuer Pen</a>.</p> <p>Wenn du Browser unterstützen musst, die die Backticks nicht verstehen, dann mit Stringkonkatenation.</p> <p></p> <blockquote> <p>ob ich diese Bedingung wegbekomme, dass die Fallbackversion (welche dem lang Attribut im html Element entsprechen soll) immer zuletzt notiert werden soll.</p> </blockquote> <p>Das wird wohl mit CSS nichts.</p> <p>Aber wenn du sowieso mit JavaScript dran bist: Warum läufst du nicht über alle <code>.multilingual</code>-Knoten und entscheidest jeweils anhand der dort verfügbaren Sprachen, der aus Cookie und QueryString ermittelten gewünschten Sprache und aus der Fallbacksprache, welche im jeweiligen Knoten angezeigt werden soll?</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> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 17:55:29 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737053#m1737053 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737053#m1737053 <p>hallo</p> <blockquote> <p>@@beatovich</p> <blockquote> <p>Ja. Aber ich kann zur Zeit, wo ich das CSS genriere nur das Attribut lang aus dem html Element auswerten, da ja die andere Variable data-lang später noch verändert wird. Trotzdem muss ich wegen der Cookie und QueryString auswertung bereits korrekt reagieren, das heisst, die vorgesehenen Fälle müssen sofort korrekt gerendert werden.</p> </blockquote> <p>Du ermittelst also mit JavaScript aus Cookie und QueryString die Sprache. Dann kannst du doch genau die gezeigte Regel mit JavaScript generieren: <a href="https://codepen.io/gunnarbittersmann/pen/WYJgqY" rel="noopener noreferrer">neuer Pen</a>.</p> </blockquote> <p>Das ist mir auch schon durch den Kopf gegangen. Ich kann ein eindeutiges Style-Element aktualisieren.</p> <p>Angenommen: lang=de, data-lang=fr</p> <pre><code class="block">.multilingual > :not([data-lang|="fr"]):not(:last-child), .multilingual > [data-lang|="fr"] ~ :last-child { display: none; } </code></pre> <p>Die Frage ist nur:</p> <ul> <li>kein Cookie, mein QS -> kein data-lang Attribut</li> </ul> <p>Es sollte jetzt alles ausgeblendet werden das nicht der dokument-Sprache entspricht.</p> <p>Die Initialisierung sollte also sein:</p> <pre><code class="block">.multilingual > :not(:last-child) { display: none; } </code></pre> <blockquote> <blockquote> <p>ob ich diese Bedingung wegbekomme, dass die Fallbackversion (welche dem lang Attribut im html Element entsprechen soll) immer zuletzt notiert werden soll.</p> </blockquote> <p>Das wird wohl mit CSS nichts.</p> </blockquote> <p>So denke ich auch.</p> <blockquote> <p>Aber wenn du sowieso mit JavaScript dran bist: Warum läufst du nicht über alle <code>.multilingual</code>-Knoten und entscheidest jeweils anhand der dort verfügbaren Sprachen, der aus Cookie und QueryString ermittelten gewünschten Sprache und aus der Fallbacksprache, welche im jeweiligen Knoten angezeigt werden soll?</p> </blockquote> <p>Ich kann natürlich diese Zeit investieren. Aber, warum das DOM verändern, wenn es ja (eventuell) doch wieder restauriert werden muss?</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 18:09:02 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737055#m1737055 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737055#m1737055 <p>@@Gunnar Bittersmann</p> <blockquote> <p>Du ermittelst also mit JavaScript aus Cookie und QueryString die Sprache.</p> </blockquote> <p>Äh, Moment! Der erste Anlaufpunkt sollte die <code>Accept-Language</code>-Angabe im HTTP-Header sein. ☞ <a href="https://www.w3.org/International/questions/qa-when-lang-neg.de" rel="nofollow noopener noreferrer">Sprachvereinbarung (language negotiation)</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> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 18:00:27 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737054#m1737054 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737054#m1737054 <p>hallo</p> <blockquote> <blockquote> <p>Aber wenn du sowieso mit JavaScript dran bist: Warum läufst du nicht über alle <code>.multilingual</code>-Knoten und entscheidest jeweils anhand der dort verfügbaren Sprachen, der aus Cookie und QueryString ermittelten gewünschten Sprache und aus der Fallbacksprache, welche im jeweiligen Knoten angezeigt werden soll?</p> </blockquote> <p>Ich kann natürlich diese Zeit investieren. Aber, warum das DOM verändern, wenn es ja (eventuell) doch wieder restauriert werden muss?</p> </blockquote> <p>Also so schlimm ist es nicht. Eine einmalige Aktion kann sicherstellen, dass die Version, die der Document Sprache entspricht, immer das letzte Element ist.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sun, 25 Nov 18 08:15:34 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737074#m1737074 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737074#m1737074 <p>hallo</p> <blockquote> <p>Also so schlimm ist es nicht. Eine einmalige Aktion kann sicherstellen, dass die Version, die der Document Sprache entspricht, immer das letzte Element ist.</p> </blockquote> <pre><code class="block language-js"> <span class="token keyword">var</span> col <span class="token operator">=</span> document<span class="token punctuation">.</span><span class="token function">querySelectorAll</span><span class="token punctuation">(</span><span class="token string">'[lang=""] > [lang="'</span><span class="token operator">+</span>_<span class="token punctuation">.</span>lang<span class="token operator">+</span><span class="token string">'"]'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">for</span><span class="token punctuation">(</span><span class="token keyword">var</span> i <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">;</span> i <span class="token operator"><</span> col<span class="token punctuation">.</span>length<span class="token punctuation">;</span> i<span class="token operator">++</span><span class="token punctuation">)</span><span class="token punctuation">{</span> col<span class="token punctuation">[</span>i<span class="token punctuation">]</span><span class="token punctuation">.</span>parentElement<span class="token punctuation">.</span><span class="token function">appendChild</span><span class="token punctuation">(</span> col<span class="token punctuation">[</span>i<span class="token punctuation">]</span> <span class="token punctuation">)</span><span class="token punctuation">;</span><span class="token punctuation">}</span> </code></pre> <p>Damit sind nur noch Aufrufe ohne Javascript aussen vor.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 18:15:13 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737058#m1737058 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737058#m1737058 <p>hallo</p> <blockquote> <blockquote> <p>Du ermittelst also mit JavaScript aus Cookie und QueryString die Sprache.</p> </blockquote> <p>Äh, Moment! Der erste Anlaufpunkt sollte die <code>Accept-Language</code>-Angabe im HTTP-Header sein. ☞ <a href="https://www.w3.org/International/questions/qa-when-lang-neg.de" rel="nofollow noopener noreferrer">Sprachvereinbarung (language negotiation)</a></p> </blockquote> <p>Du meinst die letzte...</p> <p>Die Sache ist die, dass du diese eventuell gar nicht nutzen willst, da die Browser-konfiguration nicht dem User-Wunsch entsprechen muss.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Mon, 26 Nov 18 10:10:48 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737139#m1737139 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737139#m1737139 <p>hallo</p> <blockquote> <p>Äh, Moment! Der erste Anlaufpunkt sollte die <code>Accept-Language</code>-Angabe im HTTP-Header sein. ☞ <a href="https://www.w3.org/International/questions/qa-when-lang-neg.de" rel="nofollow noopener noreferrer">Sprachvereinbarung (language negotiation)</a></p> </blockquote> <p>Der erste Anlaufpunkt ist mit Javascript nicht zugänglich. Darum sollten sich die DOM-Spezifizierer mal kümmern.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 18:33:18 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737060#m1737060 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737060#m1737060 <p>@@beatovich</p> <blockquote> <blockquote> <p>Äh, Moment! Der erste Anlaufpunkt sollte die <code>Accept-Language</code>-Angabe im HTTP-Header sein. ☞ <a href="https://www.w3.org/International/questions/qa-when-lang-neg.de" rel="nofollow noopener noreferrer">Sprachvereinbarung (language negotiation)</a></p> </blockquote> <p>Du meinst die letzte...</p> </blockquote> <p>Von der Priorität her die letzte, ja.</p> <blockquote> <p>Die Sache ist die, dass du diese eventuell gar nicht nutzen willst</p> </blockquote> <p>Doch! Weil sie in den meisten Fällen doch ohne weitere Interaktion das richtige Ergebnis liefert.</p> <blockquote> <p>da die Browser-konfiguration nicht dem User-Wunsch entsprechen muss.</p> </blockquote> <p>Deshalb ist es ja die von der <em>Priorität</em> her die letzte. Von der Verarbeitung her die erste, weil es die anderen Möglichkeiten, die Sprache zu ermitteln, in den meisten Fällen gar nicht geben 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> Mehrsprachigkeit, Beurteilung Sat, 24 Nov 18 18:42:04 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737061#m1737061 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737061#m1737061 <p>hallo</p> <blockquote> <p>Doch! Weil sie in den meisten Fällen doch ohne weitere Interaktion das richtige Ergebnis liefert.</p> <blockquote> <p>da die Browser-konfiguration nicht dem User-Wunsch entsprechen muss.</p> </blockquote> <p>Deshalb ist es ja die von der <em>Priorität</em> her die letzte. Von der Verarbeitung her die erste, weil es die anderen Möglichkeiten, die Sprache zu ermitteln, in den meisten Fällen gar nicht geben muss.</p> </blockquote> <p>Es ist also so, dass es von der Priorität her noch andere Anwärter nach cookie und query-string und vor language negotiation gibt. Das meinte ich mit eventuell.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit, Beurteilung Sun, 25 Nov 18 08:19:42 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737075#m1737075 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737075#m1737075 <p>hallo</p> <blockquote> <p>@@Gunnar Bittersmann</p> <blockquote> <p>Verwende bspw. <code>class="multilingual"</code>.</p> </blockquote> <p>Sagt’s und schreibt im Code <code>multilang</code>. Ich hab’s hier im Thread und in meinen Pens in <code>multilingual</code> geändert, um keine Verwirrung zu stiften. Oder noch mehr? </p> </blockquote> <p>Ich bin immer noch nicht glücklich</p> <p>class="multilingual" ist definitiv zu lange</p> <p>Ich übelege derzeit:</p> <pre><code class="block"><p lang=""> <span lang="de">Deutsch</span> <span lang="it">Italiano</span> <span lang="fr">Francais</span> </p> </code></pre> <p>Ein leeres language Attribut erscheint schlimmstenfalls sinnfrei. Gerade deshalb wird man es für keinen anderen Zweck verwenden.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit Steuerung UI Wed, 28 Nov 18 17:17:20 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737330#m1737330 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737330#m1737330 <p>@@beatovich</p> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>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>langoptions<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Sprachwahl - Language Selection<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Wird nicht der Elementinhalt im Screenreader durch den Wert von <code>aria-label</code> <em>ersetzt</em>? Werden die Buttons denn überhaupt angesagt?</p> <blockquote> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Deutsch<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Deutsch<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>de<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>de<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Warum nicht auch eine vernünftige Beschriftung für sehende Nutzer? Bist du sicher, dass alle mit den Kürzeln de, en, fr, it etwas anfangen können?</p> <p>Außer das Cookie zu setzen passiert nichts? Soll nicht auch sofort die Sprache gewechselt werden?</p> <blockquote> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Espagnol<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Espagnol<span class="token punctuation">"</span></span> <span class="token attr-name">aria-current</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lang<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>es<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>es<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p><em lang="it">Espagnol</em> kommt mir nicht spanisch vor. Eher italienisch? Du meinst <em lang="es">Español</em>.</p> <p><code>lang</code> ist kein gültiger Wert für <code>aria-current</code>. [<a href="https://w3c.github.io/aria/#aria-current" rel="nofollow noopener noreferrer">WAI-ARIA 1.2</a>]</p> <blockquote> <ul> <li>Vermeide menschenlesbare Information in Attributen (es sei denn sie sind bereits übersetzt).</li> </ul> </blockquote> <p>Die Sprachbezeichner in den jeweiligen Zielsprachen sollen gar nicht übersetzt werden.</p> <blockquote> <p>Das besondere Problem ist das Wort <em>Sprachwahl</em>. Optimaler Weise schreibt man dieses in der Sprache des Lesers. Gerade diese kenne ich aber nicht.</p> </blockquote> <p>Ein <a href="https://en.wikipedia.org/wiki/Language_Icon" rel="nofollow noopener noreferrer">Bild</a> sagt mehr als <s>tausend</s> ein unverständliches Wort.</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> Mehrsprachigkeit Steuerung UI Wed, 28 Nov 18 17:37:51 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737331#m1737331 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737331#m1737331 <p>hallo</p> <blockquote> <p>@@beatovich</p> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>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>langoptions<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Sprachwahl - Language Selection<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Wird nicht der Elementinhalt im Screenreader durch den Wert von <code>aria-label</code> <em>ersetzt</em>? Werden die Buttons denn überhaupt angesagt?</p> </blockquote> <p>Schau dir die aktuelle Online Version <a href="https://beat-stoecklin.ch/pub/website_multilang.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/website_multilang.html</a> an. Da wird fieldset / legend eingesetzt.</p> <blockquote> <blockquote> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Deutsch<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Deutsch<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>de<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>de<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Warum nicht auch eine vernünftige Beschriftung für sehende Nutzer? Bist du sicher, dass alle mit den Kürzeln de, en, fr, it etwas anfangen können?</p> </blockquote> <p>Das hiesse dann ein select Element.</p> <p>Dann wird die aktuelle Sprache sichtbar angezeigt. Die mag einem dann auch spanisch vorkommen.</p> <blockquote> <p>Außer das Cookie zu setzen passiert nichts? Soll nicht auch sofort die Sprache gewechselt werden?</p> </blockquote> <p>Nur eine Fehlfunktion könnte erklären, warum der Sprachwechsel nicht sofort erfolgt. Wo scheitert's?</p> <blockquote> <blockquote> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Espagnol<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Espagnol<span class="token punctuation">"</span></span> <span class="token attr-name">aria-current</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lang<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>es<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>es<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p><em lang="it">Espagnol</em> kommt mir nicht spanisch vor. Eher italienisch? Du meinst <em lang="es">Español</em>.</p> </blockquote> <p>Wird korrigiert</p> <blockquote> <p><code>lang</code> ist kein gültiger Wert für <code>aria-current</code>. [<a href="https://w3c.github.io/aria/#aria-current" rel="nofollow noopener noreferrer">WAI-ARIA 1.2</a>]</p> </blockquote> <p>Dann sollte es das schleunigst werden. Ich kann den Wert auch leer lassen.</p> <blockquote> <blockquote> <ul> <li>Vermeide menschenlesbare Information in Attributen (es sei denn sie sind bereits übersetzt).</li> </ul> </blockquote> <p>Die Sprachbezeichner in den jeweiligen Zielsprachen sollen gar nicht übersetzt werden.</p> <blockquote> <p>Das besondere Problem ist das Wort <em>Sprachwahl</em>. Optimaler Weise schreibt man dieses in der Sprache des Lesers. Gerade diese kenne ich aber nicht.</p> </blockquote> <p>Ein <a href="https://en.wikipedia.org/wiki/Language_Icon" rel="nofollow noopener noreferrer">Bild</a> sagt mehr als <s>tausend</s> ein unverständliches Wort.</p> </blockquote> <p>Angesichts dessen, dass der Ausdruck <em>Wählen Sie ihre Sprache</em> nicht effektiv sinnvoll anwendbar ist, wandert man sich, dass Unicode genu für diese Mitteilung keinen Codepunkt definiert hat.</p> <p>Das ist wohl der Einzig Fall, wo man entschuldigt ist, dass man ein Icon nicht mit Text begleitet.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit Steuerung UI Thu, 29 Nov 18 12:42:08 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737401#m1737401 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737401#m1737401 <p>@@beatovich</p> <blockquote> <p>Schau dir die aktuelle Online Version <a href="https://beat-stoecklin.ch/pub/website_multilang.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/website_multilang.html</a> an.</p> </blockquote> <p>Irgendwas stimmt da nicht. Ich bekomme die Seite initial auf französisch präsentiert; in der Sprachauswahl ist aber DE hervorgehoben.</p> <p>Und noch was stimmt nicht:</p> <p><a href="/images/e78c2486-1287-4851-955d-b9365956524c.png" rel="noopener noreferrer"><img src="/images/e78c2486-1287-4851-955d-b9365956524c.png?size=medium" alt="Screenshot" loading="lazy"></a></p> <p>Anstatt absoluter Positionierung wäre da vielleicht <code>float: right</code> oder Flexbox besser.</p> <p>Und sollte nicht die Sprachauswahl gleich vorne im DOM stehen, gleich nach dem Skip-Link?</p> <p></p> <blockquote> <blockquote> <p>Warum nicht auch eine vernünftige Beschriftung für sehende Nutzer? Bist du sicher, dass alle mit den Kürzeln de, en, fr, it etwas anfangen können?</p> </blockquote> </blockquote> <p>Und für nichtsehende könnte sie auch aussagekräftiger sein:</p> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Deutsch<span class="token punctuation">"</span></span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Diese Seite auf deutsch<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>de<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>de<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> </code></pre> <p></p> <blockquote> <p>Das hiesse dann ein select Element.</p> </blockquote> <p>Bitte nicht. [<a href="https://www.w3.org/International/questions/qa-navigation-select" rel="nofollow noopener noreferrer">qa-navigation-select</a>]</p> <p>Ob die Sprachkürzel als Beschriftung in deiner Sprachauswahl taugen, hängt von deiner Zielgruppe ab. Auf Webseiten hast du aber allen Platz der Welt, um die Sprachen auszuschreiben: <em>Deutsch</em>, <em lang="en">English</em>, <em lang="es">Español</em>, <em lang="fr">Français</em>, <em lang="it">Italiano</em>. Die aktuelle Sprache muss im Menü nicht auftauchen; nur die anderen jeweils verfügbaren.</p> <p>Das <code>title</code>-Attribut kann dann dazu genutzt werden, die Sprachbezeichnungen in der aktuellen Sprache anzuzeigen, bspw. auf der englischen</p> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>German<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><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>span</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>de<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 attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>visually-hidden<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Diese Seite auf<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>span</span><span class="token punctuation">></span></span> deutsch <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>button</span><span class="token punctuation">></span></span> </code></pre> <p></p> <blockquote> <blockquote> <p>Außer das Cookie zu setzen passiert nichts? Soll nicht auch sofort die Sprache gewechselt werden?</p> </blockquote> <p>Nur eine Fehlfunktion könnte erklären, warum der Sprachwechsel nicht sofort erfolgt. Wo scheitert's?</p> </blockquote> <p>Was tut die Funktion <code class="language-js"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token punctuation">)</span></code>? Mehr als ihr Name aussagt?</p> <p></p> <blockquote> <blockquote> <p><code>lang</code> ist kein gültiger Wert für <code>aria-current</code>. [<a href="https://w3c.github.io/aria/#aria-current" rel="nofollow noopener noreferrer">WAI-ARIA 1.2</a>]</p> </blockquote> <p>Dann sollte es das schleunigst werden.</p> </blockquote> <p>Reich einen Vorschlag ein!</p> <blockquote> <p>Ich kann den Wert auch leer lassen.</p> </blockquote> <p>Nochmal nachgelesen: ja, kannst du. <code>aria-current=""</code> wird als <code>aria-current="true"</code> gewertet. <code>aria-current="lang"</code> übrigens auch.</p> <p></p> <blockquote> <p>Das ist wohl der Einzig Fall, wo man entschuldigt ist, dass man ein Icon nicht mit Text begleitet.</p> </blockquote> <p>Nicht einmal mit Alternativtext.</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> Mehrsprachigkeit Steuerung UI Thu, 29 Nov 18 13:58:58 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737405#m1737405 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737405#m1737405 <p>hallo</p> <blockquote> <p>@@beatovich</p> <blockquote> <p>Schau dir die aktuelle Online Version <a href="https://beat-stoecklin.ch/pub/website_multilang.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/website_multilang.html</a> an.</p> </blockquote> <p>Irgendwas stimmt da nicht. Ich bekomme die Seite initial auf französisch präsentiert; in der Sprachauswahl ist aber DE hervorgehoben.</p> </blockquote> <p>Da war doch tatsächlich noch ein data-lang="fr" im Original Quelltext.</p> <blockquote> <p>Und noch was stimmt nicht:</p> <p><a href="/images/e78c2486-1287-4851-955d-b9365956524c.png" rel="noopener noreferrer"><img src="/images/e78c2486-1287-4851-955d-b9365956524c.png?size=medium" alt="Screenshot" loading="lazy"></a></p> </blockquote> <p>stimmt, um die 600px.</p> <p>gefixt</p> <blockquote> <p>Anstatt absoluter Positionierung wäre da vielleicht <code>float: right</code> oder Flexbox besser.</p> <p>Und sollte nicht die Sprachauswahl gleich vorne im DOM stehen, gleich nach dem Skip-Link?</p> </blockquote> <p>naja, da gibt's verschiedene Anwärter. Da werde ich mir noch Gedanken machen. Die Themes sind ja strukturell nicht in Stein gemeiselt.</p> <blockquote> <blockquote> <p>Das hiesse dann ein select Element.</p> </blockquote> <p>Bitte nicht. [<a href="https://www.w3.org/International/questions/qa-navigation-select" rel="nofollow noopener noreferrer">qa-navigation-select</a>]</p> <p>Ob die Sprachkürzel als Beschriftung in deiner Sprachauswahl taugen, hängt von deiner Zielgruppe ab.</p> </blockquote> <p>Die ist ja immer noch einsprachig. Ich werde mir den Aufwand nicht machen. Aber andere User dürfen sicher das Theme an ihre Bedürfnisse anpassen.</p> <blockquote> <p>Auf Webseiten hast du aber allen Platz der Welt, um die Sprachen auszuschreiben: <em>Deutsch</em>, <em lang="en">English</em>, <em lang="es">Español</em>, <em lang="fr">Français</em>, <em lang="it">Italiano</em>. Die aktuelle Sprache muss im Menü nicht auftauchen; nur die anderen jeweils verfügbaren.</p> </blockquote> <p>Ich wüsste nicht, dass sich Webseiten allen Platz der Wahl nehmen.</p> <p>Denkbar wäre dann eine Klappbox, wenn ich da nur ein Box-Label/Icon hätte, das immer verständlich ist. Solche Lösungen können nur site-spezifisch (von anderen) entschieden werden und sind deshalb ausserhalb meiner Domäne.</p> <blockquote> <p>Das <code>title</code>-Attribut kann dann dazu genutzt werden, die Sprachbezeichnungen in der aktuellen Sprache anzuzeigen, bspw. auf der englischen</p> </blockquote> <p>Es ist sicher gut, das title-Attribut befüllt zu haben, damit man es via CSS für den Button-Text bei Bedarf nutzen kann.</p> <blockquote> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>German<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>lang<span class="token punctuation">)</span></span><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>span</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>de<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 attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>visually-hidden<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Diese Seite auf<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>span</span><span class="token punctuation">></span></span> deutsch <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>button</span><span class="token punctuation">></span></span> </code></pre> </blockquote> <p>Diese Mitteilung <em>diese Seite auf ...</em> ist aber nur zum Teil richtig. Man wählt auch den Zustand für jede nächste mehrsprachige Seite.</p> <p>Ich neige dazu, dass Sprachkürzel in den meisten Fällen ausreichen. Eventuell kann der Sprach-Vollname dienen.</p> <p>Alles andere aber kann mehr Verwirrung stiften.</p> <blockquote> <p>Was tut die Funktion <code class="language-js"><span class="token function">setLangCookie</span><span class="token punctuation">(</span><span class="token punctuation">)</span></code>? Mehr als ihr Name aussagt?</p> </blockquote> <p>Sie setzt das attribut data-lang= $lang im html Element</p> <p>Ich kann mir einen besseren Namen ausdenken: setUserLang()</p> <p>Ich erwarte aber nicht, dass Theme-User mit dem Funktionsnamen in Berührung kommen.</p> <blockquote> <blockquote> <p>Ich kann den Wert auch leer lassen.</p> </blockquote> <p>Nochmal nachgelesen: ja, kannst du. <code>aria-current=""</code> wird als <code>aria-current="true"</code> gewertet. <code>aria-current="lang"</code> übrigens auch.</p> </blockquote> <p>Meine Vermutung ist, dass jeder Wert, der aus Sicht der assistiven Technologie nicht einem registrierten Wert entspricht, schlicht als true verstanden wird. Operativ sollte die aktuelle Schreibweise also kein Problem darstellen.</p> <blockquote> <blockquote> <p>Das ist wohl der Einzig Fall, wo man entschuldigt ist, dass man ein Icon nicht mit Text begleitet.</p> </blockquote> <p>Nicht einmal mit Alternativtext.</p> </blockquote> <p>Was mich dazu bringt, wie ich bei Mehrsprachigkeit mit alt-texten umgehen soll.</p> <p>Ist die Funktion des alt-textes der einer Beschreibung, so ist aria-describedby vorzuziehen. Dort sind Übersetzungen einfach anzubringen.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div> Mehrsprachigkeit Steuerung UI Thu, 29 Nov 18 14:47:53 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737413#m1737413 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737413#m1737413 <p>@@beatovich</p> <blockquote> <p>stimmt, um die 600px.</p> </blockquote> <p>Was ist das, px? </p> <blockquote> <blockquote> <p>Ob die Sprachkürzel als Beschriftung in deiner Sprachauswahl taugen, hängt von deiner Zielgruppe ab.</p> </blockquote> <p>Die ist ja immer noch einsprachig.</p> </blockquote> <p>Das meinte ich nicht, sondern: wie technikaffin? Wie vertraut mit Sprachkürzeln?</p> <blockquote> <p>Diese Mitteilung <em>diese Seite auf ...</em> ist aber nur zum Teil richtig. Man wählt auch den Zustand für jede nächste mehrsprachige Seite.</p> </blockquote> <p>Von mir aus: „diese Website auf …“</p> <blockquote> <p>Ich neige dazu, dass Sprachkürzel in den meisten Fällen ausreichen. Eventuell kann der Sprach-Vollname dienen.</p> <p>Alles andere aber kann mehr Verwirrung stiften.</p> </blockquote> <p>Dieses „diese Website auf …“ ist nur für Screenreader gedacht und soll nicht visuell dargestellt werden.</p> <blockquote> <p>Ich kann mir einen besseren Namen ausdenken: setUserLang()</p> </blockquote> <p>Macht Sinn.</p> <blockquote> <blockquote> <p>Nochmal nachgelesen: ja, kannst du. <code>aria-current=""</code> wird als <code>aria-current="true"</code> gewertet. <code>aria-current="lang"</code> übrigens auch.</p> </blockquote> <p>Meine Vermutung ist, dass jeder Wert, der aus Sicht der assistiven Technologie nicht einem registrierten Wert entspricht, schlicht als true verstanden wird.</p> </blockquote> <p>Um dir das Nachlesen zu ersparen (die Quelle hatte ich ja verlinkt): ja, deine Vermutung stimmt.</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> Mehrsprachigkeit Steuerung UI Thu, 29 Nov 18 18:29:43 Z https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737440#m1737440 https://forum.selfhtml.org/self/2018/nov/24/mehrsprachigkeit-beurteilung/1737440#m1737440 <p>hallo</p> <blockquote> <p>Das meinte ich nicht, sondern: wie technikaffin? Wie vertraut mit Sprachkürzeln?</p> </blockquote> <p>Ich habe jetzt die folgende Version implemntiert</p> <p><a href="https://beat-stoecklin.ch/pub/website_multilang.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/website_multilang.html</a></p> <p>Fokusier mal die Language Buttons.</p> <div class="signature">-- <br> <a href="https://beat-stoecklin.ch/pub/index.html" rel="nofollow noopener noreferrer">https://beat-stoecklin.ch/pub/index.html</a> </div>