HTML and XHTML Techniques - Providing Text Alternatives for Images of Symbols

Submitter's Name: Laura Carlson
Submitter's Email: laura.lee.carlson@gmail.com

Technique ID: UNKNOWN
Short Name: Providing Text Alternatives for Images of Symbols
Technique Category: HTML and XHTML Techniques
Guideline Reference: text-equiv
Success Criterion Reference: UNKNOWN

Applicability:
Applies to HTML

UA Issues:
None known

Description:
The objective of this technique is explain and demonstrate how to markup images of symbols.



Images of symbols are graphic representations that signify some concept, object, entity, quality, or brand. A symbol may be used to imply or represent a meaning beyond the obvious and apparent.



Markup images of symbols to identify the essence of what they represent or their purpose. It is usually unnecessary to describe the appearance of such an image or to identify it as a logo. Descriptions of what a symbol looks like would typically only be an appropriate text equivalent when it's purpose is as an image (see Providing Text Alternatives for Images of Pictures), for instance in the context of a page explaining the visual qualities of a well designed logo. If the symbol provides redundant or purely decorative information, the value of the alt attribute of the image can be null (alt="")



Examples



* Logos

* Icons

* Emblems

Example 1 Head: A logo used for branding.
Example 1 Description:
<h1><img src="w3clogo.png" alt="The World Wide Web Consortium (W3C)"></h1>

Example 2 Head: A warning icon on a weather page about hazardous conditions. 
Example 2 Description:
<img src="warningicon.png" alt="warning">

Resource 1 Title: Web Design References: Accessibility
Resource 1 URI: http://www.d.umn.edu/itss/support/Training/Online/webdesign/accessibility.html#alt

Related Techniques:
G94
H37

Test Procedure:
1. remove, hide, or mask the non-text content

2. replace it with the text alternative

3. Check that the purpose of the non-text content is met by the text alternative.

4. If the non-text content contains words that are important to understanding the content, the words are included in the text alternative.

Expected Result:
Check #3 is true. If the non-text content contains words that are important to understanding the content, check #4 is also true

Additional Notes:
This technique is part of the HTMLWG's Action 54: First Draft

http://esw.w3.org/topic/HTML/Action54AltAttribute



If it is accepted by WCAG we hope to remove it from our document as stated in the second draft

http://esw.w3.org/topic/HTML/Action54AltAttributeSecondDraft#head-f0bf2ebf9f3e1fa190974101c6b70700ff176772



The Action 54 first draft provides much non-normative guidance in the application of the ALT attribute, which may not be appropriate for inclusion in a markup language specification, and which moreover could be seen as usurping the role of WCAG 2.0 and its techniques documents. A format specification is not a tutorial. It would be very helpful if the Techniques for WCAG 2.0. could incorporate this information or a variation of it. Then the HTML5 spec could link to it. As PF has said, "WCAG WG is chartered to set Accessibility guidelines and HTML WG is not".

http://lists.w3.org/Archives/Public/public-html/2008Feb/0082.html 



Thank you,



The HTMLWG Action 54 Team:

Steven Faulkner

Joshue O Connor

Laura Carlson



Peer reviewers:

Gez Lemon

Gregory Rosmaita

No resource 2 title submitted!
No resource 2 URI submitted!
No test file 1 was submitted!
No test file 1 pass/fail was submitted!
No test file 2 was submitted!
No test file 2 pass/fail was submitted!


------------------------------------------------

<technique id="UNKNOWN">
<short-name>Providing Text Alternatives for Images of Symbols</short-name>
<applies-to>
<guideline idref="text-equiv" />
<success-criterion idref="UNKNOWN" />
</applies-to>

<applicability>
Applies to HTML
</applicability>
<ua_issues>
None known
</ua_issues>
<description>
The objective of this technique is explain and demonstrate how to markup images of symbols.



Images of symbols are graphic representations that signify some concept, object, entity, quality, or brand. A symbol may be used to imply or represent a meaning beyond the obvious and apparent.



Markup images of symbols to identify the essence of what they represent or their purpose. It is usually unnecessary to describe the appearance of such an image or to identify it as a logo. Descriptions of what a symbol looks like would typically only be an appropriate text equivalent when it&#039;s purpose is as an image (see Providing Text Alternatives for Images of Pictures), for instance in the context of a page explaining the visual qualities of a well designed logo. If the symbol provides redundant or purely decorative information, the value of the alt attribute of the image can be null (alt=&quot;&quot;)



Examples



* Logos

* Icons

* Emblems
</description>

<examples>
<ex_head_1>
A logo used for branding.
</ex_head_1>
<ex_desc_1>
<h1><img src=&quot;w3clogo.png&quot; alt=&quot;The World Wide Web Consortium (W3C)&quot;></h1>
</ex_desc_1>
<ex_head_2>
A warning icon on a weather page about hazardous conditions. 
</ex_head_2>
<ex_desc_2>
<img src=&quot;warningicon.png&quot; alt=&quot;warning&quot;>
</ex_desc_2>
</examples>

<resources>
<resources_title1>
Web Design References: Accessibility
</resources_title1>
<resource_uri1>
http://www.d.umn.edu/itss/support/Training/Online/webdesign/accessibility.html#alt
</resource_uri1>
<resources_title2>

</resources_title2>
<resource_uri2>

</resource_uri2>
</resources>

<related_techniques>
<related_technique>
G94
</related_technique>
<related_technique>
H37
</related_technique>
</related_techniques>

<tests>
<procedure>
1. remove, hide, or mask the non-text content

2. replace it with the text alternative

3. Check that the purpose of the non-text content is met by the text alternative.

4. If the non-text content contains words that are important to understanding the content, the words are included in the text alternative.
</procedure>
<expected_result>
Check #3 is true. If the non-text content contains words that are important to understanding the content, check #4 is also true
</expected_result>
<test_file_1>

</test_file_1>
<pass_fail_1>

</pass_fail_1>
<test_file_2>

</test_file_2>
<pass_fail_2>

</pass_fail_2>
</tests>

</technique>

Additional Notes:

This technique is part of the HTMLWG&#039;s Action 54: First Draft

http://esw.w3.org/topic/HTML/Action54AltAttribute



If it is accepted by WCAG we hope to remove it from our document as stated in the second draft

http://esw.w3.org/topic/HTML/Action54AltAttributeSecondDraft#head-f0bf2ebf9f3e1fa190974101c6b70700ff176772



The Action 54 first draft provides much non-normative guidance in the application of the ALT attribute, which may not be appropriate for inclusion in a markup language specification, and which moreover could be seen as usurping the role of WCAG 2.0 and its techniques documents. A format specification is not a tutorial. It would be very helpful if the Techniques for WCAG 2.0. could incorporate this information or a variation of it. Then the HTML5 spec could link to it. As PF has said, &quot;WCAG WG is chartered to set Accessibility guidelines and HTML WG is not&quot;.

http://lists.w3.org/Archives/Public/public-html/2008Feb/0082.html 



Thank you,



The HTMLWG Action 54 Team:

Steven Faulkner

Joshue O Connor

Laura Carlson



Peer reviewers:

Gez Lemon

Gregory Rosmaita

Received on Wednesday, 4 June 2008 16:44:56 UTC