User:RexxS/Timeline

This is an attempt to examine some of the accessibility issues in Timelines.

The principal problem is that the association between year and item is merely visual, and therefore inaccessible to non-visual user agents (e.g. screen-readers). Therefore it seems necessary to duplicate the year information: (1) as text and directly associated with an item; and (2) as an image of years on an axis (but with null alt text) to allow sighted viewers to take in the information "at a glance" that a timeline is intended to convey.

Per the discussion at Wikipedia talk:Manual of Style/Accessibility, I've taken the Template:Center for Biologics Evaluation and Research graphical timeline and tried to apply the above principle. The result is a table with variable row heights plus an image of the timeline. Although a default row height is 24px on my browser with monobook skin, I've allowed 32px for the smallest interval (in this case 4 years), making 8px per year the scale. This could be made smaller by reducing the text size in the table (perhaps to 90% - at the risk of forcing some users to zoom the browser) and reducing the margin for disparity between different skins and user-defined font sizes. I doubt that it could be sensibly reduced below 6px per year in any case. It takes a bit of working to scale and crop a vector image (File:Axis1870-2020.svg) to the correct size as well as calculate the row heights, but that's the sort of thing that php on the server ought to be taking care of. For now though, this is a draft of a possibly more accessible timeline.



The present center can trace its history back to the original American public health service, which later became the NIH.