HTML with Arachnophilia (the very basics)
Colors and Fonts

Colors

There is a button on the Graphics toolbar called 'EditColr' which is very handy when you want to change a hexidecimal color number.
On the page we just created the text was black which was ok while the page was white but when we changed the background to a dark green it just didn't stand out.
To change the color to a more suitable one highlite it in the body tag and delete it.


With the cursor still in the same place click the 'EditColr' button.
If you don't like any of the 48 colors in the grid click 'Define Custom Colors'
and play around with the 2 controls.

Click OK and the color will appear in the correct place.

Fonts
To begin with you must know that in order to see a font on a web page the computer viewing the page must have that font installed.

I have found that even some seasoned webmasters are surprised when I tell them that the font they specify on a page will possibly only show on their own computer.

The problem lies with HTML composers that allow special fonts to be chosen with no warning that if the viewing computer does not have the font it will revert to the default which is usually 'Times New Roman'

Problems arise when a script type of font is specified because those fonts need to be enlarged in order to appear normal size. If you have ever viewed a page where the text was huge it would be because you did not have the specified font on your computer.

Best to stick to the basic few that are universal.
Times New Roman, Arial, Verdana, Comic Sans MS

The way to specify a font is in the <font > tag with the variable face=""

<font face="times new roman">Your Text</font>

If you really want to specify a font and it is the same size as a normal font you can give a second and third choice by adding them with commas between like this.
<font face="BlackChancery, Diploma, Verdana">Your Text</font>
Depending on the computer this could appear in any of the next 3 ways.

Since these are at least similar in size the damage is not terrible but personally I prefer to know exactly what people see and if I want a heading in a special font I put it in a graphic.

In HTML if you do not specify a size of font you get the default size 2 and Arachnophilia has included an easy way to change up or down with the font buttons 'Font+1', ' Font+2', 'Font-1' and 'Font-2'    
This means that the statement <font size="3" > is the same as <font size="+1" >
Before we leave the subject of font size we must cover the heading fonts. When you stipulate a heading <h1></h1> you get a set size of font and a paragraph break so that nothing else can be added to the line.
Here are the sizes.

H1

H2

H3

H4

H5
H6
The other variable that can be included in the <font> tag is color. You will find this on the 'Graphics' toolbar but I changed mine to the 'Fonts' toolbar. The button is called 'NewColr' and brings up the color panel so that you can choose from actual colors instead of knowing the Hexidecimal numbers.
You can stack several font tags together or put everything in one.
<font size="1" color="#000000" face="times new roman"></font>
is the same as
<font size="1" ><font color="#000000" ><font face="times new roman"></font></font></font>

Some of the other things you can do with fonts are tags on their own and do not go in the font tag.

<b></b> Bold you already know
<i></i> Italic Italic
<u></u> Underscore Underscore
<sup></sup> Superscript Superscript
<sub></sub> Subscript Subscript



Back   Next