Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Jan 2003
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Web Menus (DHTML) and Accessibility Guidelines

    I am creating a site that is required to follow Web Content Accessibilty Guidelines (Bobby)
    http://www.w3.org/WAI/

    At the same time, I have a large number of categories I'd like to have accessed via a navigation bar on the top of the page, and with drop down menus (DHTML) to sub-categories.

    After recieving the Accessibility Guidelines, I don't see how drop down menus can at all be used in compliance.

    Any suggestions?
    Thanks

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    This is a problem with most DHTML effects. However, you can still have accessible menus.

    The deal is, you use nested <ul>'s - so that browsers that may not understand it will still see a logical order of links. You can go for pure CSS from here, using :hover on the li's, which means something like Gecko/KHTML/Opera-only (IE will see the entire tree), or can use some Javascript in conjunction to make IE see the menu as well.

    An example of that system in place:

    http://devedge.netscape.com

    An explanation for pure CSS menus:

    http://www.meyerweb.com/eric/css/edge/menus/demo.html

    And another implementation of hybrid CSS/DHTML menus using behaviors to make up for IE:

    http://www.brothercake.com/scripts/navmeister/page.php

  • #3
    New Coder
    Join Date
    Jan 2003
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ah, nice.

    Thank you very much.

  • #4
    New Coder
    Join Date
    Jan 2003
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    How about using such menus with non-CSS browsers?

    I wonder if I should use pure javascript menus, but perhaps I'll run into problems with accessibility guidelines.

    Here is a dropdown menu scheme that I'm pretty sure plays well with CSS, non-CSS browsers and accessibility apps:
    http://www.gazingus.org/dhtml/?id=109

    Any opinions about that menu? I wish the menu could be first actived (displayed) with a mouse-over rather than a click (I see this is the case on Mozilla and IE). Also, in Netscape 4.5 the menu appears a <UL> list.

    Thanks for your help.
    Last edited by carld; 03-04-2003 at 09:01 PM.

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That's exactly what you want - the links jkd posted are variations of the same core idea.

    So browsers which don't have the CSS/javascript support to build the menus, get the plain unorderdered list; a heirarchical list of links is semantically equivalent to dropdown menus, and navigable to all user agents, right back to Lynx, and of course speaking browsers, and other non-visual user-agents. Bobby will smile at that
    Last edited by brothercake; 03-04-2003 at 09:38 PM.

  • #6
    New Coder
    Join Date
    Jan 2003
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Great, thanks for your comment brothercake. I've been playing with Dave Lindquist's menu (grazingus.org) and it is pretty simple to customize.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •