Practical Internet Code- Writing Friendly Code | WebReference

Practical Internet Code- Writing Friendly Code

home / web / dev / friendly

Practical Internet Code

Writing Friendly Code

by Kenneth Tibbetts (areoka@areoka.com)

Overview

I used to rely on the idea that the code I was writing was temporary. I wrote a ton of code, and told myself that some day I'd go back and replace it all with really good code, clean code, elegant code. Just as soon as DOM 2 is the law of the land, or DOM 3 or 4 or XML, or something from a benevolent alien race... Then I could quit putting out fires and write some code that will last.

Today, a lot of that code is still out there, sniffing at browsers, bouncing users around like pinballs, doing something awesome in platform A and nothing at all for anyone else. I've had it. Call it my Millennium Resolution, I'm gonna quit writing crappy code. I don't like writing it, I don't like seeing it on the Web, and most of all I don't like going back and tinkering, endlessly, with code that was too darn specific to start with. The pages I write should be able to stand up under any user - any browser, WebTV, cellphone or toaster. Internet code ought to do its job quietly, without busting anybody's client. And if somebody can't run the script or see the styles, the code should be invisible. 

I'll illustrate this by walking us through the construction of an interactive Web page that is written to be "friendly." This particular application is being used as a monthly newsletter. The interactive functions are intended to benefit the editors and authors as well the users/readers. A simple HTML template gives all of them easy access to the positioning and navigation as well interactive controls that are the trademark feel of the site. The content will automatically be presented in a manner that is appropriate to the user's platform and browser, and as stated before, the page will degrade gracefully for non-mainstream browsers. You can see a working example of this interactive page at: http://www.yankeeweb.com/practical/ywEd/ywreader.htm.

It uses a script and a stylesheet to draw its content and controls to the screen. It's designed to conform to the W3C recommendations. And if the client is not a version 4+ browser, or a computer, it still reads easy - the HTML can stand alone. First I'll go through the script that makes the page do its thing, the bells and whistles. Then a close look at the stylesheet that takes care of the formatting. And finally, a Web page that links them.  

This is just backwards of the way I ordinarily present Internet Code. This is because of the actual priorities here:

The content really can stand alone. The presentation is what makes the Web site convenient or interactive or fun, but content is what people are here for, whether it's business to business, a merchant catalog site, or a pure Web e-zine. 

We'll start with the JavaScript code. It sets up the page elements and events conditional to the document itself and the client platform. But it is no big deal if nothing gets set up at all. The script reads the document and divides a long page into chunks, layering them all in screen-sized "above the fold" units. There are navigation buttons and page tabs, and an options bar you can toggle on and off. In this model, everything is absolute positioned by the stylesheet assignments.

The technologies involved are pretty basic - event handlers toggle the visibility property of a selected "page", or read and write values to other elements or controls.  Most of these processes branch to an "NS" or "IE" condition.  

About theJavascript 

Contents:



Comments are welcome

 


Created: Dec. 2, 1999
Revised: Dec. 7, 1999

URL: http://webreference.com/dev/friendly/