Alison Fish: Html 1-A

Tricks of the Print Trade

Wed, 09 Oct 2002 07:36:24 GMT

I always enjoy Joel on Software. One of the reasons I enjoy it has nothing to do with content - I love the layout. It requires very little eye strain. The serif fonts allow the eye to recognize shapes of familiar words. More importantly, the article text forms a column that is narrow. The narrow column of text surrounded by blocks of whitespace keep the eye from being overwhelmed, and the reader is able to stay focused.

Since Nick Fink was recently quoted in CityDesk News, we learn that Joel's format is a trade secret of the Print profession:

Nick Finck: “There is an unspoken rule in print which states that text should not exceed four inches in width on a page. Any text less than four inches is more readable than any text over four inches — the reader's whiplash will speak for itself.”

[CityDesk News]

How to do it: (well, one way to do it, there are many):

<div style="width: 4in;">There is an unspoken rule in print which states that text should not exceed four inches in width on a page. Any text less than four inches is more readable than any text over four inches — the reader's whiplash will speak for itself.</div>

How to include apostrophes

Sun, 29 Sep 2002 23:04:10 GMT

(In response to this Radio discussion thread)

The numeric code for an apostrophe is 39 (according to the W3C HTML Coded Character Set page). Edit your post in "Source" mode, where you can see the HTML tags. Position your cursor where you would like the apostrophe to appear. Type the following five characters:

An ampersand &
A pound sign #
The number three 3
The number nine 9
A semicolon ;

Josef Tornick's Weblog is a breakthrough in quality and cleverness.

Thanks to Jeff's Radio Weblog for showing me how to distribute code snippets without the recipient unintentionally picking up invisible characters which render the code inoperable.

Josef Tornick's weblog can be found at http://radio.weblogs.com/0111492/.

Mon, 23 Sep 2002 06:01:30 GMT

How to draw a box:

.roll {
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
border: 1px solid silver;
padding: 4px;
width: 160px;
}

Correction to post on Anchors [HTML 1A].

Sun, 22 Sep 2002 00:28:18 GMT

The sample code given in the original post HTML 1-A Lesson: Anchors was incorrect.

The pound signs # should be used in the links to the anchors instead of the anchors themselves:

Before, Incorrect:

Link to the anchor: <A href=enablingCategories>How do we enable categories?<A>

The Anchor: <A name=#enablingCategories>How do we enable Categories?<A>

After, Correct:

Link to the anchor:
~~<A href=enablingCategories>How do we enable categories?<A>~~

<A href="#enablingCategories">How do we enable categories?<A>

The Anchor:
~~<A name=#enablingCategories>How do we enable Categories?<A>~~

<A name="enablingCategories">How do we enable Categories?<A>

Before, Incorrect:
Link to the anchor:	`<A href=enablingCategories>How do we enable categories?<A>`
The Anchor:	`<A name=#enablingCategories>How do we enable Categories?<A>`

After, Correct:
Link to the anchor:	~~`<A href=enablingCategories>How do we enable categories?<A>`~~ `<A href="#enablingCategories">How do we enable categories?<A>`
The Anchor:	~~`<A name=#enablingCategories>How do we enable Categories?<A>`~~ `<A name="enablingCategories">How do we enable Categories?<A>`

HTML 1-A Lesson: Anchors

Sat, 21 Sep 2002 07:50:32 GMT

Al Macintyre has been adding so many great sources to his article Understanding Radio Categories, the page has grown into nine (yes, I counted) screen lengths of information. One of his eRadio ideas is to accomodate the multitude of information by updating the presentation:

"It would be really nice if each of the summary questions up top was a link to the detail answer down below." "Down the road I hope to learn Radio Outlining..."

I can't help out with the outlining, but I do know how to make anchors. Imagine a hyperlink that does not jump to another webpage, but jumps to another heading on the same webpage. Here is the code:

<A href="#enablingCategories">How do we enable Categories?<A>
<A href="#categoryGotchas">What are some gotchas, to avoid, that can get us into trouble?<A>
<A href="#postingToCategories">How do we post stuff to Categories?<A>

<A name=enablingCategories>How do we enable Categories?<A>
Aug 3 I talked about this.
Russ Lipton has several documents of relevance.

<A name=categoryGotchas>What are some gotchas, to avoid, that can get us into trouble?<A>
Russ Lipton has several documents of relevance. Check out...

Here is how it will look:

How do we enable Categories?

What are some gotchas, to avoid, that can get us into trouble?

How do we post stuff to Categories?

How do we enable Categories?

Aug 3 I talked about this.

Russ Lipton has several documents of relevance.

What are some gotchas, to avoid, that can get us into trouble?

Russ Lipton has several documents of relevance. Check out...

Ok, Al - when you learn of Outlining, will you explain it to the rest of us? :)