Nate Koechley's Blog

Faster DHTML in 12 Steps

As Microsoft's IEblog points out, their Faster DHTML is 12 Steps isn't entirely new but does have some valuable information. Obviously some of the info is quite IE-specific, but it's still worth a read.

Here are the tips included in the article:

• Batch Your DHTML Changes
• Talk to Your innerText
• Use the DOM to Add Individual Elements
• Expand Your Options in a SELECT Element
• Use the DOM to Update Tables
• Write Once, Use Many Times
• Don't Be Too Dynamic with Your Properties
• Data Binding is Good for You
• Keep Your Expando Properties Off the Document
• Avoid switching classes and style rules
• Collapse a Text Range Before Finding the Parent
• Related Topics

DOM Scripting Task Force - WaSP

Once again the fine folks at the Web Standards Project are helping us all move the industry forward, this time with the launch of their DOM Scripting Task Force as announced in their buzz archive today.

"The skillset of a front end programmer is a three-legged stool: structure (XHTML) is the first leg, presentation (CSS) the second, and behavior (DOM Scripting) the third," said Peter-Paul Koch, a prominent scripting expert and one of the founders of the task force. "These three legs should be equal, but at the moment the behavior leg is the shortest, least-valued and least-understood of the three, even though the DOM has been a W3C specification for seven years and enjoys relatively solid browser support."

They have a press release, a manifesto, and of course a website.

These topics aren't anything new necessarily, but it's good to see more and more developers picking up the torch. For more reading on this/these topics, check out these other posts from my blog: The Behavior Layer, Unobtrusively, and Semantic Markup - Create, Support and Extract.

If you eat and breath these topics, I'd love to hear from you and your resume.

DOM Scripting Task Force - WaSP

Once again the fine folks at the Web Standards Project are helping us all move the industry forward, this time with the launch of their DOM Scripting Task Force as announced in their buzz archive today.

"The skillset of a front end programmer is a three-legged stool: structure (XHTML) is the first leg, presentation (CSS) the second, and behavior (DOM Scripting) the third," said Peter-Paul Koch, a prominent scripting expert and one of the founders of the task force. "These three legs should be equal, but at the moment the behavior leg is the shortest, least-valued and least-understood of the three, even though the DOM has been a W3C specification for seven years and enjoys relatively solid browser support."

They have a press release, a manifesto, and of course a website.

These topics aren't anything new necessarily, but it's good to see more and more developers picking up the torch. For more reading on this/these topics, check out these other posts from my blog: The Behavior Layer, Unobtrusively, and Semantic Markup - Create, Support and Extract.

If you eat and breath these topics, please send me your resume.

Yahoo isn't just back in the game - it's winning.

Ben Hammersley writes an interesting piece in the Guardian today titled Second Sight. It's well worth reading, and looks at recent developments from Yahoo and Google, and reports that "Google, it seems, has jumped the shark." His conclusion is that it's "Three-nil to Yahoo." Give it a read, I think you'll be impressed, and probably find out some things about each company that go against the prevailing PR winds.

Yahoo is the new Google. Google is the new Yahoo. Up is down, and black is white. This spring has been very strange. Google, it seems, has jumped the shark. It has been overtaken, left standing, and not by some new startup of ultra smart MIT alumni or by the gazillions in the Microsoft development budget, but by the deeply unhip and previously discounted Yahoo.

The article provides a good overview of recent Yahoo activity, including the Yahoo Search API, research.yahoo.com (and next.yahoo.com), live traffic conditions on Yahoo! Maps, a gig of storage on Yahoo! Mail, Yahoo! 360, Flickr, and even the quietly released Creative Commons search on Yahoo!: http://search.yahoo.com/cc

Update: Danny Sullivan, Editor of the premier search industry publication, released their 5th Annual Search Engine Watch Awards today, and for the first time Yahoo! Search takes first place, bumping Google to second.Remember what I said about prevailing winds, and hold onto your hat.

Evolution vs Revolution in Web Standards

CNet's Paul Festa filed a story today, Fight over 'forms' clouds future of Net applications, with a subhead of "As Net heavyweights vie to define the next generation of Web applications, the Web's main standards body is facing a revolt within its own ranks over electronic forms, a cornerstone of interactive documents."

The article sheds some light on the WHAT-WG, as well as some of the players in this general saga. The most interesting section to me:

WHAT-WG members say the forms dispute illustrates a larger conflict over whether the W3C should proceed in a "revolutionary" mode, tackling problems from square one and coming up with technically elegant solutions--even if that results in the loss of backward-compatibility with older browsers--or an "evolutionary" mode, maintaining older technologies like HTML 4 and extending the usefulness of current browsing software.

I also enjoyed Steven Pemberton's comments:

"The WHAT approach works OK for small examples," Pemberton said. "But actors like the Department of Defense say 'no scripting.'"

And:

"I understand where WHAT is coming from, but they are browser makers, not forms experts," Pemberton said. "It is important to build something that is future-proof and not a Band-Aid solution. Forms (technology) is the basis of the e-commerce revolution and so it is important to do it right."

[All emphasis mine.]

News from the World Wide Web Consortium

For better or worse, I only catch up on my W3 reading every month or so. That said, here's the stuff that caught my eye recently:

• Call for Participation: W3C Workshop on Frameworks for Semantics in Web Services
• Working Draft: Glossary of Terms for Device Independence
• W3C Launches Voice Browser Activity
• 'Architecture of the World Wide Web, Volume One' is a W3C Recommendation

Browser Speed Comparisons

"There is a speed war on the web. Browsers compete on many fronts; security, standards support, features and speed. Most people are aware of which major browser fails on three of these, but one of them is still open for grabs. Speed."

Today’s Wrong Solution is Tomorrow’s Constraint

Layered Semantic Markup (LSM) is not a technology, but a framework comprised of HTML, XHTML, Cascading Style Sheets (CSS), Javascript, DOM and other Web technologies. LSM allows for appropriately implemented principles and standards.

LSM is a development framework for creating Web documents and experiences. LSM builds for the least capable devices first, then enhances those documents with separate logic for presentation, in ways that do not place an undue burden on baseline devices but which allow a richer experience for those users with modern graphical browser software. LSM supports all user agents, and is inclusive by design. (Progressive Enhancement - Unobtrusive Javascript)

LSM has structural semantic markup at its core, which provides lean, meaningful, accessible pages. This well-built core and the clear separation of structural, presentational and behavioral layers make this development philosophy superior to many short-sighted approaches.

Today’s wrong solution is tomorrow’s constraint. A holistic vision - an underlying philosophy - must guide technical decisions. LSM provides the strategy for a sound and future-ready approach.

LSM embraces Graded Browser Support by using one markup document, subsequently layered with stylesheets and scripts that provide a gradually enhanced experience across a wide variety of browsers and devices.

This approach has profound advantages over other browser support approaches such as graceful degradation. Graded Browser Support recognizes that advanced technology support is not a guarantee of the future, and that legacy software as well as alternative devices (mobile) must always be considered. Graded Browser Support defines support in terms of current capabilities, not in terms of legacy or obsolete software; it embraces accessibility, universality, and peaceful coexistence with more feature-rich browsers/devices; and it allows for adoption of new technology and strategies without leaving any browser/device behind.

Credits

This work is heavily influenced and contains directly passages from Debra Chamra's "Progressive Enhancement: Paving the Way for Future Web Design", Steven Champeon and Nick Finck's presentation "Inclusive Web Design For the Future with Progressive Enhancement", and Steven Champeon's "Progressive Enhancement and the Future of Web Design", all of which may be found here.

Thanks also to the great people who have endlessly debated and developed these topics with me: James Berry, Sean Imler, Todd Kloots, Jon Koshi, Mike Lee, Thomas Sha, Matt Sweeney, Chanel Wheeler, and Christina Wodtke; and everybody else; and to everybody who puts their ideas online so that others may be inspired. Thanks.

Beautiful API

This page is beautiful: http://www.flickr.com/services/api/. Every service-based web site should have a page like this.

This is a great way to understand and communicate your functionality. If you can't describe your site in these terms, well, start trying because you should be able to. (You don't have to make it public.)

I'm not here to talk about the benefits of web services and open APIs -- but at least internally, if you can think about your offerings in these clean and explicit terms you'll be much more successful.

We've moved beyond the "If you build it, they will come" days. We're now in the "If you offer it, they will build it" days. This cool map-based Flickr interface was built because the API existed.

More Bits, More Browsers

Keeping up with the 64-bit server, Microsoft has released (last month) a 64-bit version of IE6 for Windows Server 2003 SP1/x64. The server will ship with both the 64-bit and the 32-bit versions, with the 32-bit connected to most of the UI entry points.

We found that in our own every day use of the 64-bit client, the 64-bit browser was difficult to use because web sites hadn’t authored common controls for 64-bit clients.

No word yet on any rendering implications.

Blog Torrents, P2P and the Development of De-centralized Media

Broadband Daily posts an interview with Nicholas Reville of Downhill Battle, which just recently released Blog Torrent, a very exciting new initiative:

Blog Torrent is a key first step of our plan to make software that builds participatory culture. Video (specifically television) is a huge part of culture. But it's still an extremely top-down medium-- even as the tools to make high quality video and animation have become extremely cheap, very few people watch any significant amount of video other than what's on networks and cable. We think homemade video can compete directly against professional television, especially as reality shows have brought down viewers expectations about the production values needed to make engaging TV.

More from the BlogTorrent site:

What is Blog Torrent?: Blog Torrent is software that makes it much easier to share and download files using the bittorrent protocol. Blog Torrent is easy to install on your website: we don't use MySQL so installation is as easy as uploading a folder to your web host, and all administration happens in the web interface. Blog Torrent is easy for users: even if they don't know what bittorrent is, they get an installer that downloads the file they want. But most of all, Blog Torrent makes publishing with bittorrent painless. Just click "upload", pick a file, and you're done. This is our preview release and it has a lot of bugs and rough edges... but we're smoothing them out for the next version, so stay tuned.

Why does Blog Torrent matter?: Making it easy to blog large video files means that people can share their home movies the same way they share their photos or writings. It lets people create vast networks of truly peer-to-peer video content-- video that was made by individuals and shared with individuals, no bandwidth budget or distribution deal needed.

We'll definitely be seeing more torrent news lately, and this convergence with the blogging world / blogging technology can only help.

Word of the day: Syntax Candy

Yesterday at one of our company Tech Talks, a prominent engineer giving the talk used the term "syntax candy".

Syntax Candy

Computer code or markup (syntax) that is "very nice and sweet"

...that makes data easier to digest or manipulate

...additions that make things run smoother

PHP Cheat Sheet

In PHP, do you ever wonder which values can be empty while not being null? Wondering if 1.3 = 1.30 == 1.3 === 1.30? Well, wonder no more, thanks to http://blueshoes.org/.

While you're there, notice how the table is progressively enhanced with both Presentation and Behavior layer additions.

Thanks to chanel for the tip.

The Behavior Layer - Unobtrusively

I've been working on a framework called Layered Semantic Markup for I guess a few years now. While I spend most of my time considering the Structural Layer (Content, aka HTML) and the Presentation Layer (CSS), there is a third layer: Behavior Layer (scripts and the DOM). Having stable and appropriate Content and Presentation layers are helpful before one can appropriately address the Beharior Layer, which is why I've spent my time as I have.

A foundational idea of Layered Semantic Markup is Accessibility (and not just in the Section 508 of Accessibility for indivisuals with disabilities). Content should be accessible to ALL. Content should be available without Presentation. Presentation should be available without Behavior. In other words, each can only reach their potential (and some would argue bare minimum) if they are isolated and independent.

I don't want my snazzy Javascript DHTML behaviors (which makes my navigation more efficient to desktop computer users) to make my navigation unusable to cell phone browsers. With a nod to "One man's treasure is another man's trash", what's good for one user may be detrimental to another.

With this in mind, take a look at this great tutorial on how to write an Unobstrsive Behavior Layer, or as the author brands it, "Unobtrusive Javascript .

Javascript is a wonderful tool to enhance the usability of web sites. It is the extra layer above the mark-up 'what is this text' and the CSS 'how should it be displayed'. Javascript adds a new dimension, the 'how should this element behave'.

On the following pages we will discuss and see how we can use Javascript, but still maintain accessibility. The technique to completely separate Javascript from the other two layers of web development has become commonly named 'unobtrusive Javascript', as 'accessible Javascript' does not quite cut it. You can have a perfectly separated Javascript and still be totally inaccessible.

Hat tip to little. yellow. different's mini-blog.

Layered Semantic Markup hits the big-time at Yahoo!

I'll post some more details when I get a second, but I wanted to quickly point out that the new launches of http://www.yahoo.com/beta and my.yahoo.com are among the most visible examples of Layered Semantic Markup on the Yahoo! Network.

Isn't the markup beautiful! Isn't the CSS wonderful?

Congrats, one and all!

Wanted: Web Developer

I'm trying to help out a friend. If this job looks interesting, send me an email and I can get your more information:

...looking for is a HTML developer that has experience with CMS tools (blue martini is preferable), can perform basic troubleshooting on their own code and understands java. ...needed for at least a one-year contract. Can work on-site (northern California) or remotely (if they are delivering quality work) for 40 hours a week. Rate is above average.