What does HTML stand
for, anyway?
HTML Stands for "Hypertext
Markup Language". A webpage is basically a text document that has
special "tags" that are inserted around paragraphs or images
that tell the browser (like Netscape or Microsoft Internet Explorer)
how to display the element.
How
do I get started?
The easiest way is to create
a document in a word processor (such as Microsoft Word, Word Perfect,
etc.) and "Save as HTML" from the file menu. Start with something
simple, then open the file with a text editor and look at it to see
what it's done. The parts that are included in the angle brackets (<>
— these are commonly called "wakkas" in programming circles)
are "tags" - these control how the text or image is displayed
in the browser. Even if you never do more than use a GUI ("Graphical
User Interface" - also commonly referred to as WHYSIWYG - "What
You See is What You Get") editor to make webpages, it's a good
idea to get to know what's happening "behind the scenes",
so that you can make quick and dirty changes, or tweaks, to the page.
Additionally, visual editors tend to leave some non-essential garbage
in the page which can either confuse the browser, or at best makes the
page take longer to load when it's actually placed online.
What
do I need to make a web page?
Basically, all you need is
a text editor and
a basic knowledge of the HTML standard. The simplest tool to use is
"Notepad" in Windows or "SimpleText" on the Mac.
Building webpages doesn't take a lot of sophisticated software if you
learn the coding. There are a lot of freeware and shareware tools that
will make the job easier; most even integrate tools that will help you
proof your document, and put it online.
How
can I format my text?
AHA! You're getting into this,
huh? If you've gotten in deep enough to ask this one, you've stumbled
onto one of the greatest shortcomings of HTML... no margins, no indents.
While this has been addressed to some degree in the HTML 4 specification,
apparently the fact that you'd want documents designed for the web to
look like printed documents never occurred to the original designers
of HTML. There ARE no settings for margins or indentions. You can sort
of kludge your way around the margin thing by placing your text in a
table and setting the table's width to about 80% of the page's width,
or by utilizing the "cellpadding" and "cell spacing"
attributes of the table - keeping in mind that these settings affect
everything in the table. Indentions can be faked by either placing
a series of blank spaces at the beginning of the paragraph (in your
HTML code, these are created with ) or creating a transparent
gif to use at the beginning of each paragraph.
You may also fudge a bit and use the <dd> tag to create a paragraph
indent; it's bad form (read: illegal html when used outside the <dl></dl>
structure), but it seems to work in both of the major browsers.
How
do I add links to other pages?
You can link to other pages
from your page by including the url to the second page with something
called an anchor.
the tag for and anchor takes the basic form, <a> </a>. There
are also some additional parameters that you must add - for instance,
if you're including a link to another webpage, the parameter is href,
so that the finished product looks like this:
<a href="http://pagelocation.com">LINK</a>
(don't forget to enclose the URL in quotes). When the page is viewed
in a browser, nothing shows up exept for the word LINK (which should
be underlined, unless you've instructed it otherwise by adding a style
element in the anchor tag), which, when clicked, will take the user
to the address specified in the URL.
How
do I add pictures?
Pictures are included in your page by using the <img> tag. This
one doesn't have to be turned off like most other HTML tags, it's pretty
much a "standalone" thing. For example, to include an image
in a page, your code would look like this:
<img src="doodad.gif">
That's pretty much all there is to it. To be complete, the tag also
needs to have height and width attributes; you may also include border
(as in, border="0", or border="27", etc.) and an
alternative text ("alt" tag) description.
What kind
of images can I use?
In the two major browsers in
use today (MSIE and Netscape), image types supported universally are
GIF and JPEG. Both are basically compressed image formats, and each
uses a pretty much radically different (from each other) method of compression.
GIF standards include type 87 gifs (the "original" standard)
and type 89a gifs - a newer type of image that supports transparency.
GIFs are a better format for displaying line or block art - images with
large spages that are all the some color. They're also limited to 256
colors (or 216, in the case of Netscape). Gifs were developed in the
early days of the Compuserve empire and seemed like a good idea at the
time. They used "lzw" compression (developed by Unisys), and
the public perception was that the "standard" was released
into the public domain. As a result, a whole slew of shareware and freeware
image editing/creation programs came out of the woodwork writing GIFs.
When The WWW really took off, and suddenly GIFs were literally everywhere
(around 1994), Unisys awoke from it's slumber and decided it was going
to enforce it's patent on the lzw technology after all. They did this
by basically suing all the software publishers who were creating GIFs
without purchasing a license from them. Nowadays, virtually all of the
image editing software companies are in compliance, so you pretty much
don't need to worry about all the "GIF tax" rumours you hear
flying around on the web. They're good for what they're good for...
low resolution images with plain , simple colors, or images with transparent
backgrounds.
JPEGs are, in general, a better format to use for photographic images
or images that use a lot of color gradients. I don't know a whole lot
about the histroy of JPEGs, because, frankly, the individuals who released
the format weren't jerks who threatened to sue the WWW. Rather than
compress all the "same color" spots in the image, JPEG compression
actually munges your original a little. It's "lossy" compression;
the upside to this is, you can generally set just how munged you image
will be in the image editing software you use to create them. JPEGs
are also good for what they're good for - creating high-rez images with
small file sizes. Just watch your compression levels and be aware that
too much can start to muck up your pictures.
How do I make
the image link to something else?
How do I make
the border go away around a linked image?
Why do I need
height and width on images?
When a page loads, the first
thing the browser interprets is the information included in the <head>
tag (that's why javascript usually goes there; so that it can start
things going before the page starts to display). Next, the browser scans
through the code and determines the pages layout - where the images
go and how much space to allocate for images, table cells and text blocks.
If you leave out the size elements for an image, the browser may have
to draw the page, then stop and redraw it again once it encounters the
images. If the image sizes are laid out up front, the page will render
quicker.
What is the
"alt" used for?
Most modern browsers have the ability to surf with "images off".
Many users (especially those with a slower dial-up connection) prefer
to surf the web in this mode to speed things up. In addition, older
web browsers such as mosaic do not display graphics.
How do I add
animations?
What
are "frames"?
I've
made a web page. How do I get it online?
Do
all my files have to be in the same directory?
Oops!
I need to change something on my page.
