This is a CSS page Layout
It has a header, a top navigation area, a narrow, left column and
this wider content area.
A footer is in place and is pushed down as either of the 2 columns need
to grow longer as more Content is added.
Sample Text ---------------
Basic HTML document structure.
<HTML> - Indicates the start of your HTML document.
<HEAD> - Contains information about the page such as the TITLE, META
tags for proper Search Engine indexing, STYLE tags, which determine the
page layout, and JavaScript coding for special effects.
<TITLE> - The TITLE of your page. This will be displayed in the title
bar of the viewer's browser.
</TITLE> - Closes the <TITLE> tag. All text between the two tags will be
the Title.
</HEAD> - Closes the <HEAD> tag.
<BODY> - This is where you will begin writing your document and placing
your HTML codes.
</BODY> - Closes the <BODY> tag.
</HTML> - Closes the <HTML> tag.
Twelve tags to get you started. Reading time: Twelve Minutes
1- Paragraph – <p></p> puts a blank line above and
below the text marked up by the tags. Alignment of the paragraph can be
set to left, right, center or justified. Tags are NOT case-sensitive.
2- Break <br /> ends the line and goes to the next
line.
3- Anchor Element <a></a> Creates a hyperlink. The
target to be clicked on to work the hyperlink can be text or an image.
It will be placed between the tags.
The HREF attribute defines the target of the hyperlink (the place you
will be taken) and is placed inside the beginning tag like this: <A
HREF="http://sfimg.com">place text for the user to click on here</A>
An anchor tag that includes an image for the user to click on just
inserts the image tag between the <A> and </A> tags like this:
<A HREF="http://sfimg.com">
<IMG SRC=" http://images5.theimagehosting.com/banner286.jpg "></A>
4- Image element <img>
<IMG> inserts an image by giving the exact filename and the location to
it.
Like this
<img src="http://images5.theimagehosting.com/banner286.jpg" alt="Image
Hosted by The Image Hosting" />
The alt="" is the alternate text that will be displayed in a browser if
it is set to NOT display images. Some say that the search engines use
alt data in evaluating the web page.
Image alignment- The image element can not be aligned on the page
directly. You just place it inside Paragraph tags and align the
paragraph left, right or center.
Test the Image's Location and Name.
You can test to see whether an absolute URL works by entering it into
your browser address window. It should display the image in your browser
window if everything is OK.
Notice carefully above the two image source locations. The first has
spaces between it and the surrounding quotation marks. It will probably
appear as a "hot" link. If so, clicking it should open your browser and
download the image into it.
5- Font - <font>size="5" color="blue" face="arial"</font>
6- Bold, Italic and Underline - <b>makes text bold</b>,
<i>italicizes text</i>, <u>places underline text</u>
7- Horizontal Rule - <hr> has no closing tag. Size="5"
sets 5 pixels high, width="100%" sets width as 100% of page, width can
be given in pixels. Noshade, turns off 3-d shading.
8- Lists – Ordered <ol></ol> and Unordered <ul></ul>
Ordered list- has a list of items each of which will be identified with
a number or letter. The choice of how items are ordered is made by
including the type="" inside the starting element. There are five
choices:
1,A, a, i or I. The numbers are automatically added to the items once
the type is chosen. Items in the list are preceded by an <li> tag.
Unordered list- items are listed in the order in which they are placed
in the list and do not include any identification just a disc, circle or
square which is chosen by including the type="" within the starting tag.
9- BlockQuote- <blockquote></blockquote> indents the
block of text that is placed within the tags.
10- Head – see first of the article items within the head tags do not
display.
11- Body – see first of the article this is the area that will be
displayed.
12- Title – see first of the article this will be shown in the Title bar
of the browser.
================================
Additional information that you may find helpful:
RELATIVE vs ABSOLUTE URL's
URLs are located relative to a webpage's location or are absolute
(without regard to the current page).
Example of Relative URL: the image: banner.jpg can be linked from a page
in the same directory with a link that looks like this: <IMG SRC=
"banner.jpg" >
Example of Absolute URL: The same image can be linked like this:
<IMG SRC="http://images5.theimagehosting.com/banner.jpg" >
Curly Quotes can cause trouble in html code
When using Microsoft Word to create the code- don't use curly quotes-
Microsoft Word automatically changes straight quotation marks ( ' or " )
to curly (smart or typographer's) quotes ( or ) as you type.
To turn this feature on or off:
On the Tools menu, click AutoCorrect Options, and then click the
AutoFormat As You Type tab.
Under Replace as you type, select or clear the "Straight quotes" with
"smart quotes" check box.
Case-sEnSiTiViTy
Hosting on a Linux-based webserver makes folder and file names case
sensitive.
Using lower case always is probably the best practice.
Other elements to learn about:
Frames and Framesets
Tables
Cascading Style Sheets
JavaScript
This is
the header section. id for this section is masthead