]]>
molly.com
Monday 14 March 2005
The Return of JavaScript
IS JAVASCRIPT THE NEW BLACK? Now that we’re cleaning up our document and presentation layers, a return to the DOM and behavior layer is back, with a new twist.
There’s lots of buzz in the hallways here at SXSW about many issues, but one conversation that keeps coming up among many of my colleagues is the question as to whether the timing is right to re-examine the importance of the DOM and scripting, and how it fits (or doesn’t fit) into standards-based design.
I’ve never been a JavaScript person, largely due to the fact because it’s never felt as approachable to me as markup and style and in many ways I found that intimidating. However, there is no question that the more I understand about well-structured, semantic markup and the way that presentation is effectively integrated with the document tree via CSS, I’ve become increasingly more interested in learning more about how the DOM and JavaScript can work in the context of Web standards. And apparently, I’m not the only one.
Is the DOM and JavaScript the new black? Whether you’re part of the SXSW hallway buzz, or far far from Austin and busy at work, life and play, I’d like to hear what you think.
Filed under: standards, web design and development
Posted by: Molly | 09:42 | Comments (30)
Myself, I’ve never been keen on JavaScript since I got onto the standards bandwagon: I guess this is mainly a knee-jerk reaction to all the redundant Javascript (things like image rollovers which can now be done better with CSS) and the really horrific stuff like the “you can’t right-click on my page” code. I’ve seen people achieve nice things with JS while not buggering standards, but they do seem to be very much in the minority at the moment…
It is “back,” but in a new way.
JS + DOM + CSS enables us to start with a basic, standards-compliant, accessible page first, and then add in some clever tricks and styling with JavaScript and the DOM later (after the page loads). It’s tricky (though a fun challenge) to do it in ways that don’t ruin the order in which a screen reader like JAWS will read the page. Using a post-page-load script to move elements around can help you determine how search engines and content indexing systems will read your pages, but you can still have the layout you want.
I recently wrestled that one down (I think!) in this method of adding a floated sidebar that text can wrap around while keeping it at the end of the source.
The DOM can become a good friend to standards-based design now that a majority of browsers support it well. And emerging things like Ajax can make very interesting use of the DOM too.
Hope you’re having a great time at SXSW, I am looking forward to learning from whatever comes out of it. Wish I were there!
they do seem to be very much in the minority at the moment…
That’s true, Fatty. We (Campbell-Ewald) used a ton of DOM methods when we redesigned chevrolet.com. It still validates as Strict XHTML, which ain’t bad for a big-ass corporate site. We never would have achieved the functionality that we did without using the DOM.
I used to be a big JavaScript freak, then I went off it as I got into standards-based and accessible design but lately I’ve been getting back into it…
IMHO it fits nicely into standards-based web-design as long as you maintain them in a seperate .js file (so that you get nice seperation between behaviour, content and presentation) and observe certain rules:
- The JavaScript’s functionality must NOT be essential – if someone has it turned off or it’s not supported by their browser (such as phones, PDAs and old-skool browsers) they can still do everything. Unfortunately this usually means duplicating stuff on the server-side (e.g.: checking user input)
- Make sure all the JavaScript stuff can be used via the keyboard – for every onmouseover there must also be a onfocus or similar
- Possibly more? Suggestions?
That way you maintain accessibility, graceful degredation and make your work managing the pages easier – all the hallmarks of good standards-based design!
After reading Peter-Paul Koch’s ALA article and the recent buzz about AJAX, Javascript really does seem to be coming back into vogue a well thoughtout manner.
To me the behavior layer is very similar to CSS in it’s setup. I often read that one of the benefits of CSS is to give control of the user experience back to the user with direction from the author. This seems to apply to the behavior layer as well. So “good” javascript will enhance the experience while degrading nicely for those who can’t/choose not to enable javascript. Just like the standards-based presentation/structure system is good for me when I don’t use CSS (or use my own CSS).
With technologies like XMLHttpRequest it’s hard not to at least be excited about the prospect of client side scripting again.
Wish I could have been in Austin this time around, but spent my conference allowance on WDW in Boston this year. Well, maybe someday I’ll get to both.
Unfortunately this usually means duplicating stuff on the server-side (e.g.: checking user input)
I would think this is general good practice anyway: I wouldn’t trust a malicious user not to try and submit false data to try and defraud you or a hacker to poke around in the system. The client is too much of an unknown to be trusted with their own validation.
I use JS to make better web apps. Creating elements on the fly…changing styles…photo fades. It’s all so much fun.
You must admit though, it was definitely intimidating back in the day. Also, haven’t you read all the recent posts in the beginning of the year? They said it was the year of the DOM
Michael Moncur from the javascript weblog and myself had this very same conversation the other day, and we are both a bit disapointed that there aren’t many javascript related presentations happening this year.
That being said, I do think DOM scripting is going to be, as you call it, the “new black”, especially with all the buzz around XMLHttpRequest lately.
I for one welcome it, as javascript has been the focus of most of my efforts for a number of years now, and I think once more people join the party, the more *good* scripts you’ll see on the web – ones that exist as an enhancement to a standards based document and are accessible and non-obtrusive — and they’ll supersede the google search results for javascript that result in cludgy, event attribute laden, non-standards based and non-semantic markup and techniques that date back to 1998.
I think it’s also important to touch on the aspect of “Unobtrusive JavaScript” which is basically the separation of content and behaviour — which your link to Mike West’s site so eloquently states.
JavaScript is just another arrow in the quiver of developing useful and interactive web sites.
The problems you run into layering JavaScript are similar to CSS: cross-browser compatibility. In addition, attaching events unfortunately must be done on page load. The largest problem with this is that the controls may be displayed on the page for a number of seconds before any behaviour is attached to them.
I work producing interfaces for a company with many engineers coding web applications. Their development process often rely on scripts that my team must code. The QA doesn’t like that (neither do I), but, since we always deal with big (really big) audience, the company minimizes the cost of having server-side processing using the users’ machines for finishing touches or even important stuff.
Unfortunatelly some of these applications simply doesn’t work without JavaScript (the first release of almost all of them was much before of good DOM support by the browsers –and we still have 5%-plus of IE 5.0/Win requests). We’re willing to follow “Unobtrusive JavaScript” guidelines, but there are cases where we can’t.
JavaScript rocks! But there are, of course, caveats–most of which have been mentioned above.
JavaScript allows all kinds of wonderful things client-side that simply wouldn’t be possible otherwise: just look at AJAX!
Like Flash, Java and other technologies though, it’s irresponsible to use JavaScript unnecessarily: for example roll-overs & form labels*.
Detection is also important; I’m sure my Pocket PC (2003SE) would work with GMail, but since Google detects that it’s IE 3.x I’m not even allowed to try.
Bottom line, I think if we are responsible in our design and development then JavaScript can be the next CSS; if not, it may well be the next Flash (not that there’s anything wrong with Flash per-se).
* browser bugs excepted.
Return of Javascript? Oh please, it never left. I’m a JavaScript freak, but I’m not fat.
Wrote a book on JavaScript in 1996 and followed up with one on DHTML in 1998, and if anyone calls me fat, I’ll hack their site and post photos of dogs wearing bikinis all over it.
Did write brief not on this at my weblog, more later in week. I did say, though, that if Javascript and the DOM is the new black, than pages that don’t break across machines and browsers is the new pink.
Molly, who is blogging the Women in Design session?
As long as it is only used to provide non-essential enhancements I think it can be a valuable “third-layer”. If you check for DOM compatability before attempting to do anything you dont have to worry about legacy browsers. I use it extensively for design elements on my own site (check how the headings are done on hypothecate) to complement the CSS.
Regarding Shelley’s comment: LOL.
I’m with you Molly – JavaScript can be a lot intimidating. It doesn’t help that most of the Javascripters I know speak in a different language (binary). Designers with ADD (most of us) tend to start drifting off after their first sentence.
HOWEVER…how often have I pined for a little splash of Javascript here and a little there to enhance user experience? Every day.
QUESTION: At the Boston conference, Joe Marini was most adament about making sure our sites are usable when javascript is turned off. How does that play into the equation?
At the 2004 O’Reilly Open Source convention most of the developers there were talking about client side scripting to lighten file size download and server resources while creating ever richer web-applications. So, for example, you would see a table displayed from a JS document.write loop rather than from similar php code echoing out XHTML. They would take that further with aggressive caching and data management to limit fetch and post calls to the server. What was interesting to me was that I didn’t see anyone coupling this with a standards based design — which would obviously increase efficiency.
That conference was in ‘04 and gmail was still fairly new, so I think a lot of that buzz was generated as a direct result of that application’s release but I bet AJAX — that combination of rich web application development and standards-based design missing back then — is behind the SXSW buzz, but not for web sites. Web sites will probably continue to have little use for JS but web applications built with web standards-based designs will make extensive, meaningful use of it.
Like PPK’s trademark phrase states, “Keep It Simple Stupid!”.
This methodology is what has made JavaScript more approachable.
The technology behind Ajax, YFT, and FAT (shameless plug) has been around for a long time. Likewise, some long time scripters keep yelling “It’s nothing new!”. I think this is obvious and most of us realize that.
What’s new is the methodology of “Keep It Simple” and the beautiful examples of simple, useable, and transparent JavaScripts that stay out of the users way. Gmail, Flickr, Ta-da Lists come to mind.
In the past, people tried to make their JavaScripts as “whizzy” as possible. JavaScript was all about the “wow” factor. Now it is about gracefully assisting the user.
Mark: It’s easy. From the client-side at least, gracefully failing without interrupting the users intended transaction is a simple task. It can become a bit cumbersome on the server-side. However, if you’ve a solid PHP framework or, better yet, you’re using Ruby on Rails or some other equally extensible framework… it’s a quite marginal task that can really pay off.
The Fade Anything Technique I referenced earlier resides on my Tackboard. Essentially, it is just a basic, ajax powered, blog. The Tackboard was created in response to a question just like yours over at Signal vs. Noise. My tackboard is a basic example of transparent JavaScript. It will work with you whether you have JavaScript enabled or not.
Btw, when did orange become black?
JavaScript, son of JavaScript
From SxSW, Molly writes about The Return of JavaScript: …one conversation that keeps coming up among many of my colleagues is the question as to whether the timing is right to re-examine the importance of the DOM and scripting, and…
Fade Indeed.
Adam: Thanks for the reminder – I am a big fan of that technique.
I think the reason why Javascript is making a comeback is precisely *because* the past couple of years have solidified support for high quality markup and styling.
You can’t build accessible, robust Javascript effects unless you have a good, solid foundation to begin with. Until recently, a lot of people just haven’t had that foundation, so the Javascript they were writing was simply unremarkable, unreliable hacks.
It’s worth remembering that EMCA script and DOM scripting isn’t just applicable to HTML. It’s also of vast use to a lot of other SGML/XML based languages such as SVG. I’m still waiting for SVG to take off…
Did anyone notice what a big dick zeldman really is? I did, so i went home and burned his book. Molly, Shea, Bowman, Hicks, Budd, Keith & Veen are all very classy people, people that take the time to say Hi no matter what. These are just the thinks I noticed at SXSW
Some awesome posts here, and in true blogger fashion, I’ll say “great!” to all the wonderful posts and respond to the one I felt was a bit negative. Why DO we do that? At any rate . . .
Dave, did you really have that experience? Zeldman is actually surprisingly shy. That’s my take on it anyway – and I’m sorry you felt that way about him.
On the other hand, I do suspect that the rest of us are more deeply involved these days. It’s understandable. I wouldn’t be so harsh personally, but I do kind of get where you’re coming from. I just don’t think I’d have taken it that much to heart.
At any rate, glad you found the rest of the folks you met to be warm and welcoming. I know I had a great time, and I hope that you did too.
wait a second…so are we talking about SxSW now?
it was great to see you in the vids Molly. Wish I was there (along with the hundreds of others that have been saying so).
Fatty wrote: “I’ve seen people achieve nice things with JS while not buggering standards, but they do seem to be very much in the minority at the moment…”
That’s always been true. Actually, if you think about it, good CSS authors are not the rule, either. To do good script requires a very good grounding in good markup and good CSS. It is all related.
pussy coming videos…
…
pussy clit ring galleries…
…