Thanks for this example.

> there's no doubt in my mind that YUI team hasn't processed
> all the issues you bring up when making their determinations
> on structure

I don't know if they have. The YUI developers are very capable people,
but this does not totally guarantee that YUI is accessible or that
they don't get things wrong sometimes. But i can see that they're
doing exactly what i'm saying that Superfish should allow.

What YUI 3.0 Menu has:

        ...
        <li>
                <a class="yui-menu-label">Submenu title (e.g. category name)</a>
                <div class="yui-menu">
                        <div class="yui-menu-content">
                                <ul>
                                        <li class="yui-menuitem">...</li>
                                        <li class="yui-menuitem">...</li>
                                </ul>
                        </div>
                </div>
        </li>
        ...

This is perfectly fine. There are two containing DIVs, which has no
semantic and accessibility impact (DIVs are neutral). Then the content
of the submenu, which in this case is a UL list with one LI for each
submenu item. Nothing wrong here. This is exactly the structure i had
to code, and why i had to hack Superfish which doesn't allow it. ;)

So what i had to code would fit perfectly with this YUI widget:

        ...
        <li>
                <a class="yui-menu-label">Category name</a>
                <div class="yui-menu">
                        <div class="yui-menu-content">
                                <p>Short description of the category's 
content</p>
                                <ul>
                                        <li class="yui-menuitem">...</li>
                                        <li class="yui-menuitem">...</li>
                                </ul>
                        </div>
                </div>
        </li>
        ...

Meanwhile, what you said was fine (and i believe is not, though it's
not a BIG issue) is, using similar classes:

        ...
        <li>
                <a class="menu-label">Category name</a>
                <ul class="menu">
                        <li class="menu-content">
                                <p>Short description of the category's 
content</p>
                                <ul>
                                        <li class="menuitem">...</li>
                                        <li class="menuitem">...</li>
                                </ul>
                        </li>
                </ul>
        </li>
        ...

(Or maybe with a DIV between the container LI and the submenu's
content, to avoid problems with current Superfish inner selectors.)

Regarding higher powers, i should consult with accessibility experts i
know about using a one-item unordered list as a container (just
because Superfish requires it...). It's not elegant, and i suspect it
might cause problems to some screen-reader users, but they may be able
to confirm how significant those problems would be.

Anyway, being forced to use subpar HTML code because a JS script
requires some particular tags is never a good thing. In this case the
consequences may be benign (or not...), in other cases they may be
quite bad.

Reply via email to