Grey is boring, I like green.
by Kurt Keller
Bored with the grey background Netscape uses by default? Me too. My
favourite colour is green. It is possible to change this default in the
options settings in Netscape. But then, black on green is even harder on
Easy to read, that's an attribute which is important for a WebPage. The
page I recently saw, yellow on red, sure looked nice, but I did not read
it; it was too hard to decipher. Also some pages with cute background
graphics are nice to watch, but very hard to actually read.
I usually recommend to use a high contrast for WebPages with a lot of
text; either a dark background with a bright text colour or vice versa.
A black background combines fine with many other colours, so does white.
Colours for background and text, as
well as for links, can be specified as options in the BODY tag and are
valid for the whole page:
<BODY BGCOLOR="#rrggbb" TEXT="#rrggbb"
LINK="#rrggbb" VLINK="#rrggbb" ALINK="#rrggbb">
Let's have a look at the options one by one:
BGCOLOR="#rrggbb" background colour
The BGCOLOR option sets the background colour for the current page.
rr, gg and bb are values (so called RGB-values) in hexadecimal for
the amount of red, green and blue.
decimal: 00 01 02 03...09 10 11 12 13 14 15 16 17...255
hexadecimal: 00 01 02 03...09 0A 0B 0C 0D 0E 0F 10 11...FF
Difficult? Not really. Ask one of your friends who is good at
mathematics to explain you in detail how to convert numbers. Or if
you don't know anybody, you can also send an e-mail to me at
Kurt@pinboard.com. If there
are many requests I'll make sure that an
article in a future issue of AJ will cover number systems.
How to find the right values for red green and blue? The only way is
to experiment a little. Let me give you the following information:
black : no red no green no blue = 000000
red : full red no green no blue = FF0000
green : no red full green no blue = 00FF00
yellow : full red full green no blue = FFFF00
white : full red full green full blue = FFFFFF
Don't expect to notice a difference for each slightly different
value, after all with 256 different values for each of the three
colours, there are 16'777'214 colours in between black and white!
Also when experimenting be generous, take steps of 16 or even 32 at
a time; the visitor to your page might only have a display driver
installed that supports 256 different colours (or even only 16).
The online version of this 'lesson', which can be found at
and then selecting 'Lesson 3', has a
link to a page with many different
RGB values. Netscape 2.0 or
higher is needed to correctly display the colours.
TEXT="#rrggbb" text colour
With this option, you can set the colour of the text.
LINK="#rrggbb" colour for links
VLINK="#rrggbb" colour for visited links
ALINK="#rrggbb" colour for active link
An active link is the link, you are clicking on. While you click on
it, a link will change it's colour from the value in LINK to the
value set in ALINK. And if you return to the original page, the link
will be displayed in the colour specified in VLINK (because you just
visited it, it becomes a 'visited link').
Some pages use a graphic for the background,
rather than a colour:
BACKGROUND="URL" background graphic
URL is the URL that points to the graphic file you would like to
display as a background. If the graphic is smaller than the whole
page, it is simply displayed several times, often enough to fill the
Don't use large graphics for backgrounds, they take a long time to
load. And if somehow possible, refrain from using backgrounds with
several colours, it makes text difficult to read.
You know them from usenet, e-mail, BBS, those <g> or <bg>
smileys. But how to display them on a HomePage? After all, < and >
characters. Also German, Spanish or French and other special
characters usually can not be displayed properly. Don't worry, help is
on the way:
< < (less than)
> > (greater than)
" " (quotation mark)
& & (ampersand)
ä ä (German a-Umlaut)
ö ö (German o-Umlaut)
ü ü (German u-Umlaut)
ñ ñ (Spanish n with a tile)
È È (French capital E grave)
® ® (trademark)
© © (copyright)
NOTE: If you are using a browser under a Japanese operating
system and have turned Japanese Document Encoding on, some of above
characters will not appear as mentioned, but as Kanji and other
stuff. It would be too much and too technical to explain here why
this is so. Under Netscape select Options/Document Encoding/Western
and you are set.
So to display a <g>, you'd use <g>.
ATTENTION: Unlike most of HTML, these codes are CASE
make sure you don't forget the semicolon at the end; otherwise some
browsers will not correctly display the signs.
Linking to a place within a document
You wrote some software and are offering it on your HomePage. The user
manual is about 20 pages long, starting with an index. You would like to
enable visitors to download the whole documentation at once, so it can
easily be read offline or printed out. But for people reading online, it
should also be possible to jump to the different sections directly from
No problem, this can be done with one single file. It is possible to jump
to anchors within the currently displayed file:
<A HREF="#anchor">...</A> link to named anchor
Following this link will bring you to the section marked as 'anchor'.
And here is how a section is marked:
<A NAME="anchor">...</A> named anchor
You can even jump directly to this section from another file with:
As usual, the best place for seeing examples is online, at
For those without connection to 'the Net', here some short examples:
<BODY BGCOLOR="#000000" TEXT="#FFFFFF"
LINK="#FF0000" VLINK="#FFFF00" ALINK="#00FF00">
This causes your HomePage to use
white text on a black background.
Links are being displayed in red, links which already have been
followed (visited) are yellow and a link will turn green while you
click on it.
<BODY BACKGROUND="mybackgd.gif" TEXT="0000FF" LINK="00FF00">
The background of this page is filled with the
residing in the same directory as the page displayed, text is blue and
links are green.
Copyright © 1996 PINBOARD
Above line displays the copyright symbol after
the word 'Copyright'.
Welcome to the User guide for...
In order to setup the software for operation with...
This is how an online documentation could
Enough for today and it's high time to practice a little. If you've no
place to practice remember that you can do it locally on your harddisk or
you can make use of PINBOARD's HomePage Hosting Service. For details
check out http://www.pinboard.com/.