Re: [css-pseudo] please make sure pseudo-element "alt" property makes it into next ED

Apologies for the late reply. I missed it because I was removed from the To/Cc.

> On Nov 4, 2014, at 11:48 PM, Christoph Päper <christoph.paeper@crissov.de> wrote:
> 
> James Craig <jcraig@apple.com>:
>> 
>> It might be worth noting in Example 12 that the style sheet is  not the best place for localizable strings. A comment on the example should suffice.
>> 
>>> .new::before { 
>>> content: url(./img/star.png);
>>> alt: "New!"; /* or from a localized attribute like alt: attr(title); */
>>> }
> 
> That’s a very bad example actually. A certain bit of information is only conveyed through styles here and it is not bound to individual user action like ‘:visited’.

In this example, what constitutes "new" is up to the business logic of the web application, not some user action like clicking a visited link.

> The ‘title’ attribute in markup that applies to the whole element/node is usually also no appropriate place to put the meaning of the content of purely stylistic before and after boxes, because there shouldn’t be any generic meaning.

Feel free to use the original example, which was something like @data-new. The title attribute was just an example, and would be valid in many cases, even if not the for example you're picturing.

[...snip...]

> Class names like “new” are arbitrary and do not carry meaning by themselves, but generated content actually can be used to improve visibility of information that is already there:
> 
>  [href^="mailto:"]::before { 
>    content: url(./img/envelope.png);
>    alternative: "✉︎"; /* U+2709 */
>  } 

The ✉︎ symbol is spoken by screen readers as the unicode character name "envelope with variation selector 15". Even if this was localized in every speech engine to something more equivalent like "envelope", it would not convey the meaning portrayed by the visual style.

> In cases like this, localizable textual content can make sense.
> 
>  :root:lang(en) {
>    --text-email: "email";
>    --text-home:  "homepage";
>  }
>  :root:lang(de) {
>    --text-email: "E-Mail";
>    --text-home:  "Startseite";
>  }
>  [href^="mailto:"]::before { 
>    content: url(./img/envelope.png);
>    alternative: var(--text-email);
>  }
>  [rel="home"]::before { 
>    content: url(./img/house.png);
>    alternative: var(--text-home);
>  }
> 
> Note that the textual content is not descriptive “envelope” and “house” in this example.

This example is fine, although most localization is not done in CSS, as it requires all loc strings for all languages to be downloaded. var(--text-email) or attr(data-loc-email) should both be valid options because localized attributes (including @title) are more commonplace.

If you want to push hard for "alternative" instead of "alt", I won't object, but I'd prefer the abbreviated version.

James

Received on Tuesday, 11 November 2014 19:51:44 UTC