[NBP web-reskin] FW: Prototype of new NBP Homepage

Edie Coletti ecoletti at nbp.org
Mon Sep 14 13:33:12 EDT 2009


Thanks Richard.  I took the revised page for a spin and I was able to
navigate the menu options without the use of a mouse. I asked Anna to take
another look as well. 

 

Also, I neglected to tell you that each web page should have a link at the
beginning of the navigation that points to a target at the beginning of the
main content area. This allows a visitor using a screen reader to skip
through navigation and get right to the content. On the new home page this
area will be the section with the video, starting with Readers Digest
Challenge. Here is the code we currently we use for this; it is placed near
the top of the home page: 

<a href="#ContentArea"><img src="/nbp/images/images/dot.gif" alt="Skip home
page links to go to main content" width="1" height="1" border="0"
style="float: left;" /></a>

 

And this code at the beginning of the content area:

<a name="ContentArea" id="ContentArea"></a>

 

With screen readers, it is also helpful to use headers to introduce sections
and sub sections this allows the visitor to skim through content quickly and
get to what they are interested in.

 

You can download a demo version of Jaws from Freedom Scientific, you can use
it for 40 minutes, then it stops and you need to reboot your computer to get
it started up again. I don't know if Window Eyes is any more generous.

Thanks,

Edie

  _____  

From: web-reskin-bounces at nbp.org [mailto:web-reskin-bounces at nbp.org] On
Behalf Of Richard Ward
Sent: Saturday, September 12, 2009 9:59 PM
To: Discussions regarding the 2009 UI reskin of nbp.org
Subject: Re: [NBP web-reskin] FW: Prototype of new NBP Homepage

 

Hello,

 

I've changed the body text to be DIV rather than table controlled.  But I
did leave the menu bar and right side menu as tables.  If this is still an
issue we can look at changing them.  I don't think the menu bar should be
changed but the right side one probably should be.

 

I have also added some ARIA tags to the menu bar itself as well as the drop
down on the bookstore link.  I've not worked with these before so I would
appreciate any feedback on how they are rendered by the reader.  Speaking of
which (no pun intended) is there any chance we could get a copy of the
reader software?  Or maybe you could point us to some good freeware that we
could install.  I think it would make the development easier if we
understood how the page was being converted to speech which would give us
some better insight into how best to use the ARIA tags.

 

The changes are up in CAMP28 so check them out and let me know what you
think.

 

Thanks,

 

Richard

On Tue, Sep 8, 2009 at 8:15 AM, Edie Coletti <ecoletti at nbp.org> wrote:

Here are Anna Dresner's comments on the home page. The first paragraph is
more about design & content, not accessibility. The other paragraphs we will
need to address.

-----Original Message-----
From: Woody Anna Dresner [mailto:adresner at nbp.org]
Sent: Thursday, September 03, 2009 1:47 PM
To: Edie Coletti
Cc: Antonio Guimaraes; Tony Grima; Kimberley Ballard; bmacdonald at nbp.org
Subject: Re: Prototype of new NBP Homepage

Hi,

I have several concerns about the home page. One is that there's no
text stating what  NBP is or welcoming the visitor. All I see is links
to services, a search box, a sign-up for a mailing list, a login form,
and some press releases. If I were new to the site, I would wonder
when I got to the end what the purpose was, and I wouldn't want to
have to go through the work entailed to find out. I think some sort of
welcome message near the beginning of the page would help a lot. It
doesn't have to be long; it could be something like what we had
before. How about putting it just after the search box, before the
list containing the link to the bookstore.

Another concern is that tables are being used for formatting, not
because tables are needed to convey meaning. This means that unless I
use table navigation keystrokes in my screen reader, the first cell in
the table appears on its own line, the one to its right appears on the
next line, and so on across the row, then all the cells from the
second row, etc., which can make the text less meaningful than it
otherwise would be. This also means that the lines in the press
releases are very short, making them choppy to read. I don't know that
much about HTML coding, but things like headings, lists, and block
quotes would work better.

Edie told me that the links like Bookstore are are mouseover links
that reveal submenus when you move the mouse over them. I would not
have known that if she hadn't told me, as my screen reader gave no
indication of it. I wonder if ARIA tags would help here.

The page ends with the line, "a great success!  With over 1000" It
seems odd to have it end in the middle of a sentence.

There is an image near the top called Rotating Image 1. An alt tag
would help here.

Headings would be useful to denote different parts of the page, such
as Services and What's New. I think every screen reader on the market
can move you to the next heading, with a single keystroke, which is
why headings are so useful.

That's about all I have for now. Sorry I don't have more positive to
say.

Best,
Anna


On Sep 2, 2009, at 1:30 PM, Edie Coletti wrote:

> Hi Anna & Antonio:
>
> Here is a link to a prototype of the homepage for you to test
http://28.camp.nbp.temphost.net:9028/ic/nbp/homepage.html
> .  The links are not working, but hopefully you'll be able to test
> the navigation.  Let me know if there is anything I can do to help
> with the testing.
>
> Thanks,
>
> Edie
>


_______________________________________________
Web-reskin mailing list
Web-reskin at nbp.org
http://www.nbp.org/mailman/listinfo/web-reskin

 

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://www.nbp.org/pipermail/web-reskin/attachments/20090914/75a63e58/attachment.html


More information about the Web-reskin mailing list