So that web pages are accessible as possible, adhere closely to the HTML standards. There are a number of these: Strict, Loose, and Frames. I use the Loose standard.
HTML is designed to 'mark-up' or indicate the logical meaning of text, rather than its visual appearance. For example, rather than specifying that a heading should be in large text, which is the typical thing to do, HTML recommends specifying the heading as a heading, and let the browser decide how to represent a heading.
The merit of this approach is that non-visual browsers (speech, braille, etc.) can present the information appropriately. For instance, one usually emphasises a word by writing it in italics. However, a non-visual browser cannot represent italics. Browsers don't know why some text is in italics - is it because it's a scientific name in Latin, a book title, an emphasis, or a mere visual effect? A browser can, however, represent emphasis. A speech browser might raise the pitch of volume. HTML, for that reason, recommends that one use the emphasis tag, rather than the italics tag. For a book citation, one would use the citation tag.
It is common to see text marked-up as an Arial font of a specific size. However, non-visual broswers may have no concept of a font. Also, a visually impaired person may use an extremely large font size for ordinary text, then the heading text will probably appear smaller than the body text! In this case, it would be better to use a relative font size, but the best solution would be to use the heading tags.
The HTML standard allows web pages to be published such that both non-visual and visual browsers are able to represent the same page. This is done by separating the content of the web page from it's appearance, a goal achieved by the use of style sheets.
To improve the chances of your web pages being found and well categorised by a search engine, the meta tags for description and keywords should be used. These are added in the head section of the HTML page, thus:
<META NAME="description" CONTENT="a brief description
of this web page's content goes here">
<META NAME="keywords" CONTENT="individual words, separated by
commas, relevant to the content of this web page go here">
Go here for a good introduction to Cascading Style Sheets.
I recommend using <H> tags for headings, rather than specific font styles.
With respect to emphasis, do not use bold and italic tags
(<B>
and <I>
). These cannot be
interpreted by non-visual browsers. Instead, it is better to use
emphasis (<EM>
) and strong
(<STRONG>
, stronger emphasis) tags. These tags
convey logical meaning which can be translated by non-visual
browsers. Visual browsers display text within emphasis tags is
typically displayed as italics in visual browsers, and text within
strong tags as bold.
See my FrontPage Notes for more information about text styles.
<TT>
tag, which displayes a fixed-space font.
This helps to discriminate the filename, but doesn't convey any
logical meaning. There isn't a logical tag which applies to
filenames.<EM>
) tags as
they are logically and visually emphasised.<VAR>
tags since they are
generally indicative of program variables.Using paragraphs (<P>
tag) in a list item this
leaves gaps between paragraphs within an item that are
bigger than the gaps between the items! This spoils the structure of
the list, and therefore reduces its readability. Using break
(<BR>
) tags solve this problem.
<DL>
), and you
have a multi-paragraph definition definition
(<DD>
), don't include the first paragraph in
<P>
tags, unless you've done this for all the
<DD>
's. Doing so will leave a blank line between
the definition term (<DT>
), and the definition
itself, which is inconsistent with the other definitions. Instead,
start the first paragraph with the <DD>
tag, and
end it with a <BR>
tag, all the other paragraphs
(including the last one) can be within <P>
tags.
I had a set of instructions which I had modified after they had been in circulation for a while. I replaced a few paragraphs, but wanted to keep the old paragraphs as I wasn't certain about the new procedure I was recommending. However, I wanted to reduce the importance of these several consecutive paragraphs, so that they were still present but clearly of less importance than the main text.
However, it turns out the <SMALL>
tag is an
inline element. I need a way of applying some sort of logical
de-emphasis across multiple paragraphs. Small isn't a logical style,
but it's the tag closest to the intended meaning that I could
find.
I use upper-case tags since they are easier to see amongst a lot of text, and the readability issue is not so important with short text anyway. Typing is not much of a problem, because I type in lower case and use HTML-TIDY, or a search&replace process to change lower-case tags to upper-case.
I tried three methods of converting documents from Word format to HTML. These are the results:
Save As... command in Word2k | The resulting HTML files contain HUGE amounts of HTML code. Not very efficient |
Copy in Word2k, Paste in FP98 | Less HTML code generated than Word2k's Save As...command, but still rather inefficient. |
Open filename.doc in FP98, Save in FP98 | The HTML is clean and efficient. This is my preferred method. |
You can find the definitive guide to HTML (and other standards for the web) at the W3C consortium's web site. More information on general HTML quality issues can be found at HTMLHelp's web site. For advice on making your web pages as universal as possible, see their accessibility pages. For a more general discussion of best practice, go to their style pages.
Home | About Me | Copyright © Neil Carter |
Content last updated: 2001-10-12