ACNS

Advanced HTML


 

Logical verses Physical Layout

Logical layout uses tages like emphasis <em> and strong emphasis <strong>, where physical layout would use tags like bold <b> and italics <i>


 

Basic Page Layout

Every HTML document should start with this basic outline:

 
<html> 
<head>
<title>This appears at the top</title> 
</head>
<body> 
The content of the page should go here 
</body>
</html> 


 

Named Anchors

Named anchors are a way of jumping to specific locations within a large HTML page. The point to jump TO is marked with an anchor like this:

<a name="anchorname">

You can refer to this particular location by using the usual URL for the file along with #anchorname:

<a href="thisfile.html#anchorname"> this text would take me to the location anchorname in the file thisfile.html </a>


 

Definition Lists

You can make lists of definition like this:

 
DL Tag
This tag starts and ends a definition list--may be modified by COMPACT
DT Tag
This tag indicates the start of the defined term. Usually it is not closed.
DD Tag
This tag indicates the start of the definition.


 

Colors and Backgrounds

Text, background color and background images can be varied for an html page using modifiers to the <Body> tag:

<Body BGColor="#rrggbb">

<Body Text="#rrggbb">

<Body Background="URL">

Where rrggbb are pairs of hexadecimal numbers specifying the relative red, green and blueness of the color. For example:

red
FF0000
green
00FF00
blue
0000FF
black
000000
white
FFFFFF
grey
888888
yellow
FFFF00
cyan
00FFFF


 

Multimedia

Here I've embedded a link to a movie and a sound. Using the following:

Here I've embedded a link to a <a href="movie.mov">movie</a> and a <a href="sound.aiff">sound</a>


 

URL's, Organization, and Naming

On the web files are referenced by Universal Resource Locators (URLs) which are formed like this:

protocol://webservername.domain[port]/subdirectory(s)/filename.html

Anything beyond the server name may be(and usually is) case sensitive. HTML files must end with an appropriate extension (.html or .htm).

On the server files are organized by subdirectories separated by /'s. For small web pages keep everything in one subdirectory and use relative links. For larger projects you may want to use subdirectories. Remember, no spaces in filenames. Use underscores instead.


JavaScript.

This is an example of a roll-over button implemented with Javascript: