- From: Reece Dunn <msclrhd@googlemail.com>
- Date: Thu, 22 May 2014 11:05:05 +0100
- To: Xidorn Quan <quanxunzhen@gmail.com>
- Cc: James Craig <jcraig@apple.com>, "Tab Atkins Jr." <jackalmage@gmail.com>, www-style list <www-style@w3.org>
On 22 May 2014 10:54, Xidorn Quan <quanxunzhen@gmail.com> wrote: > On Thu, May 22, 2014 at 7:09 PM, James Craig <jcraig@apple.com> wrote: >> >> On May 22, 2014, at 12:44 AM, Tab Atkins Jr. <jackalmage@gmail.com> wrote: >> >> > On Wed, May 21, 2014 at 1:22 AM, James Craig <jcraig@apple.com> wrote: >> >>> On May 19, 2014, at 11:18 PM, "Tab Atkins Jr." <jackalmage@gmail.com> >> >>> wrote: >> >>> If you want to provide "alt text" for the 'symbols' values, >> >>> instead make a separate counter style with the words you want in >> >>> 'symbols' and "speak-as: words", then set "speak-as: >> >>> your-spoken-style;" in the real counter style. Xidorn provided >> >>> several examples of this. >> >> >> >> This strikes me as somewhat convoluted, but mostly sufficient. >> >> >> >> One question I didn’t see answered (apologies if I missed it) was >> >> whether one could apply the lang selector to a counter style. For example, I >> >> want (>/<) symbols displayed in all locales, but I want the alt text >> >> (input/output) localized. >> >> >> >> If I’m reading Tab’s summary correctly, we’d have to have duplicate >> >> symbolic counter styles in order to use the localized speak-as value. >> >> >> >> @counter-style symbols-de { speak-as: alt-de; } >> >> @counter-style symbols-en { speak-as: alt-en; } >> >> @counter-style symbols-es { speak-as: alt-es; } >> >> >> >> Is that the intention? >> > >> > Yes. >> >> No one will use this technique. It would mean at least three blocks per >> language per list type, purely for the purposes of localizing alt text. In >> reality, most major products localize in dozens of languages, if not more. >> The following example demonstrates the minimum required CSS to localize in >> only three (3) languages: English, Spanish, and German. Let's use the i/o >> example again. >> >> Markup: >> >> <ul class="io"> >> <li>2+2</li> >> <li>4</li> >> </ul> >> >> To recap, we want the console input/output list to visually display as: >> >> ⋗ 2+2 >> ⋖ 4 >> >> And be spoken as: >> >> Input: 2+2 >> Output: 4 >> >> In order to localize the previous lists using the techniques outlined in >> this thread, this is the minimum amount of CSS required. >> >> /* First set of blocks to point each list to the language-specific >> symbolic, but not yet textual, counter styles. */ >> ul.io:lang(en) { counter-style: io-en; } >> ul.io:lang(es) { counter-style: io-es; } >> ul.io:lang(de) { counter-style: io-de; } >> >> /* Shared counter style properties for the symbolic counter. */ >> @counter-style io-en, >> @counter-style io-es, >> @counter-style io-de { >> system: cyclic; >> symbols: '⋗' '⋖'; >> } >> >> /* Second set of blocks so the language-specific symbolic counters */ >> /* can point to their language-specific textual counterparts. */ >> @counter-style io-en { speak-as: io-alt-en; } >> @counter-style io-en { speak-as: io-alt-es; } >> @counter-style io-en { speak-as: io-alt-de; } >> >> /* Shared counter styles for the textual (alt text) spoken counter >> styles. */ >> @counter-style io-alt-en, >> @counter-style io-alt-es, >> @counter-style io-alt-de { >> system: cyclic; >> speak-as: words; >> } >> >> /* Finally, a third set of blocks for localized 'alt' text. */ >> @counter-style io-alt-en { symbols: 'Input: ' 'Output: '; } >> @counter-style io-alt-es { symbols: 'Entrada: ' 'Salida: '; } >> @counter-style io-alt-de { symbols: 'Eingang: ' 'Ausgang: '; } >> >> If you're really saying the above is the minimum necessary, I'd >> respectfully ask the CSS WG to try harder to come up with a better solution. >> >> Here's a variant of my original 'alt' proposal again, adding the :lang() >> selector applied to the counter styles. This example is one-third the size >> of the previous, and only requires one additional line of CSS per >> localization. It's also easier to read, more likely to be implemented by >> browsers, and *much* more likely to be understood and used by web authors. >> >> ul.io { counter-style: io; } >> >> @counter-style io { >> system: cyclic; >> symbols: '⋗' '⋖'; >> speak-as: alt; /* speak-as could be implicit if alt is defined. */ >> alt: 'Input: ' 'Output: '; >> } >> @counter-style io:lang(es) { alt: 'Entrada: ' 'Salida: '; } >> @counter-style io:lang(de) { alt: 'Eingang: ' 'Ausgang: '; } >> >> Thoughts? > > > The usecase sounds reasonable, but I don't think it is a good idea to mix > selector with custom-ident, and make the at-rule inheritable. > > I think a good approach might be making 'symbols' and 'additive-symbols' be > language-aware. It makes more sense considering that counter representation > itself may need to support different language as well. Though, I have no > idea about how can we define the syntax. You may want different systems depending on the language, a complex counter-style chain to handle language rules, or describe CSS4 Counter Styles or later features (e.g. for spoken numbers). You may even want a custom prefix/suffix/negative value per language. Thus, it makes more sense to group the items per-language on a top-level counter style at-rule. Thanks, - Reece H. Dunn
Received on Thursday, 22 May 2014 10:05:33 UTC