Logical Linearized Order on a Page

I've removed the site-comments alias from this so we can 
generate a discussion thread on WAI IG.

At 03:09 PM 8/25/2000 , Ian Jacobs wrote:
>"Bailey, Bruce" wrote:
> > How is [NavBar] [W3C Links: A to Z] [News and Content] [More Links and
> > Search] [NavBar] a logical reading order?
>That's precisely the order of objects on the page!

This is one of the problems we've faced at Edapta while 
considering how restructured, dynamic pages should be presented
for people using a linear mode of access -- primarily, people
who are using screenreaders and thus have to experience each
section of a page sequentially.

Because our goal at Edapta is to produce optimized user interfaces
for each site visitor, rather than "compromise" pages, we need to
look at how BEST to present this information.  Because we are
dynamically generating interfaces from the same content, on the
server side using XSL and XML technologies, we have luxury of
not only reshaping the appearance of each structure on the page,
but also restructuring how the page is ordered.

The approach that I've taken on Edapta's edapted user interfaces
is to look at each page separately and decide what the *main
content* of that page is.  Then I figure out the next most important
bit, and the next most important bit, and so on down the line.
This actually is what nearly any good graphic artist or layout
designer will do as well!

The difference is in what we do next.  The graphical designer
would then figure out where the main content will be the most
obvious, and places that appropriately, working her way down
the list.  For example, a banner identifying the company or
organization will go on the top.  A navigation bar of some
kind will typically go on the left, and a secondary or "sidebar"
navigation bar will go on the right.  Tertiary navigation and
"indicia" ends up on the bottom.  And the most important
content goes in the middle, usually (this is just a common
convention of web design) in the middle with a white background
while color is used to enhance the other elements of the page.

You may notice that I've described how the W3C page is organized;
this is no accident. :)

When a light-dependent user (that's a joke -- I mean "someone who
can see the graphical layout") comes to the W3C page, she knows
where to find the information.  Try it yourself -- your eyes
jump right to the middle of the page, looking for the information
you need.  Then you try the left hand side, and then right hand
side.  If you can't find it, you scroll down, probably looking
in the middle, then the left, then the right.  Note that I'm
describing an average viewing experience for someone who has
used web pages a lot, and is used to the English layout; your
results may vary due to i18n issues if we're talking other
languages which move in mysterious ways.

But my point is:  None of the graphical users will -ever-
experience the web page in the linear order that's described
by the HTML.  I won't read the top "W3C" logo first, and then
read all of the "A to Z" links on the left, then read all of
the headlines, before I even look at the (unidentified) "table
of contents" on the right side of the page.  That's not how
my eyes work, and it's not how _design_ works.  The very
graphical layout of the page draws me to the center, to the
big red headline.

Okay, so how do I adapt that for someone who is experiencing
the page in a linear function?  Easy -- I decide what is most
important on the page and I place that first, and then the
rest in decreasing order of importance.

As an aside, some of you might be thinking, "Woah, hold on,
pardner! What sort of patronizing decisions are you making
here, that you know best about what's important and what's
not, that you make these decisions for someone else?"  And
that's a valid thing to ask.  There's two things to consider
here.  The first is that the graphical layout designer is
doing _the exact same thing_ based on how she chooses to
lay out the page.  Graphical design is very powerful, and
she really _can_ force me how to experience a page based on
how she's laid it out.  The second thing is the in-page table
of contents.

For each "linear layout" page generated by Edapta's software,
I have it automatically create a "page table of contents"
at the beginning of the page.  This lists the sections of
the page and allows the user to know in very short order
what is on the page, and how that information can be accessed
via links (and sometimes via hotkeys).  This serves as both
a summary -and- an in-page navigation system to allow fast
access inside the page.

This is very similar to the <link rel="bookmark"> attributes
which are on the W3C's homepage -- they are supported in Lynx
to form a menu at the top, but I'm not sure what else supports
this style of navigation.  Well, besides Edapta, but we're still
in alpha development on our products. :)

Here's an example of the "page table of contents" from the top
of the Edapta "jobs" page as edapted for a blind screenreader
user:

Work@Edapta

Page Navigation:
1. Edapta Lets You Be You...
2. Open Positions
3. Join Our Team
4. Site Navigation

Comments and feedback on this approach are welcome.  Demos of
Edapta techniques might or might not be available if you ask in
private email. :)  [Sorry, no competitors allowed. :)]

-- 
Kynn Bartlett  <kynn@idyllmtn.com>                       http://kynn.com/
Director of Accessibility, Edapta                  http://www.edapta.com/
Chief Technologist, Idyll Mountain Internet      http://www.idyllmtn.com/
AWARE Center Director                         http://www.awarecenter.org/
Vote for Liz for N. Am. ICANN Nominee!        http://www.khyri.com/icann/

Received on Friday, 25 August 2000 18:49:17 UTC