[webkit-dev] AX: Implement CSS -webkit-alt property (text alternative for generated content pseudo-elements ::before and ::after)

[Maciej Stachowiak]

Sounds ok to add it prefixed.

 - Maciej

On Oct 1, 2013, at 4:53 PM, James Craig <jcraig at apple.com> wrote:

> Follow-up question:  Since this hasn’t made it into the CSS4 spec yet, should we temporarily use “-webkit-alt” for the property name? I know there has been a push to move away from vendor prefixes lately, so if there are no objections, I propose we use the unprefixed version.
> 
> On Sep 30, 2013, at 10:08 PM, James Craig <jcraig at apple.com> wrote:
> 
>> AX: Implement CSS -webkit-alt property
>> https://bugs.webkit.org/show_bug.cgi?id=120188
>> 
>> This is blocking 20+ bugs on one of our higher profile content sites and we’d like to start work on it. To clarify, the problem is that with CSS generated content in pseudo-elements like this:
>> 
>> 	.expandable::before { content: "\25BA"; /* a.k.a. ► */ }
>> 
>> …there is no way to prevent VoiceOver from speaking the literal character description, “right pointing black pointer.” If this were an actual DOM node, we could hang some ARIA attributes on it, but there is no node for pseudo-elements, so the property has to be defined in CSS.
>> 
>> The CSS Working Group discussion indicates the editors (Tab from Google, and Elika from Mozilla) are generally on board with the concept of accessible text alternatives for CSS generated content and Tab suggested the property name. It is not in a CSS4 draft yet, but some usage examples are below.
>> 
>> Rendering a decorative disclosure triangle on a "collapsed” ARIA treeitem:
>> 
>> 	[aria-expanded="false”]::before {
>> 		content: "\25BA"; /* a.k.a. ► , literally “right pointing black pointer” */
>> 		alt: ""; /* aria-expanded="false" already in DOM, so this pseudo-element is decorative */
>> 	}
>> 
>> And this, where a style indicates new content, screen readers can speak “New” instead of “shadowed white star”:
>> 
>> 	[data-new]::after {
>> 		content: "\2730”; /* a.k.a. ✰ , literally “shadowed white star”  */
>> 		alt: attr(data-new); /* allows for localized content from the DOM, e.g. @data-new="New!" */
>> 	}
>> 
>> Any questions or concerns?
>> 
>> Thanks,
>> James
>> 
>> 
>> PS. Related to this one is bug 122138, where the “alt” can be specified inline after url() image content:
>> 
>> AX: WebKit does not expose text alternative of CSS generated image content
>> https://bugs.webkit.org/show_bug.cgi?id=122138
>> 
>> 	.new::after {
>> 		content: url(./star.png), "New!";
>> 	}
>> 
>> 
>> _______________________________________________
>> webkit-dev mailing list
>> webkit-dev at lists.webkit.org
>> https://lists.webkit.org/mailman/listinfo/webkit-dev
> 
> _______________________________________________
> webkit-dev mailing list
> webkit-dev at lists.webkit.org
> https://lists.webkit.org/mailman/listinfo/webkit-dev