Download HHH_Spec_v1.1b_with_DTD.zip


Table of Contents

Hand-Held HTML
Character Sets
Pictures
Headings
Page Breaks
Paragraphs
Emphasis
Blockquotes
& Entities
Links
Lists
Problem Areas
Final Thoughts


Hand-Held HTML

"HHH"

The purpose of the Hand-Held HTML specification is to facilitate the making of e-books that will look good across a variety of PDAs and dedicated bookreaders. To this end, much experimentation had to be done to find exactly which HTML tags the various platforms have in common. An identical look was not pursued so much as what works well in all settings we were able to test.

Many features of your favorite book-reader might not be included in this specification in favor of what will work for all platforms. If you want to use features that are not included here please don't distribute it under the "HHH" name.

The goal is for the people creating e-books to provide a single HHH HTML file, possibly with one or more jpegs. It should then be possible for others to take this HTML e-book and convert it easily to their favorite hand-held platform, pictures and all, without modification of the HTML file.



Hardware and Software Tested

It should also be noted that MobiPocket Publisher Personal Edition was used for the creation of both MobiPocket .prc files and MSReader .lit files. iSiloX was used to create .pdb files for the iSilo, RocketWriter from NuvoMedia was used for the REB, and uBook requires no conversion of HTML files. The rule was to use free conversion utilities.



Character Sets

All the systems tested are compatible with the windows-1252 character set. The meta tag that will dictate what character set to use on desktop computers using one of the major browsers has no effect within any of the hand-held environments tested. Still, you should use this meta element with "charset" for two very important reasons:

Firstly, creating an e-book on the desktop and using this meta tag from the very beginning of the book creation process will ensure that the e-book will be readable on hand-held devices. Any characters that render incorrectly will be readily apparent in a browser window and you can then correct the situation right away.

Secondly, using the meta element will ensure that your e-book will be readable not only on hand-held devices, but also on PCs, the Macintosh, Linux, etc. But you can only be sure if this meta tag is included.

The following is the meta tag exactly as it should be in your e-book. It should be in the "head" section immediately after the "title" section. Here is the template of your Hand-Held HTML document with only one paragraph in the body (the body is where the actual book will be placed.) Let's say the title of the book is "Moby Dick."

<html>
<head>
<title>Moby Dick v1.0</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
</head>

<body>
<p>
Call me Ishmael . . .
</p>
</body>
</html>

And that's all there is to it!



Pictures

You might want to start your book with a cover image; indeed, you might want to include many images. The largest screen we looked at was 320 pixels wide and 480 pixels tall. You should make your image no larger than either of these dimensions. The book converter programs all appear to downscale the images appropriately for their readers.

Another consideration is color vs black and white. You might make your image 480 pixels tall in vivid color, but consider that some people might be viewing your book and its images on a black and white screen that is 160 x 160 pixels. "Grainy" hardly begins to describe what will happen in this instance. In general, black and white line drawings work better than photographs.

Assuming that the name of your picture is "BlueSky.jpeg", here is the correct way to make your tag:

<center><img src="BlueSky.jpeg"></center>

Limitations

We have only tested JPEG images for this specification and we do not know if other image formats will work across all the platforms. To play it safe you should only use JPEG files. Size your images so they fit within a 320w x 480h rectangle (or smaller). You must use the four character ".jpeg" extension on all image files or they will not work on certain platforms. Lastly, do not dictate the size dimensions in your image tag as this might conflict with the capabilities of some systems or defeat proper resizing of images.



Headings

Many of the heading tags are used in non-standard ways on some platforms. Because of this only three heading tags are included in the HHH specification:

Do not add extra vertical space before or after any of the tags mentioned in this document. This is the job of the reader program to render properly and some add plenty of space while others add little or none. Let the user of a particular program either modify the HTML file for their personal taste or even to select another program if they find the one they are currently using to be inadequate.

When centering a heading or other text, use the centering tags around each individual line, never centering several items as a block as this will not work in all programs.

Example:

<center><h2>Part 2</h2></center>
<center><h3>Chapter 7</h3></center>

Page Breaks

One of two methods will work to trigger a page break depending on which reader program a person is using. Applying both of these triggers together will cause a page break on every program tested that uses pages. The following two lines should be used together:

<hr>
<br style="page-break-before:always">

An excellent place to use a page break is immediately before a new chapter. Other places might include anywhere you want to guarantee that the following few lines will appear together rather than the possibility that they be split across pages. Keep in mind that this method will draw a horizontal line across the screen in some programs whether it uses pages or smoothly scrolls through the document.

There is a danger that the page break triggers will insert a blank page if they happen to occur at a point where the text of the previous page goes all the way to the bottom of the screen. This is a small price to pay for the overall professional quality that is gained by well-placed page breaks.



Paragraphs

Throughout most of an e-book the user is looking at nothing more than page after page of paragraphs. As such, their style is of critical importance. Consider what some programs offer to control the look and feel of paragraphs:

The indentation can be set as a number of pixels. Paragraphs can be set to full, left or even right justification. A blank line can optionally be placed between each paragraph. Fonts, font sizes, font colors and background colors can all be user-specified. All these things and more can be controlled directly by some e-book reading software, overriding what is in the HTML file.

The point is, individual users select a particular reading program because they like the way it renders the text and possibly because of the options it offers to modify presentation. If you add formatting parameters then you are likely fighting against the way others wish to view your file.

In spite of the above, it has been found that a very short line right justified can be used effectively in all programs tested. In all other cases use plain paragraph tags. The following will right justify a short bit of text:

<p align="right">

</p>

Similarly, one could center a bit of text by setting the align parameter equal to center:

<p align="center">

</p>

You might want to examine the beginning of the source file of this document. In order to keep the links from being spread out too much vertically paragraphs were not used. Some programs leave a blank line between each paragraph.

As a final note, it will not work to create a blank line with a non-breaking space between <p> tags. <br> must be used instead, and please use it sparingly if at all because different programs add space in certain areas and others don't. Let the user choose a program that renders the output the way he or she likes it.



Emphasis

There are four emphasis tags in the HHH specification: bold, italic, underline, and strike. These are created with the following tags:

NOTE: <em> . . . </em> can be used interchangeably with the italic tag.

Blockquotes

The following sequence of tags and text is the closest we could come to a workable solution for using blockquotes:

<blockquote>
<br>
Some display text goes here.
<br><br>
And more paragraphs would be separated the same way.
<br><br>
To create a poem,<br>
Of your very own,<br>
Use single line breaks.
<br><br>
And then finally this last little bit.
<br>
</blockquote>

So, a blockquote should start and end with a <br>. Paragraph tags must not be used because they will override the blockquote in some reader programs. Instead, separate paragraphs within the blockquotes with two <br>s.

An interesting point is made here. Tags within tags can cause trouble, where the HTML is misinterpreted and internal tags take complete precedence over outer tags. Study the source of this document to see where some tags can be used effectively inside of others. If it is not used here then it will not work as intended on all readers and hardware devices.

The following is an example of using a blockquote that will look fairly good on the systems tested:



Elizabeth opened the letter and couldn't believe her eyes.


Dear Beth,

Your mother won't be coming to the baby shower as she does not approve of the father.

Your best friend,
Mary

The letter fell to the floor as tears welled up in Beth's eyes.

NOTE: We had great difficulty coming up with a moderately workable solution to blockquotes and we almost dropped their use from the HHH specification in the process. If such formatting is critical to the rendering and enjoyment of the e-book you are putting together you might want to consider making it outside the bounds of HHH.

Under no circumstance should you nest one blockquote inside another.



& Entities

Only numeric character entities are included in the HHH specification. It is best in many cases to simply paste or directly enter special characters from the keyboard. However, some characters cause special problems and a few of these are listed below:

It cannot be stressed enough to only use numeric character entities. While developing this document we ruined several files during conversion by using named entities such as &mdash;. Two of the most destructive come to mind:

Pure Evil Follows

Because of the tragic loss of data caused simply by using common conversion tools we recommend that everyone always use numeric character entities whether confining themselves to the Hand-Held HTML specification or not. Furthermore, you might want to keep a file of special characters handy and simply paste in the actual character instead of using the numeric character entities.



Links

Good examples of how to include links can be viewed by looking at the source of this document. It is best to aim the link at a blank area immediately before the actual target as is done in this file.

REMEMBER: There are reasons the link element is applied exactly as it is in this document. If you do not do it exactly as shown here or demonstrated in the source then they will not work on all of the systems tested.

The following example could have been put between <center> tags. To create the link to click on:

<a href="#pics">Pictures</a>

And the destination would be written:

<a name="pics" id="pics"></a>

This last tag should be placed immediately before the place you are aiming at.



Lists

Lists are used in several areas of this specification. The syntax is simple and their use is very restricted. Do not put lists between center tags. There are also problems putting links as list items. Once again combining the use of some elements within others causes problems.

The following is the syntax for listing three different kinds of fruit:

<ul>
<li>apple</li>
<li>orange</li>
<li>pear</li>
</ul>

Other list elements, namely <ol> and <dl> do not work properly in all environments tested and were excluded from the HHH specification.



Problem Areas

It is mentioned more than once in this specification that "tags within tags" can cause problems. Obviously this is not always the case, as "heading tags" are used within "center tags," for example. Still, there are a great many problems that arise when putting certain elements inside of others and we cannot possibly test and list every single instance. A prime example, however, is the way one program handles paragraph tags. When the <p> tag is encountered, this program ignores all other tags surrounding it and renders the paragraph as if it occurs in isolation -- this is one of the problems we encountered when dealing with blockquotes.

A great many things can go wrong if you do not do things exactly as described in this text and as modeled in the source code of the file you are now reading. Unless you intend to test your ideas on a variety of hardware and software combinations, only do as we do in this document. People's enjoyment of your hard work depends on it.

It is unfortunate, but we simply cannot list everything that does not work. It was difficult and time-consuming to test and verify enough things that do work to enable you and other people to make generic e-books that will work well in a variety of diverse environments. Making it work was our primary goal, not making an exhaustive list of everything that will not work.



Final Thoughts

The HTML file before you is intended to be a model of design and how tags should be used when making HTML files that will work across a wide variety of e-book applications and hardware devices. By all means view the source to see how it all works and copy the way that tags are used. The general style is far from ideal, but the important thing is that it will work and aid in the design of more professional-looking e-books for everyone using hand-held devices.

Remember, if you want to use features that are not included in this specification, please don't distribute it under the "HHH" name.