We have a feature in our CMS that allows users to add a spotlight box of 
related content to the right of the main content. This is not a right column 
(which we also allow) but a floated block of content. Visually this works well 
and the user base wants the feature. Unfortunately, there are accessibility 
issues as it is now implemented. First, in order to get the content div to 
float right, it must appear above the content it is related to in the HTML. 
Second, content block starts with a header 3. As a result, the resulting HTML 
markup ends up tagged incorrectly. The H3 ends up in the middle of the main 
content and all of the main content below is therefore associated with the h3.

The ideal would be to position  the related content at the bottom of the 
associate main content and then position it at the top right of the main 
content. So visually it would look the same but the HTML reading order and 
header nesting would be correct. We cannot find and CSS solution that will do 
that. Anyone?

Assuming that is the case, is there a way to have this content appear above the 
main content that it is related to, but NOT apply a header yet label it in  
semantic fashion that indicates its relationship to the document? ARIA? <div  
role=complementary >

There are some limitations to what we can provide given this is a CMS system 
that services many sites. However, we have reasonable control of how the output 
is generated and would prefer to provide this feature yet make some reasonable 
concessions for accessibility.

A sample page using this spotlight feature is at 
Rick Hill, Web CMS Administrator
University Communications, UC Davis
Rick Hill, Web CMS Administrator
University Communications, UC Davis
(530) 752-9612
Web CMS assistance at cmsh...@ucdavis.edu<mailto:cmsh...@ucdavis.edu>

List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org

Reply via email to