ht test page
|
ht is a pre-processor for HTML.
It facilitates the maintenance of a large site by abstracting
out common 'boilerplate' segments of code, e.g. header and
footer segments that are similar system-wide. A number of
varying styles and macros can also be supported.
This file is intended to serve not only as documentation but
also as the main test case for ht.
The Abstract is a descriptive paragraph with important keywords.
|
I believe most people think you only have two choices for creating HTML
- use an editor or code by hand.
But there's a third one which works very well for us:
we use a (home-grown) preprocessor. If you like it's a variant of the
template method; we have a number of styles built in and can modify them
with some parameters.
ht
is a Perl preprocessor that I wrote for maintaining The WDVL. It
allows me to write HTML without having to put on all the 'boilerplate'.
ht generates all the header, table and footer HTML... Using a
preprocessor such as ht provides much more flexibility than typical
HTML editors (which anyway tend to generate bloated and unreadable code)
- for example I can easily change the site style by changing ht and
running source files through it.. (very powerful when combined with
style sheets).
An ht file looks like this.
You run the file through 'ht' and it sticks on the boilerplate,
modified if necessary according to the header parameters and with any
macros expanded. This makes it very easy to create HTML in one of our
standard styles, but you can also control as much as you want the end
result since the input can contain HTML. And it's also very useful for
our mirrors, e.g. there can be small differences automatically
introduced such as crediting the host or pointing to CGI programs on the
primary site because we don't have CGI access on every mirror.
With 1,000 pages to maintain this would hard to do with an editor..
We don't currently use a database but a logical extension of this
method would be to put the ht files into a db and then we could generate
the pages dynamically, e.g. to account for browser differences.
This approach isn't for everyone but anyone who wallows in Perl and
HTML should love it..
The Header
Every ht file needs a header. The minimum header is:-
Content:
after which comes actual content.
Typically I only use a couple at any time. The minimum is
"Content" and other things are defaulted or deduced - e.g. since I use
meaningful directory names the Title usually can be derived from that
(tho' that tends to be too brief). "Class" is very useful to specify the
general style - e.g. "Astro" for the black background..
You can also specify:-
| Heading | Content |
| Abstract | Descriptive paragraph with important keywords. |
| Author | Author's name or initials if regular (e.g. 'SS').
| AR | Alan Richmond |
|---|
| LR | Lucy Richmond |
|---|
| CM | Charlie Morey |
|---|
| DL | Diana Luckevich |
|---|
| DW | David Walker |
|---|
| LC | Linda Cole |
|---|
| LM | Laurie Mann |
|---|
| KM | Kate Moore |
|---|
| RH | Reaz Hoque |
|---|
| RM | Rhonda McGuinness |
|---|
| SJT | Steve J. Thompson |
|---|
| SS | Selena Sol |
|---|
|
| Background | URL of background image or'Stars' |
| Banner |
One of
WDVL,
CWSW,
None, ...
Defaults to DoubleClick.
|
| Base | Reference URL for relative links. |
| Bgcolor | Background color. |
| Class |
One of Astro, Plain, Table, Text, ...
| Astro | Gold text on black background |
|---|
| Plain | Black text on white background |
|---|
| WebTV | Obsolete |
|---|
| NavMar | Obsolete |
|---|
| Table | Obsolete |
|---|
|
| CSS | 'No' to omit style sheets or 'Yes' |
| JavaScript | For JavaScript functions |
| Keywords | To go in the Meta tag. |
| Link | Link color. |
| Refresh | Num.seconds; URL=redirect page. |
| Style | Inline CSS.
Probably the best way to add specific styles is to use the ht header 'Style:',
e.g.
Title : Graphics for Rocket Scientists
Author: KM
Style :
.count
{
font-family: Arial;
background: transparent;
color: #ff6600;
}
+++
Content :
Ready for blast off ?
<span class=count>5-4-3-2-1-liftoff!</span>
You can use classes in other HTML elements such as table cells, etc.
It looks more elaborate than just using FONT, but you get used to it..
And if you find you want to use the same class in other files we can
add it to the standard style sheet, and then you can easily change it
in future, in just one place.
|
| Text | Text color. |
| Title | Page title and first heading. |
| Valid | 'No' or 'Yes'. |
| Vlink | Visited link color. |
| Width | Text width (defaults to 85%) |
|---|
View the
ht file for this page for examples.
Any that need more than one line should start on the line after
the ':' and be terminated with '+++' on it's own line.
If there
is just a single lines worth, then it goes on the same line as the
item name,
Abstract : This is a very short description.
If there is more than one line's worth,
then
- the content part begins a new line and
- it ends with a line containing only +++
Abstract :
This is a much longer description.
It can go on for several lines.
The indenting is just to make it easier
to read - it has no effect on ht.
+++
Tables
The other main thing about ht files is there's a few 'macros'
(shorthand or abbreviations), esp for commonly-used table layouts..
[!{{ Big Bold Heading }}!|
Next cell in the row. Blah blah.
|;
|!{{ Next Row, Big Bold Heading }}!|
Bottom right cell
|]
Looks like this:
|
Big Bold Heading
|
Next cell in the row. Blah blah.
|
|---|
|
Next Row, Big Bold Heading
|
Bottom right cell
|
[! Begin table with header
[| Begin table with data cell
|! table header
!! table header
|_ table cell
!| table cell
{{ bigger
}} bigger end
!; end of table row
|; end of table row
!] end of table
|] end of table
There are probably some notes that need to go with these but for now
just look at some examples..
Other Macros
There are some more macros, typically functional like href:-
Title : The Two Best Sites for Web Developers
Class : Plain
Content :
[!{{ @href(http://www.w3.org/,The W3C) }}!|
This is the site of the
World Wide Web Consortium...
|;
|!{{ @href(http://WWW.Stars.com/,The WDVL) }}!|
The Web Developer's Virtual Library...
|]
ht test page
<center>
@Prev (ht.html) @Up (index.html) @Next (ht.html)
</center>
|
