Link to home
Start Free TrialLog in
Avatar of SamuelMiller
SamuelMiller

asked on

Objects should have a text alternative?

Hi,
When validating my page with the online service Total Validator, I get the accessibility warning that
"When using <object>, you should provide a text alternative in the body text of the object. See http://www.w3.org/TR/WCAG20-TECHS/H53.htm"

I have a three questions:
1) Would I simply insert the alternative text, for example within paragraph tags, as shown below with in the Quicktime object tag. As you see I have two object versions -- one for IE and one for other browsers. Does IE respond to alternative content within the object tag as well? Should I have it in within the IE object tags as well.

2) IE incorrectly displays alt tag text as a tooltip, which should be reserved for the title tag. Would using the object tag work as an alternative to avoid unsightly popups but still provide alternative content for screen readers. Does this work with all major browsers, including IE 7 and IE8?

For example?
<object data="companylogo.gif" type="image/gif" width="80" height="80">
<p>Company Name</p>
</object>

3) Also, how would I make an object clickable as a link with something thing like the above code? Can I do it without Javascript?

Thanks,
Sam Miller




<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" title="" width="583" height="344">
<param name="src" value="/assets/videos/oral-health-16x9-583x328.mov" /> 
<param name="controller" value="true" /> 
<param name="autoplay" value="false" />
<param name="bgcolor" value="ffffff" />
<param name="pluginspage" value="http://www.apple.com/quicktime/download/" />
<!--[if !IE]>-->
<object type="video/quicktime" data="/assets/videos/oral-health-16x9-583x328.mov" 
width="583" height="344">
<param name="autoplay" value="false" />
<param name="controller" value="true" />
<param name="pluginspage" value="http://www.apple.com/quicktime/download/" />
<p>Alternative text here?</p>
</object>
<!--<![endif]--> 
</object>

Open in new window

Avatar of masterpass
masterpass
Flag of India image

1. IE is always messy and follows it's own standard .. Its better that you keep it inside the IE object tag

2. By default the alt tag is the tool-tip for the images . so when you have a image content in a tag you should pass the alternate text which will be shown to the users when the move over the image

3. Yes, you can do without JS. It would be some thing like this , make sure wmode=transparent is set the object tag.
<a href="https://www.experts-exchange.com/questions/25521680/Objects-should-have-a-text-alternative.html?cid=1749"
<object data="companylogo.gif" type="image/gif" width="80" height="80" wmode="transparent">
<p>Company Name</p>
</object></a>
Avatar of SamuelMiller
SamuelMiller

ASKER

Hi,
Thanks for your reply!

Will including a paragraph tag, a block-level element, within a link tag, an inline element, as shown above, validate?

As I understand it, the purpose of the tooltip is to provide additional information to the user who is viewing the image. The purpose of the alt tag, on the other hand, is to provide a description of the image if there if the image doesn't load or the page is being read by a screen reader. Standards-compliant browsers such as Firefox and Safari don't show a tooltip for the alt tagl, only for the tittle tag. To get around IE display the alt text as a tooltip is to include an empty title tag as in title="".

More thoughts on this?
Sam
ASKER CERTIFIED SOLUTION
Avatar of masterpass
masterpass
Flag of India image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial