[Wsuug] JavaScript Rollovers and New Window Done Right?

[Christopher Jones]

On Tue, Apr 1, 2008 at 4:05 PM, Zach Young <young.zach at gmail.com> wrote:

> <snip>
> 1. Rollovers - Links start as text links. Then with JavaScript, I get
> links with a class of 'rollover' and convert them to images.
> <snip>


I'm not sure how I feel about the rollovers yet. I'm with Jon in that I
typically use CSS backgrounds tied to :hover for rollovers. While it
requires an action, I still see rollovers as presentational, not behavioral,
and thus fall into the field of CSS over Javascript in my mind. But I do
like the idea of starting the page with only text links. Images in the XHTML
add nothing to the semantic value in this case, so moving them out to
somewhere else is certainly preferable in my book. The one thing I really
don't like is the class="rollover". That class name adds no semantic value,
meaning that we have removed one non-semantic element (the image) and
replaced it with another (a useless class). I would remove the class from
the links and force the javascript to work a little harder by basing it's
work off the closest id (the ul, in this case).


>
> 2. New window - I'm pretty sure this is fine. The only problem I can
> see is that if someone doesn't have JS, the link will open in the same
> window. But I'd rather keep any target business out of my XHTML. This
> function looks for links with the class of ''newWindow' and adds
> onclick events that make them open in a new window.


The concept of new windows is just terrible usability in general. See
Nielsen's article here. http://www.useit.com/alertbox/9605.html
The exception being non-web documents (pdfs, docs, etc), which are mentioned
in this article. http://www.useit.com/alertbox/open_new_windows.html
Though if you must open new windows (we just finished a project where we
were forced to), I have the same argument as to the rollover class. If you
are linking to external sites, a rel="external" in the markup is better
semantics than a class describing what event happens when you click on it.

~ Christopher
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://www.thelinuxlink.net/pipermail/wsuug/attachments/20080402/8d483e71/attachment.html