Ricci Street < Gizmos, Inc. < Showroom || search | sitemap | help gazette | theater | bistro

|

Documents other pages concept maps this page static vs active | document analysis structure | presentation | meaning information display

Page Is a Misleading Metaphor

Reaching the end of a metaphor's usefulness is a good place to begin learning. A Web page. Microsoft FrontPage. I know what a page is. It's made out of paper, it has a front and a back, and it is often glued or stapled to other pages. It may well have a number in one corner. It has ink on it.

Above all, a page stays put. Let's say that the words on a paper page are red one day. The next day, I take a look at the same paper page and the words are blue instead of red. I suspect magic or miracle because ink is ink. Its constancy is the norm. In fact, its constancy is a law of nature.

If the words on a Web page are red one day and blue the next, I think oh, that's interesting. If they're sitting still one day and moving the next, I think oh, I should make my pages behave like that, too. Its inconstancy is the norm.

This must drive librarians crazy. For me, getting used to this inconstancy is a joy and a delight. What drives me crazy is learning to make a web page behave in useful ways.

FrontPage was a good transition. For many-hundred-page webs like Ricci Street, I quickly caught onto templates. My toboggan tipped over the edge when I started duplicating chunks of Perl and Javascript and moving them around.

Racing down the snowy hill in the fall of 1998, I broke "pages" into many parts: objects, functions, attributes, events, styles, behaviors. What used to be a page of html code is now a set of instructions to the user's browser about:

what objects to include
where to find them
how to make them look and behave on their own, in response to each other, or in response to the user

To make that work, I had to learn how to re-configure the server. AIT, the company in North Carolina that maintains the Ricci Street hardware, also supports the Apache server software, the world's most common. It is free and open source and has a terrific community of developers willing to help newbies like me.

Now I can start to make a page useful. Meanwhile, we're stuck with the page metaphor. Its big limitation is bringing a set of expectations that aren't met online. In short, printed documents are static compared to the active documents on the Web.

Static vs Active

Ink-on-paper is a very mature technology. However, its limitations make it increasingly useless, especially in large quantities for routine information.

You can't change/correct/update it.
You can't search it.
You can't add pretty pictures.
You can't move it quickly. Especially in large quantities, it's too heavy.
You can't link it to anything except with a staple or thread or glue.
Unless you're using acid-free paper, it's not very permanent -- barely your lifetime.
It's expensive and time-consuming to duplicate.
Using it destroys trees.
It takes up enormous amounts of space.
You can't read it in a dark room.
It's static; it just sits there.
It's stupid. It doesn't behave or change. It doesn't know how old it is. It doesn't know where it's been. It doesn't know what other information it's related to.

Bold prediction | Ink-on-paper books will survive just as live theater survived movies and movies survived TV. Ink-on-paper documents for routine communication in and between organizations will not survive.

The Second Coming — A Manifesto
by David Gelernter
Edge 70, June 15, 2000

Lifestreams don't yield the "paperless office." (The "paperless office" is a bad idea because paper is one of the most useful and valuable media ever invented.) But lifestreams can turn office paper into a temporary medium — for use, not storage. "On paper" is a good place for information you want to use; a bad place for information you want to store. In the stream-based office, for each newly-created or -received paper document: scan it into the stream and throw it away. When you need a paper document: find it in the stream; print it out; use it; if you wrote on the paper while using it, scan it back in; throw it out.

A Provocation...
by Scott LePera
A List Apart, September 29, 1999

I see the birth of the web as an analogy to the invention of paper. Paper was a lightweight, portable, less-labor-intensive alternative to stone or clay tablets. As first it was used only for writing. Then one day, someone said, "Hey, I can paint on this stuff," and did so.

Later, someone else noticed that if you stacked layers of paper together they could be formed into boxes and bags. Someone else used thin decorated paper to wrap those boxes. Another person used highly porous paper to filter the coffee grounds out of his morning java. And someone else figured out that if you took a sheet of paper and folded it this way and that, the darn thing would fly like an airplane!

Saying that the Web is only good for exchanging practical, useful information is like saying that paper is only good for writing. It just ain't so.

The web, like paper, is both medium and material.

On the other hand ...

Advantages of electronic forms
by Deborah Taylor-Pearce
Infodesign-cafe mailing list, November 8, 2000
infodesign-cafe@list.design-inst.nl

Try doing electronic entry at a construction site, with dirt and dust and who knows what all else flying about everywhere ... and no safe place to store expensive portables, of any kind/size.

Even paper forms and drawings are imperiled in the field, but you can:

shove them in your pocket
sit on them
run over them with a Cat
spread them out under your wheelbarrow
tape them to a wall
scrawl all over their back side
lay them in a ditch and mark on them with one hand while measuring to face-of-wall with the other
have people who have never turned on a computer in their lives -- and may well speak multiple languages -- instantly work with them and mark them up
easily use them to collaborate and record dialogue with others
read them from every angle imaginable while out in the blistering mid-day sun

Forms printed on drafting vellum with waterproof inks are impervious even to rain and acidic cement splatter.

I have yet to find an electronic device that is quite this versatile.

Document Analysis

Compared to a static document, an active document is flexible in content, structure, presentation, and meaning.

content: text and images

What you put into a web is not the central concern here. You'll find more in CyberSea Inn's sections on problem solving and critial thinking, which aren't very well developed as of October 2000.

These general attributes give you two extremes between which you can place any web page. Together, they give you a framework for thinking about your own web pages.

structure

document tree

The diagram on the left shows the basic HTML tags and how they relate to each other. Think of the pair of HTML tags as a container. They contain the pair of HEAD tags and the pair of BODY tags. Both pairs are themselves containers for other tag pairs. For example, the TITLE tag pair is contained within the HEAD tags. The heading (H) and paragraph (P) tags are contained within the BODY tags.

Let's try a tree analogy. The HTML container is like the root and the HEAD and BODY are the two (and only two) branches.

Now let's focus on just the BODY branch. Compare the tree diagram on the right to a traditional outline (tag).

objects and relationships

Think of everything as an object: every chunk of code, every tag pair, every word, every image, every web page itself. Most objects can be linked and embedded and nested.

Let's move now from the tree analogy to a family analogy. Just as the branch is the "parent" of the twig, so an object would be in a parent / child relationship with the object it is linked, embedded, and nested in. It then has a sibling relationship with other objects linked, embedded, and nested in the same object. It can inherit properties from its parent and share them with its siblings.

An object can also be named, which means it can be scripted. For example,

http://ClearLightStudio.com/clsmove.htm

has moving parts (Microsoft's browser only; not Netscape's). The scripting comes in as series of events. If you hover your cursor over one of the moving parts, that's an event. Some red text appears, another event.

document object model

You can also think of the objects as actors and props that can get scripted. The collection of rules that describes these objects, how they are represented, and how they relate to each other is called the document object model (DOM).

The DOM defines each object on a Web page (images, text, scripts, links, etc.) and also defines what attributes are associated with these objects and how they can be manipulated.

To learn more, you can turn to the official specs from the W3C, but as usual, they're written in less than clear English. Webmonkey has a clear, concise explanation.

Learn more about the DOM.

presentation: style sheets

the style sheet for Ricci Street's Gizmos, Inc., separating structure from presentation

to find the style sheets on your desktop PC, go to Start | Find | Files and enter *.css

to learn more about CSS (Cascading Style Sheets) try Web Developer.com's Guide to Cascading Style Sheets

meaning: XML

Perhaps intent is a more accurate wording.

Jay Greenspan's Introduction to XML in the Webmonkey section on authoring XML.

Information Week's XML Toolbox: news, opinion, research, reviews, and some terrific tutorials.

IBM evangelist predicts XML will speed e-business
by Martin LaMonica
InfoWorld, November 1999

Web Developer's All About XML and How to Use It

The WDVL's (Web Developer's Virtual Library) collection of XML resources and an introductory article, Tim Berners-Lee: Challenges of the Second Decade

Bob Metcalfe's quick intro to the semantic Web of Tim Berners-Lee

The Semantic Web by Tim Berners-Lee

an engine of the future combines a reasoning engine with a search engine

Information Display

Sure, we understand displaying words and images and even combining them in concept maps. But what about information that is apprehended by senses other than our eyes? Odors, for example.

Made To Odor
by Jeffrey Davis
Business 2.0, December 1999

By broadcasting scents to Websites, games, and ads, DigiScents hopes that businesses will experience the sweet smell of success.

databases

example | server logs

What does one look like?
What can you learn from it?

Ricci Street's September 2000 visitors (800K, so it will take awhile)