 |
|
|
So you're new to HTML. That's okay! Just follow the directions in your
Account Manager to get the search boxes, links, or buttons for your
search engine, and cut and paste them into whatever you're using to edit
your HTML pages. But it doesn't all line up on the page the way you
were hoping? Then you need a little HTML primer, for solving some basic
layout problems. Read the HTML like a cookbook recipe (in layout terms,
that's what it is), and try some of the following:
- The Center Tag - There's nothing quite like a lot of center
tags to quickly make a web page that looks like a quickly made web page.
But hey, it works! Just surround some stuff, even a whole PicoSearch
block of code, with:
<center>stuff</center>
- The Paragraph Tag - The P tag starts and ends a new
paragraph, beginning with some whitespace. It can take an alignment
attribute of "left", "right", or "center". So to do a centering, wrap
your stuff with the following:
<p align="center">stuff</p>
- The Divider Tag - The DIV tag starts and ends a new section
without the whitespace of a P tag. It can also take an alignment
attribute of "left", "right", or "center". So to do a right
justification for example, you would wrap your stuff with the following:
<div align="right">stuff</div>
- Whitespace - In HTML, the only whitespace that is obeyed
automatically is one space between words. Everything else is usually
discarded, so that you may organize your HTML with lots of spacing that
won't actually be seen. The result is that you have to get used to
specifying whitespace explicitly.
To break a
line, use <BR>. But to break a line and also move down the page,
use a <P> tag before the next paragraph. Or you can use
<BR> <BR> to force exactly one blank line. This
means: break, start a line with a nonbreaking space (that's the
code), and break again. Voila! One line of a space that you
fully intended. In fact, that is what ends this line now.
If
you want less than a full line height of vertical spacing, you will
need to put your stuff into tables, and add some rows with small heights
(say 5 to 10) in between the rows that contain your stuff. Tables,
rows, heights, what's that you say?! Read on, if you dare... :)
- Tables - Tables give you a way to pour content down a page in
precise columns. Some people groan to learn tables, but if you stick to
basic patterns, it's really quite easy. There are tables in the
PicoSearch search box code, for example, and they not only hold the
parts together (the icon, the entry box, the search button), but they
also give you many opportunities to make precise visual adjustments. In
fact, tables are *the* way to override the non-specificity of HTML and
make a page come out exactly the way you want it, rather than the way
the browser feels like showing it.
Tables
consist of start and slashed-end pairs of tags for the <TABLE>
itself, <TR> pairs for each new row going down, and <TD>
pairs for each new data column going across. In general, browsers are
pretty good at automatically stretching tables to fit what you put in
them. The following is an example of a simple table that centers some
stuff in an unbordered blue area exactly 200 pixels high by the width of
the screen available. It will be bigger than 200 pixels high however
if your stuff needs it.
<table border="0" height="200" width="100%">
<tr><td height="200" bgcolor="blue"> stuff
</td></tr></table>
One of the best ways to collect HTML tricks is to use the
"View...Source" command in your browser, to locate and then cut and
paste the tricks that you like in someone else's pages. Experiment, have
fun! HTML is gratifying, because you can go back and forth quickly
between making an adjustment in the code, and seeing the immediate
visual impact in a browser.
As you learn HTML, you may want
some real references. There are many books of course, but the classic
is "HTML: The Definitive Guide" by Chuck Musciano & Bill Kennedy -
it's the one with the Koala bear, and it's published by the people at O'Reilly. The official World Wide Web Consortium is at W3C.org, and many web developer resource sites exist, including CNET's builder.com, the Web Design Group's htmlhelp.com, and WebReference.com
|
|
 |
|
|
