Do's and Don'ts ...
Troubleshooting
Avoid
Overlapping Tags
Consider this example of HTML:
<B>This is an example of <I>overlapping</B>
HTML tags.</I>
The word overlapping is contained within
both the <B> and <I> tags. A browser might be confused by this coding
and might not display it the way you intend. The only way to know is to
check each popular browser (which is time-consuming and impractical).
In general, avoid overlapping tags. Look
at your tags and try pairing them up. Tags (with the obvious exceptions
of elements whose end tags may be omitted, such as paragraphs) should be
paired without an intervening tag in between. Look again at the example
above. You cannot pair the bold tags without another tag in the middle
(the first definition tag). Try matching your coding up like this to see
if you have any problem areas that should be fixed before you release your
files to a server.
Embed
Only Anchors and Character Tags
HTML protocol allows you to embed links within
other HTML tags:
<H1><A HREF="Destination.html">My heading</A></H1>
Do not embed HTML tags within an anchor:
<A HREF="Destination.html">
<H1>My heading</H1>
</A>
Although most browsers currently handle this
second example, the official HTML specifications do not support this construct
and your file will probably not work with future browsers. Remember that
browsers can be forgiving when displaying improperly coded files. But that
forgiveness may not last to the next version of the software! When in doubt,
code your files according to the HTML specifications (see For
More Information below).
Character tags modify the appearance of
the text within other elements:
<UL>
<LI><B>A bold list item</B>
<LI><I>An italic list item</I>
</UL>
Avoid embedding other types of HTML element
tags. For example, you might be tempted to embed a heading within a list
in order to make the font size larger:
<UL>
<LI><H1>A large heading</H1>
<LI><H2>Something slightly smaller</H2>
</UL>
Although some browsers handle this quite nicely,
formatting of such coding is unpredictable (because it is undefined). For
compatibility with all browsers, avoid these kinds of constructs.
What's the difference between embedding
a <B> within a <LI> tag as opposed to embedding a <H1> within
a <LI>? Within HTML the semantic meaning of <H1> is that it's the
main heading of a document and that it should be followed by the content
of the document. Therefore it doesn't make sense to find a <H1> within
a list.
Character formatting tags also are generally
not additive. For example, you might expect that:
<B><I>some text</I></B>
would produce bold-italic text. On some browsers
it does; other browsers interpret only the innermost tag.
Do
the Final Steps
Validate Your Code
When you put a document on a Web server, be
sure to check the formatting and each link (including named anchors). Ideally
you will have someone else read through and comment on your file(s) before
you consider a document finished.
You can run your coded files through an
HTML validation service that will tell you if your code conforms to accepted
HTML. If you are not sure your coding conforms to HTML specifications,
this can be a useful teaching tool. Fortunately the service lets you select
the level of conformance you want for your files (i.e., strict, level 2,
level 3). If you want to use some codes that are not officially part of
the HTML specifications, this latitude is helpful.
Dummy Images
When an <IMG SRC> tag points to an image
that does not exist, a dummy image is substituted by your browser software.
When this happens during your final review of your files, make sure that
the referenced image does in fact exist, that the hyperlink has the correct
information in the URL, and that the file permission is set appropriately
(world-readable). Then check online again!
Update Your Files
If the contents of a file are static (such
as a biography of George Washington), no updating is probably needed. But
for documents that are time sensitive or covering a field that changes
frequently, remember to update your documents!
Updating is particularly important when
the file contains information such as a weekly schedule or a deadline for
a program funding announcement. Remove out-of-date files or note why something
that appears dated is still on a server (e.g., the program requirements
will remain the same for the next cycle so the file is still available
as an interim reference).
Browsers Differ
Web browsers display HTML elements differently.
Remember that not all codes used in HTML files are interpreted by all browsers.
Any code a browser does not understand is usually ignored though.
You could spend a lot of time making your
file "look perfect" using your current browser. If you check that file
using another browser, it will likely display (a little or a lot) differently.
Hence these words of advice: code your files using correct HTML. Leave
the interpreting to the browsers and hope for the best.
Commenting
Your Files
You might want to include comments in your
HTML files. Comments in HTML are like comments in a computer program--the
text you enter is not used by the browser in any formatting and is not
directly viewable by the reader just as computer program comments are not
used and are not viewable. The comments are accessible if a reader views
the source file, however.
Comments such as the name of the person
updating a file, the software and version used in creating a file, or the
date that a minor edit was made are the norm. Also some search engines
include comments when they are indexing sites therefore they can be used
in some instances as a means of improving your sites' rating on some search
engines.
To include a comment, enter:
<!-- your comments here -->
You must include the exclamation mark and
the hyphens as shown.
|
