14 June 2004

Javascript in Web Standards

It seems to be that when people think 'web standards', quite often they think XHTML, CSS, and some times JavaScript. The importance they put on those technologies is also in that order.

Despite the obvious flaw in that way of thinking (that is, that web standards are the up to date guidelines on how to use web technologies, not the technologies themselves), it always seems that JavaScript gets pushed to the back, or forgotten all together. For this reason I feel that JavaScript's place within web standards is a bit fuzzy, and that the amount of people talking about using JavaScript within web standards is lacking.

The side effect of this is that people are either shying away from JavaScript, or don't know how to use it properly and go about undoing all their good work with XHTML and CSS by using some really BAD JavaScript.

What I would like to know in this 'Ask the Audience' entry is;

  • What resources do you use to learn how to implement JavaScript into your web standardised sites?
  • Who do you think is on the cutting edge of using JavaScript within web standards in the blogging community? (like Eric M is for CSS)
  • Do you feel that JavaScript does have a place in the future of the web?

I want to become better acquainted with JavaScript. I did learn a lot about JavaScript, but that was before I learnt anything about web standards. Now I feel as if I have to learn it all again. Any help would be great.

Comments ( 9 )

  1. Eric

    This is interesting to me...

    ...as I am just learning JavaScript, and have seen so much bad JavaScript that I have doubts as to its ability to be used effectively. You might want to check out the notes from the recent W3C convention; there was a discussion of JavaScript and the difficulty it poses...the summary is that it isn't really a good language for many things, though Bert Bos was perhaps too hard on it. Perhaps a new language is needed. Much of Javascript's features have been replaced by CSS - maybe that is the best direction to go, though CSS is only partway there at this point.

    Much of what I've seen on A List Apart in Javascript is less than impressive to me, and seems to break usability more than it helps.

    So, I am anxious to know others' views on this subject, and as a sidebar, if anyone knows of a good resource to learn Javascript in a way that bypasses the useless aspects (rollovers, stupid smoke and mirrors) and focuses on the ways to interact with the DOM in a standards-compliant way.
    15 June 2004 at 05:38
  2. Phil Baines

    I know what you mean about seeing some really nasty javascript around the web. It gives me the same feeling as when I see nested tables for layout, or some really bad CSS. My point being that anything can be done bad, and it is not the JavaScript technology that should be blamed, but the coders.

    I think that Bert Bos' statement was extreamly harsh, and stupid. He will reap the reward for that one.

    JavaScript DOM Programming is the way to go, yes, but I do not know the way. ;)
    15 June 2004 at 09:45
  3. Chris

    The trouble with programming with the DOM is that whilst browsers like Firefox and Mozilla access the DOM to a higher level, Internet Explorer has its own custom DOM commands which do not work in any other browser. This is partly the reason for the large amounts of Javascript on pages, the need to have seperate commands for different browsers.

    I tend to try and avoid using Javascript for anything complicated on my pages, instead substituting it for server side code and only using Javascript for validation and layer code.
    15 June 2004 at 11:37
  4. Jennifer Grucza

    My favorite resource for Javascript programming is the O'Reilly book "JavaScript: The Definitive Guide". It's easy to navigate and find things, and it outlines the concepts instead of being just a big heap of collected scripts like most Javascript websites seem to be.

    I try to write Javascript that works in all browsers, or that degrades gracefully in browsers that don't support certain methods or attributes, so that I don't have to do any browser sniffing or multiple versions of code.

    At work, I typically use Javascript for things like enabling or disabling input fields based on whether a checkbox or radio button is selected, expanding and collapsing trees, and similar things.

    I haven't really gotten into seperating my Javascript from my HTML using event listeners, though. Though I do seperate out all commonly used functions into a seperate Javascript file.
    15 June 2004 at 21:21
  5. Richard@Home

    Web Standards and Javascript

    Oh most definitely! Javascript DOES have a part in web standards.

    It can be used to add additional functionailty at run time without bogging down your clean, semantic markup. See my article 'Back To Basics: Web Development turns full circle' ( http://richardathome.no-ip.com/index.php?article_id=227 ) for some examples.

    Now we are moving towards a mindset that separates behaviour and presentation, javascript will become more and more exceptable. There are some excellent examples of this process already ( http://www.clagnut.com/sandbox/dynamic-accesskeys/ for one )
    16 June 2004 at 14:33
  6. Phil Baines

    Richard, I am glad you think so.

    I also think that Mr Rutters script is a great exampe of Javascript being used properly, and put to good use.

    18 June 2004 at 13:39
  7. Jeremy Keith

    JavaScript is the new CSS

    I think we're going to be hearing a whole lot more about about the DOM in the near future. More importantly, we're going to hear a whole lot more about using the DOM correctly.

    In the same way that CSS should be abstracted to as a presentation layer over the content, good JavaScript acts as a behaviour layer over the content and presentation.

    Up 'till now, a lot of JavaScript has been mixed in with the content layer: adding event handlers to tags which is kind of like adding inline style attributes. The age of unobtrusive JavaScript is about to dawn though.

    Some names on the cutting edge:

    Stuart Langridge
    http://kryogenix.org/

    Simon Willison
    http://simon.incutio.com/

    Peter Paul-Koch
    http://www.quirksmode.org/
    20 June 2004 at 02:12
  8. Phil Baines

    Jeremy Keith! What a pleasure to have you at my humble online abode!

    "JavaScript is the new CSS" - Such a true statement! I really think that the way we use JavaScript is about to go through a massive period of enlightenment.

    I understand what you mean by separating the Behaviour Layer, and such. I think the theory of it is just dandy. I just haven't had the ability to start implementing it yet. It is such a shame that I can only learn so many new tricks at one time.

    Hopefully, with those links I can gain more knowledge and start using JavaScript in the way that it should be used. I have to admit that I am guilty of using inline JavaScript on this site to make my pop outs work in IE. With just a small bit of research I hope to get on top of that.

    Once again, thank you for your informative comment!
    20 June 2004 at 23:06
  9. texas holdem software

    texas holdem software

    <h1> You may find it interesting to visit the sites in the field of<A HREF="http://www.teriandersonandassoc.com/video-poker-software.html"> video poker software </A> video poker software <A HREF="http://www.teriandersonandassoc.com/video-poker-software.html"> http://www.teriandersonandassoc.com/video-poker-software.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/free-poker-game.html"> free poker game </A> free poker game <A HREF="http://www.teriandersonandassoc.com/free-poker-game.html"> http://www.teriandersonandassoc.com/free-poker-game.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/on-line-poker.html"> on line poker </A> on line poker <A HREF="http://www.teriandersonandassoc.com/on-line-poker.html"> http://www.teriandersonandassoc.com/on-line-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/online-poker.html"> online poker </A> online poker <A HREF="http://www.teriandersonandassoc.com/online-poker.html"> http://www.teriandersonandassoc.com/online-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/texas-hold-em-online.html"> texas hold em online </A> texas hold em online <A HREF="http://www.teriandersonandassoc.com/texas-hold-em-online.html"> http://www.teriandersonandassoc.com/texas-hold-em-online.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/3-card-poker.html"> 3 card poker </A> 3 card poker <A HREF="http://www.teriandersonandassoc.com/3-card-poker.html"> http://www.teriandersonandassoc.com/3-card-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/free-online-poker.html"> free online poker </A> free online poker <A HREF="http://www.teriandersonandassoc.com/free-online-poker.html"> http://www.teriandersonandassoc.com/free-online-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/strip-poker.html"> strip poker </A> strip poker <A HREF="http://www.teriandersonandassoc.com/strip-poker.html"> http://www.teriandersonandassoc.com/strip-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/winning-poker-hands.html"> winning poker hands </A> winning poker hands <A HREF="http://www.teriandersonandassoc.com/winning-poker-hands.html"> http://www.teriandersonandassoc.com/winning-poker-hands.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/card-poker.html"> card poker </A> card poker <A HREF="http://www.teriandersonandassoc.com/card-poker.html"> http://www.teriandersonandassoc.com/card-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/free-strip-poker.html"> free strip poker </A> free strip poker <A HREF="http://www.teriandersonandassoc.com/free-strip-poker.html"> http://www.teriandersonandassoc.com/free-strip-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/hold-em-poker.html"> hold em poker </A> hold em poker <A HREF="http://www.teriandersonandassoc.com/hold-em-poker.html"> http://www.teriandersonandassoc.com/hold-em-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/poker-on-line.html"> poker on line </A> poker on line <A HREF="http://www.teriandersonandassoc.com/poker-on-line.html"> http://www.teriandersonandassoc.com/poker-on-line.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/longest-poker-game.html"> longest poker game </A> longest poker game <A HREF="http://www.teriandersonandassoc.com/longest-poker-game.html"> http://www.teriandersonandassoc.com/longest-poker-game.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/texas-holdem-tables.html"> texas holdem tables </A> texas holdem tables <A HREF="http://www.teriandersonandassoc.com/texas-holdem-tables.html"> http://www.teriandersonandassoc.com/texas-holdem-tables.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/poker-tables.html"> poker tables </A> poker tables <A HREF="http://www.teriandersonandassoc.com/poker-tables.html"> http://www.teriandersonandassoc.com/poker-tables.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/free-texas-hold-em-online-play.html"> free texas hold em online play </A> free texas hold em online play <A HREF="http://www.teriandersonandassoc.com/free-texas-hold-em-online-play.html"> http://www.teriandersonandassoc.com/free-texas-hold-em-online-play.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/strategies-for-texas-hold-em.html"> strategies for texas hold em </A> strategies for texas hold em <A HREF="http://www.teriandersonandassoc.com/strategies-for-texas-hold-em.html"> http://www.teriandersonandassoc.com/strategies-for-texas-hold-em.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/texas-holdem-odds.html"> texas holdem odds </A> texas holdem odds <A HREF="http://www.teriandersonandassoc.com/texas-holdem-odds.html"> http://www.teriandersonandassoc.com/texas-holdem-odds.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/poker-tournament.html"> poker tournament </A> poker tournament <A HREF="http://www.teriandersonandassoc.com/poker-tournament.html"> http://www.teriandersonandassoc.com/poker-tournament.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/free-poker-chip-set.html"> free poker chip set </A> free poker chip set <A HREF="http://www.teriandersonandassoc.com/free-poker-chip-set.html"> http://www.teriandersonandassoc.com/free-poker-chip-set.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/yahoo-poker.html"> yahoo poker </A> yahoo poker <A HREF="http://www.teriandersonandassoc.com/yahoo-poker.html"> http://www.teriandersonandassoc.com/yahoo-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/free-online-poker-game.html"> free online poker game </A> free online poker game <A HREF="http://www.teriandersonandassoc.com/free-online-poker-game.html"> http://www.teriandersonandassoc.com/free-online-poker-game.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/video-poker.html"> video poker </A> video poker <A HREF="http://www.teriandersonandassoc.com/video-poker.html"> http://www.teriandersonandassoc.com/video-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/cowboy-poker.html"> cowboy poker </A> cowboy poker <A HREF="http://www.teriandersonandassoc.com/cowboy-poker.html"> http://www.teriandersonandassoc.com/cowboy-poker.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/texas-hold-em.html"> texas hold em </A> texas hold em <A HREF="http://www.teriandersonandassoc.com/texas-hold-em.html"> http://www.teriandersonandassoc.com/texas-hold-em.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/online-poker-game.html"> online poker game </A> online poker game <A HREF="http://www.teriandersonandassoc.com/online-poker-game.html"> http://www.teriandersonandassoc.com/online-poker-game.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/texas-holdem-poker-game.html"> texas holdem poker game </A> texas holdem poker game <A HREF="http://www.teriandersonandassoc.com/texas-holdem-poker-game.html"> http://www.teriandersonandassoc.com/texas-holdem-poker-game.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/holdem.html"> holdem </A> holdem <A HREF="http://www.teriandersonandassoc.com/holdem.html"> http://www.teriandersonandassoc.com/holdem.html</A> <br/> <A HREF="http://www.teriandersonandassoc.com/free-texas-hold-em.html"> free texas hold em </A> free texas hold em <A HREF="http://www.teriandersonandassoc.com/free-texas-hold-em.html"> http://www.teriandersonandassoc.com/free-texas-hold-em.html</A> <br/> - Tons of interesdting stuff!!! </h1>
    19 May 2005 at 16:40

Sorry, commenting has been disabled for a while. I am getting a stupid amount of comment spam, and need to find a new way of doing things.

I will not publish your email address, but I may use it to get in contact with you.

HTML tags and entities display as source; they do not render. To create a live link, simply type the URL (including http://).

Topics

  • I am more than willing to admit the big gaps in my knowledge on many topics, including web development. This is a topic I use to get help from the community, and my imaginary audience.
    Ask the Audience
  • Even though looking pretty is not the most important layer to a succesful web site (I don't think there is a Most Important), it does help!
    Graphic Design
  • Have you got a sense of?
    Humor
  • The glam, the sadness, the joy, the madness.
    Life of Findel
  • What ever doesn't fit
    Misc
  • I have a crappy camera, but I do try. A good artist always blames his tools.
    Photography
  • Here I chat about projects I am working on, going to work on, or finished. Some of them I will be happy to let you in on, others I will be ashamed of.
    Project Watch
  • Site news and updates
    Site Info
  • Keepin' an eye on the wwwubb
    Watching The Web
  • This topic will be used for talking about all manner of project management issues relating to Wed Development (Wubb Development). Where we may talk about how to code in the Wubb Development topic, we will be more likely to talk about giving quotes, or planning projects, in this topic.
    Working with Wubbs
  • All things Web Development - Web standards, Hacks, Graphics, and more.
    Wubb Development