VisiBone HTML Card

HTML Card and HTML Chart

This page has moved to: http://www.visibone.com/html/

11 Sep 2000 — Printed!!

8 Sep 2000 — Prepress is done! Color proofs look very crisp. (And they have real apostrophe's.) Press run scheduled Monday the 11th. If all goes well, I'll open up for orders. The HTML Chart will ship right away. After die cutting and lamination, I expect we'll be shipping the HTML Card around the 20th. Be glad to send you a note when you can place an advance order, and when both products are shipping.

The HTML Card is 4 pages 8½ × 11 inches laminated. Imagine an 11x17 sheet folded once. US$10.

What are your thoughts on binder holes? I've left room for both US 3-hole and European A4 2-hole and 4-hole binding, but plan to ship you the cards without holes. Would you prefer to buy already drilled like the Color Card? Consensus so far: undrilled.

Please use the following sneak previews in your work. Feedback welcome by form or email.

Online detail companion to the card: www.visibone.com/html

technical · ordering · legal · credits

Some sneak preview feedback:

“my god! incredibly awesome! where was this when I was starting out?” –McGlynn

“...a frighteningly new dimension to the meaning of the word 'detailed'” –Tari Akpodiete, Web Evangelist, www.BuildingTheWeb.com.

“I learned several new things about CSS that I needed to know in the first few seconds!” –Nick S.

“It's BEAUTIFUL!” –Darlene S.

“I'm really impressed by the quality of your work. Really! You are creating tools that make life easier for a lot of people.” –Phil S.

“Thank you for helping me with a problem I'd been researching for days ... Within a minute of studying your card, I found a solution.” –Teresa D.

The HTML Chart is 18 x 24 inches with a protective satin coating. US$15. This is the Elements and Attributes section of the HTML Card blown up a little more than twice as big.

A unique feature of the HTML Chart is: it will have spare on the back! The way we're printing the card and chart together, called work-and-turn, it was actually cheaper to print both sides. The images will be upside-down from one another.

See the Online Character Reference, a companion to the card (see how all 65,535 Unicode characters look on your screen).

The HTML Card and Chart are ongoing works and I could use your help: Whenever you look up something HTML-wise or CSS-wise, would you drop me a note? Please let me know what you were after whether you find it or not. I want to make something that will answer most of your HTML questions in a fraction of the time. HTML is a moving target to be sure, and with each release of these products I hope to put it in your sights a little clearer.

I dream of making a tool significantly more useful to you than any HTML book or reference you now own or can get your hands on. Civilization's handiest HTML reference. The HTML Card should contain most of what you won't memorize about HTML that you'll use more than once in your life. It won't solve anywhere near all HTML mysteries. It will give the working HTMLsmith quicker recall of the facts and deeper insight into the possibilities. Here are some of the features:

4-pages, laminated, 8½ by 11 inches.
All elements and attributes that are in use or universally supported, all on one page. Icons and annotations will show:
- browser support and standards approval
- popularity
- redundancies (CODE, KBD, SAMP, TT) and what prevails (TT)
- family: table, frame, form, list, international, usability, programmability, style, graphics, image maps, etc.
- nestability, BIG, SMALL, OL, UL, (SUB and SUP on Netscape only)
- inline versus block layout
- explanations (e.g. VLINK for visited link color, BLOCKQUOTE for indentation, USEMAP for client-side image maps)
- attribute values (e.g. pseudo-targets: _top=whole page, _blank=new window)
One big annotated example including many of the more popular features and tricks. (Especially that pesky IMG ALIGN. By the way, 95% of the images on the web use top, left, right, absmiddle, middle or center alignment. And that's other than the default, bottom. Fewer than 5% use any of absbottom, abscenter, baseline or texttop.)
All special characters. Do you like the em dash? — Funny how none of the standard codes are universally supported (— or —) and the universal code is not in any standard or reference that I can find ().
And ... what do you want?
Originally intended to include all style sheet properties in use or universal. But they're very quirky. Not only is it hard to figure out how to get the effect you want, not only does implementation tend to be incomplete (some tags can be styled, others can't), but all of this varies wildly between browsers. Clearly the standards are unclear. (See all the great work Eric Meyer has done regarding CSS compatibility.) Style sheet properties may have to go in a separate reference.
Originally intended to include all 2-letter country codes, language codes and character encodings. But ISO is imposing punishing terms, so I may do this online for free. More below under News for 2 May 2000.
Since the Color Card is now available I no longer plan on including a color reference in the HTML Card. This frees up room and provides a presentable color reference for designers to show. (Thanks to alert customer Danny Anderson for pointing out how he'd like a clean attractive collection of color samples to include in his portfolio notebook when he visits prospects.)

I believe that once you learn something there are relatively few facts you need to look up over and over again. I want to put them all in one place in a way you won't want to websmith without it being within arm's reach.

With a nod toward vivid counterexamples (not to mention www.barcharts.com aka www.quick-study.com by name) the HTML Card will not be a verbiage-dominated, hand-holding, CliffsNotes^™ of an HTML reference. This will assume you're beyond HTML 101 and you're websmithing with purpose, and not just to collect acronyms for your resume. The HTML Card will try to show you HTML as it's really used by living breathing web designers on real web sites around the world.

I expect to catch some flak. While writing this card I came upon the heretical idea that a key tenet of HTML (one I've preached myself for years) of emphasizing structure and meaning over presentation and rendering is not only doomed but long-dead. The HTML Card will emphasize how features appear because that's what I think is most useful for designers. Your opinions are welcomed below.

Price: $10. This is way more than the $3.95 charged by the competition. I promise it will be significantly more useful than anything like it. Correct me if I'm wrong but this won't be hard. I buy every HTML quick ref I find to make sure, and may I just say that I'm very encouraged. If you use an HTML quick reference card out of a book I'd very much like to know what you refer to most in it.

I'm finding most HTML resources simply reiterate the standards. I plan to augment this with browser support (official and empirical), actual usage in live HTML and my own experience with web sites. I hope I'm not becoming an easy target for big corporate lawyers — I'm closely scrutinizing the online browser documentation thoughtfully provided by Microsoft and Netscape. I'm encouraged by the concept that you can't copyright facts, which is very well aligned with what I'm doing, in the sense of thoroughly recasting presentation and language. Guidance is welcome.

Other News

Thanks for all the help and support so far. I will read it all!

26 July 2000 — Estimating 21 August availability...

2 June 2000 — I've taken on some software consulting and had to delay work on the HTML Card. I'm now shooting for 10 July availability. Very sorry for the delays.

15 May 2000 — Here are my working notes for the main tag / attribute / value reference. These are facts I've pieced together from scouring primary online sources for HTML 4, Internet Explorer version 3-5 and Netscape Navigator version 3-5, plus a few other sites, many experiments and statistical sampling of live HTML.

2 May 2000 — The ISO folks have replied to my request to include a list of country codes in the HTML Card and are asking for US$1000 per year for the privilege. I wish I could give them that much, god bless 'em. For one thing, it would require an artificially truncated sunset for the product, something I wish to avoid. Now I don't like to negotiate. I'm not very good at it. Besides, paying full price gives my demanding nature extra room to express itself. But I countered with 4-cents a copy payable at time of printing ($200 on first printing of 5000). In lieu of that, I now plan to remove the country list from the HTML Card. I may make one online for free, which I understand incurs no fees. A sample:

	ht	Haiti
	hk	Hong Kong
	hm	Heard and McDonald Islands
	va	Holy See (Vatican City State)
	hn	Honduras
	hk	Hong Kong
	hr	Hrvatska (Croatia)
	ht	Haiti
	hu	Hungary

Notice how the bold entries in the left column are in alphabetical order so you can look up by code? And the bold entries on the right allow you to look up by name? There's some duplication (ht-Haiti and hk-Hong Kong). I call this a "splist" (or split list), a single list that's sorted two ways at once.

Dec 1999 — Here's some of the raw data I collected from live sites: A tally of HTML tags, attributes and some values.