WebAIM - Web Accessibility In Mind

E-mail List Archives

Presenting non-tabular data/titles on web application page

for

From: Angela French
Date: Sep 8, 2011 1:09PM

Hello,
I am on a team creating a new web application for our college system. I am helping with the UI and trying to ensure that we make this app as accessible as possible. At the moment I am struggling with the best way to present information on a page which is related to data that will appear in a table on the same page. In the example below, the page is titled with an <h1> as "Class Special Program" , then from having selected the specific class name from a previous page, the selected Class Name appears and that class's related Special Program. At first the developer presented the Class Name and the Special Program Name as two separate <h2> tags. I don't think that is a good solution because, to me, then content should follow the first <h2>, and also these titles are describing what is found in the subsequent table. Then we considered putting both the Class Name and the Special Program Name all in one <h2> with some sort of punctuation or word between the two that would indic
ate their relationship.

EXAMPLE:
<h1> Class Special Program</h1>

MATH 072 MATH FUNDAMENTALS IV [this is the class name]
Family Literacy Program [this is the special program name]

<table>data table here</table>


We also have this same sort of issue on other pages where the "headings" under the <h1> might be a student's name and student ID, followed by a data table that shows classes the student is enrolled in.

So the basic gist of this is finding an appropriate html element to present the non-tabular data on the page that needs to accompany the tabular data.


Thank you for your insights,


Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
<EMAIL REMOVED>
http://www.checkoutacollege.com/