VisiBone HTML and CSS Card

HTML / CSS Card
4 pages, in two pieces, covering
XHTML 1.1, HTML 4.01, CSS2,
and seven browsers.

PAGE 1: EXAMPLE HTML AND CSS

PAGE 2: HTML TAGS

PAGE 3: CSS STYLES

PAGE 4: HTML CHARACTERS,
SSI, URL's, XHTML CHECKLIST

Updated to the latest
browsers and standards
New non-glare lamination
All HTML Tags and CSS
Attributes in one glance
See also the HTML Foldouts,
another complete HTML
reference with larger print.
Example HTML and CSS
with bubble help tutorials
- Tables, forms, client-side
  image maps, lists, meta
  tags, XHTML formalities
- Five style schemes: link,
  id, class, span/div, and
  the style attribute
- Layout techniques,
  space engineering
- Hover-hinting (tool tips),
  click-zones (label)
- HTML vs. CSS methods
- Nesting structure shaded
- Browser view, with links
  to code
HTML Elements (Tags)
<form> <table> <img> ...
- Attributes and values
- Practical usage
- Table parts and colors
  diagram
- Image alignment diagram,
  flow-around, and font-like
- W3C-deprecated features
  are identified, along with
  specific CSS alternatives
CSS Properties
(Cascading Style Sheets)
{font} {color} {padding}...
- @-rules, pseudo-
  classes and elements
- HTML alternatives
Color-coded support theme
throughout the HTML Card:
- Netscape 4–7
- Internet Explorer 4–6
- W3.org standards, HTML
  4.01, XHTML 1.1, CSS2
- Background color
  indicates lone support by
  one when the others don't
  
  Netscape only
  IE only
  W3.org only
- Border color indicates
  lone nonsupport — one
  doesn't, both others do
  
  Not Netscape
  
  Not IE
  
  Not W3.org
  
  Think of the unsupporter
  as the ostracized
  outsider. Get it,
  border = outsider?
Bugs and browser-clashes
identified with icons — and
detailed elaboration online
for each one
Functional icons
Functional index — all html
tags and css properties
organized by function
SSI examples & tips <--#if ...
URLs (http,ftp,mailto,file,clsid)
HTML-to-XHTML checklist
Crisp phone-book font,
6-point Bell Centennial,
designed for dense printing
You can punch for 2,3,4-hole
binding (4.25" or 80mm)
Two pieces, each, 8.5" x 11"

COMING
BACK
SOON

Feedback on the HTML Card and Chart:

“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.

“I received the cards a little bit ago and WOW! What excellent resources! You've condensed quite a bit of information into a compact area.” —Janet V.

“I haven't gotten my cards yet (I just ordered them), but from what I have seen on your site, I don't know how I have been living with out them. It is nice to see someone out there, trying to actually make completely useful reference material.” —Derek A.

“For those of us who love our craft and usually wind up living hand to mouth / job to job, these tools you offer us for such a small price are really an absolute gift.” —Nancy M.

“...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.

“These should also go a long way to reducing the number of books I have open at once, just asking for coffee to be spilt on.” —Andy Warwick.