Hi,
-Lost wrote:
I cannot for the life of me remember the site name, but I believe it was the site of one
of the regular posters here or perhaps in comp.lang.java.javascript. Anyway...
The site in particular boasted about accessible JavaScript or proper JavaScript
degradation, something along those lines. I remember specifically when I visited the site
without JavaScript enabled it displayed the entire "menu" in a vertical fashion along the
left side of the page without destroying the placement of the rest of the content. With
JavaScript enabled it was a horizontal menu spanning the top of the page (I think).
I realize this is ridiculously vague, but if anyone has any idea about the site, please
provide the URL. I'd love to check out the design and code aspect of it.
Alrighty... so, thanks guys/gals!
-Lost
It's a complex subject, but there are a few ground rules that you can
follow. Don't forget that some browsers have also limited CSS support,
so you should think not only of what happens when JavaScript is off, but
also when CSS is off. I might be a good idea to check your site in
mobile browsers too, for example Blazer or Xiino for Palm OS. The result
is sometimes suprising (for example, Blazer supports a subset of
JavaScript. It supports document.write, for example, but not
document.getElementById)
- Always display the elements first, and hide them with JavaScript. This
was, you ensure that the element is displayed if JavaScript is off. That
sounds like an obvious statement, but for example DotText (a .NET blog
system) doesn't follow it, which is a pain.
Of course, it's the contrary for elements which must only be displayed
if script is active. For example, some "image buttons" are only active
when JavaScript is on, so you should hide them first and display them
using JavaScript.
- Use feature detection instead of browser detection. If you need
getElementById somewhere, test for it first:
if ( document.getElementById )
{
document.getElementById( "myDiv" ).style.top = "...";
}
- Use CSS. When using position: absolute for elements, think about the
order in which you place them on your HTML page, since they will appear
in that same order if CSS positioning if not supported.
- Try to use JavaScript to improve the user experience, but not for
critical functionality. Often, you must duplicate functionality on the
client and on the server: On the client to avoid unnecessary postbacks;
on the server because it's the only place where you're sure that the
code will be executed.
- Use links in that form:
<a href="nojs.html"
onclick="doSomething();return false;">Something</a>
This ensures that the user will see something if JavaScript is off when
he clicks the link. Using "#" is bad practice. The page "nojs.html"
should explain what just happened, for example
http://www.galasoft-lb.ch/nojs.html
- If you use JavaScript for navigation too, don't forget to include the
target page's URL in the HREF:
<a href="nextPage.html"
onclick="navigateTo( this.href );return false;">Go to next page</a>
I try to do my best and offer a functional site with JavaScript off
(
www.galasoft-lb.ch). However, I am not satisfied yet (for example, the
menu on my page may hide part of the page's content if JavaScript is
off, but CSS positioning is supported. I must find a better solution here).
HTH,
Laurent
--
Laurent Bugnion [MVP ASP.NET]
Software engineering:
http://www.galasoft-LB.ch
PhotoAlbum:
http://www.galasoft-LB.ch/pictures
Support children in Calcutta:
http://www.calcutta-espoir.ch 
