Re: [css-counter-styles] allow use of CSS4 "alt" property with @counter-style/symbols

On 7 July 2014 22:56, Christoph Päper <christoph.paeper@crissov.de> wrote:
> Tab Atkins Jr. <jackalmage@gmail.com> @ 2014-05-23:
>> On Thu, May 22, 2014 at 2:09 AM, James Craig <jcraig@apple.com> wrote:
>>>  <ul class="io">
>>>    <li>2+2</li>
>>>    <li>4</li>
>>>  </ul>
>>>
>>>  ⋗ 2+2
>>>  ⋖ 4
>>>
>>>  Input:  2+2
>>>  Output: 4
>>
>> /* Shared system for all the non-speak-as details of the counter style */
>> @counter-style io { system: cyclic; symbols: '⋗' '⋖'; suffix: " "; }
>>
>> /* Localized systems */
>> @counter-style io-en { system: extends io; speak-as: io-en-spoken; }
>> @counter-style io-es { system: extends io; speak-as: io-es-spoken; }
>> @counter-style io-de { system: extends io; speak-as: io-de-spoken; }
>>
>> /* Spoken systems */
>> @counter-style io-en-spoken { system: cyclic; symbols: "Input: ",
>> "Output: "; speak-as: words; }
>> @counter-style io-es-spoken { system: cyclic; symbols: "Entrada: ",
>> "Salida: "; speak-as: words; }
>> @counter-style io-de-spoken { system: cyclic; symbols: "Eingang: ",
>> "Ausgang: "; speak-as: words; }
>>
>> /* Selectors to actually assign the 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; }
>
> I’m not sure I completely understand the problem,

There are two problems based around localizing speak-as for different
languages (to support correctly reading out custom counter styles to
assistive technologies like screen readers and text-to-speech
programs).

1. The user wants to localize a word or simple phrase for different
languages (e.g. they want to localize the word "bullet" on a bullet
counter style, or "expand" and "collapse" on
disclosure-open/disclosure-close).

2. The user wants to customize the localization for a given language
to handle grammatical differences in that language (e.g. ein/eine/eins
in German).

For (2), you may not be able to handle all languages equally using the
same counter style pattern, or grouping (Korean has numbers grouped in
4 digits, Etheopic in groups of 2 digits). Likewise, British English
usually places an "and" after hundreds, e.g. "two hundred and twenty
one" instead of the American English "two hundred twenty one".

Putting the :lang() selectors on the ul/etc. items means that the
localization is now partially dependent on the way your layout is
constructed. Being able to place :lang() on a counter-style would keep
the counter style definition self contained.

Thanks,
- Reece H. Dunn

>
>   :root, /* default */
>   :root:lang(en) {--input: "Input";   --output: "Output";}
>   :root:lang(es) {--input: "Entrada"; --output: "Salida";}
>   :root:lang(de) {--input: "Eingabe"; --output: "Ausgabe";}
>
>   @counter-style io {
>     system: cyclic;
>     symbols: '⋗' '⋖';
>     suffix: " ";
>     speak-as: io-spoken;
>   }
>   @counter-style io-spoken {
>     system: cyclic;
>     symbols: var(--input), var(--output);
>     suffix: ": ";
>     speak-as: words;
>   }
>   ul.io {
>     counter-style: io;
>   }
>
>

Received on Monday, 7 July 2014 22:48:58 UTC