[csswg-drafts] [css-counter-styles] Limitations of speak-as

Crissov has just created a new issue for 
https://github.com/w3c/csswg-drafts:

== [css-counter-styles] Limitations of speak-as ==
I’ve been fooling around with 
[`@counter-style`](http://www.w3.org/TR/css-counter-styles-3/) lately 
(see [repository](https://crissov.github.io/css-counters/), which is 
in an early stage of development). Maybe I’m abusing the technology 
there, but I think I’ve hit the limitations of the 
[`speak-as`](http://www.w3.org/TR/css-counter-styles-3/#counter-style-speak-as)
 descriptor.

    speak-as: auto | bullets | numbers | words | spell-out | 
<counter-style-name>

For instance, `spell-out` makes absolute sense for `element-symbols` …

``` css
 @counter-style element-symbols {
  system: fixed;
  range: 1 118;
  speak-as: spell-out;
  symbols:
  'H'
                                                                                  
'He'
  'Li' 'Be'                                                   'B'  'C'
  'N'  'O'  'F'  'Ne' 
  'Na' 'Mg'                                                   'Al' 
'Si' 'P'  'S'  'Cl' 'Ar'
  'K'  'Ca' 'Sc' 'Ti' 'V'  'Cr' 'Mn' 'Fe' 'Co' 'Ni' 'Cu' 'Zn' 'Ga' 
'Ge' 'As' 'Se' 'Br' 'Kr' 
  'Rb' 'Sr' 'Y'  'Zr' 'Nb' 'Mo' 'Tc' 'Ru' 'Rh' 'Pd' 'Ag' 'Cd' 'In' 
'Sn' 'Sb' 'Te' 'I'  'Xe'
  'Cs' 'Ba' 'La' /*
               */'Ce' 'Pr' 'Nd' 'Pm' 'Sm' 'Eu' 'Gd' 'Tb' 'Dy' 'Ho' 
'Er' 'Tm' 'Yb' 'Lu' /*
              */ 'Hf' 'Ta' 'W'  'Re' 'Se' 'Ir' 'Pt' 'Au' 'Hg' 'Tl' 
'Pb' 'Bi' 'Po' 'At' 'Rn' 
  'Fr' 'Ra' 'Ac' /*
               */'Th' 'Pa' 'U'  'Np' 'Pu' 'Am' 'Cm' 'Bk' 'Cf' 'Es' 
'Fm' 'Md' 'No' 'Lr' /*
              */ 'Rf' 'Db' 'Sg' 'Bh' 'Hs' 'Mt' 'Ds' 'Rg' 'Cn' 'uut' 
'Fl' 'uup' 'Lv' 'uus' 'uuo';
}
```

…  although one may be tempted to also provide an `element-names` 
counter style, which would be language-dependent. With `planets`, 
however, `speak-as: words` would be desired, but the Unicode Names for
 Venus and Mars default to ‘Female Symbol’ and ‘Male Symbol’, 
respectively, so we would need to define another, language-dependent 
style just for speech synthesis, i.e. we‘ll probably never use it:

``` css
@counter-style planets {
  system: fixed;
  speak-as: planet-names;
  symbols: '\263F' '\2640' '\2641' '\2642' '\2643' '\2644' '\2645' 
'\2646';
}
@counter-style planets {
  system: fixed;
  speak-as: words;
  symbols: 'Mercury' 'Venus' 'Earth' 'Mars' 'Jupiter' 'Saturn' 
'Uranus' 'Neptune' ;
}
```

That’s of course now language dependent. It becomes even more apparent
 if we’re using astronomic symbols for the days of the week, where 
we’d want to be able to use something like `:lang()`:

``` css
@counter-style week-days {
  system: cyclic;
  speak-as:  week-day-names;
  symbols: '\263D' '\2642' '\263F' '\2643' '\2640' '\2644' '\2609';
}
@counter-style week-days { /* default language: English, but 
undeclared */
  system: cyclic;
  speak-as:  words;
  symbols: 'Monday' 'Tuesday' 'Wednesday' 'Thursday' 'Friday' 
'Saturday' 'Sunday';
}
@counter-style week-days:lang(de) /* ← not speced */ {
  symbols: 'Montag' 'Dienstag' 'Mittwoch' 'Donnerstag' 'Freitag' 
'Samstag' 'Sonntag';
}
```

There are also ideas where we’d want no translation or change of 
pronunciation, e.g. international (military)`spelling`:

``` css
@counter-style spelling {
  system: alphabetic;
  speak-as: lang(EN words); /* ← not speced */
  symbols: 'Alfa' 'Beta' 'Charlie' 'Delta' 'Echo' 'Foxtrot'
           'Golf' 'Hotel' 'India' 'Juliett' 'Kilo' 'Lima' 'Mike' 
           'November' 'Oscar' 'Papa' 'Quebec' 'Romeo' 'Sierra' 
           'Tango' 'Uniform' 'Victor' 'Whiskey' 'X-Ray' 'Yankee' 
'Zulu';
}
```

With graphic symbols, whether from Unicode (or emoji) or image files, 
you’d almost always want to be able to specify an `alt` text, which 
may or may not have a fixed language.

``` css
@counter-style proto-sinaitic-emoji {
  system: alphabetic;
  speak-as: proto-sinaitic-phonics;
  symbols: '\1F42E' '\1F3E0' '\1F64C' '\270B' '\1F30A' '\1F40D' 
'\1F441' '\1F5FF' '\2600' '\274C';
  suffix: '\FE0F';
}
@counter-style proto-sinaitic-phonics {
  system: alphabetic;
  speak-as: words;
  symbols: 'ʾalp' 'bet' 'hll' 'kaf' 'mayim' 'hahš' 'ʿen' 'roʾš' 'šimš'
 'tãw';
}
@counter-style proto-sinaitic-emoji-english {
  system: extends proto-sinaitic-emoji;
  speak-as: proto-sinaitic-english;
}
@counter-style proto-sinaitic-english {
  system: extends: proto-sinaitic-phonics;
  symbols: 'ox' 'house' 'jubilation' 'palm of hand' 'water' 'snake' 
'eye' 'head' 'sun' 'mark';
}
```

I’m not exactly sure what would be a better solution (e.g. `symbols: 
alt(url(image), '\1234', 'literal') …`), but if authors actually 
adopted `@counter-style`, which is [currently only 
available](http://caniuse.com/#feat=css-at-counter-style) in Mozilla 
Firefox and Antenna House Formatter as far as I know, they would 
probably want to do even crazier things than I’ve done and then run 
into this problem.

Please view or discuss this issue at 
https://github.com/w3c/csswg-drafts/issues/387 using your GitHub 
account

Received on Sunday, 7 August 2016 13:05:56 UTC