(Completed February 23, 2004)
NOTE : This page will serve as a document/reference for the ANXA trainees, who started at February 15, 2004.
I've added more information besides what was discussed in the HTML training to aid the trainees in their exploration
to the structure of web construction. - Mercedes Calayag.
Writing HTML
You can create an HTML document with any word processor or text editor, including the very basic
Notepad or WordPad of Windows. Of course, there are also Web page editors, such as FrontPage, to
make life easier. Still, knowing the basics of Hyper Text Mark-up Language (HTML) could help one
a lot in understanding the construction of web pages.
[Back to top]
HTML Tags
HTML tags are commands written between less than (<) and greater than (>) signs, also known
as angle brackets, that indicate how the browser should display the text. There are opening
and closing versions for many (but not all) tags, and the affected text is contained
within the two tags. Both the opening and closing tags use the same command word but the closing tag
carries an initial extra forward slash symbol /.
[Back to top]
Organizing Files
Before you start to create your files, it's a good idea to figure out where you're going to
put them.
- To organize your files.
- Create a separate folder or directory to hold all the material that will be available at
your website.
- Divide the central folder in a way that reflects the organization of your website. You may
decide to create a separate folder HTML documents, one for images, and one for the external files.
If you have a large site with many pages, you may wish to divide the site into categories or
chapters, placing the images in individual folders.
- TIPS :
- Use simple, one-word names without symbols or punctuation for your files and folders.
Use all lowercase letters so that your URLs are easier to type and thus your page are easier to
reach.
[Back to top]
Creating the Foundation
Most web pages are divided into two sections: the HEAD and the BODY. The HEAD section is where
you define the title of your page, include information about your page for search engines, add
advanced formatting information, and write scripts. Except for the title, the contents of
the HEAD section are not readily visible to the visitor.
Example:
|
| <HTML> <HEAD>
</HEAD>
<BODY>
</BODY>
</HTML> |
|
|
[Back to top]
Creating a Title
Each HTML page must have a title. A title should be short and descriptive. In most browsers,
the title appears in the title bar of the window. Perhaps more importantly, the title is used by
search indexes as well as in your visitors' browsers' history lists and bookmarks.
TIPS :
- The TITLE tag is required.
A title cannot contain any formatting, images, or links to other pages.
[Back to top]
Starting a New Paragraph
HTML does not recognize the returns that you enter in your text editor. To start a new paragraph
in your web page, you use the P tag.
- To start a new paragraph.
- Type <p. <p
- If desired, to align the text paragraph, type ALIGN=direction, where direction
is left, right, or center.
- Type >.
- Type the new contents of the new paragraph.
- If desired, you may type </p> to end the paragraph, but it is not
required.
[Back to top]
Saving your web page
When saving a web page, whether you are using a simple text editor or a web
software, , make sure the add the .html tag after the filename.
- TIPS:
- Name your page "index.html" to designate that page as the default page for its directory.
Thus whenever a visitor types the URL for that directory, that default page will be displayed.
- Make sure all filenames are in lowercase characters. Avoid having spaces or special symbols
on filenames.
[Back to top]
Viewing your page in a browser.
Once you're created a page, you'll want to see what it looks like in a browser.
- To look at your page in a browser:
- Open your browser software (Explorer, Netscape, etc.)
- Choose File > Open, Open File, or Open Page (just not Open Location),
depending on the browser.
- In the dialog box that appears, either type the location of the page on your
hard disk, of click Browse (IE) to find it.
- If you've clicked Browse in step 3, in the dialog box that appears, navigate
to the folder in your hard disk that contains the desired web page and click
Open.
- Click Open in the Open Page dialog box. The page is displayed in the browser
just as it will appear when you actually published it on the server.
[Back to top]
Creating Tables
- via FrontPage
- Position the insertion point where you want to insert the table.
- On the Table menu, point to
Insert, and then click
Table.
- In the Rows box, type the number of rows you want.
- In the Columns box, type the number of columns you want.
- In the Alignment box, select the position for the table on the page.
- In the Border size box, type the width you want for the table border in pixels.
If you do not want a border, type 0.
- To change the cell padding of the table (the space between a cell's border and content),
enter a number in the Cell padding box.
- To change the cell spacing of the table (the space between cells), enter a number in the
Cell spacing box.
- To change the width of the table, do one of the following:
- Select In pixels, then type the width you want the table to be in pixels.
- Select In percent, then type a percentage of the screen width you want the table to be.
Note : The properties that you specify for the new table will be used
as the default properties the next time you create a table.
- via HTML
- Type <TABLE>.
- Type <TR> to define the beginning of the first row. If desired, press
Return and Tab to virtually distinguish the row elements.
- Type <TD> to define the beginning of the cell.
- Type the contents of the cell.
- Type </TD> to complete the cell.
- Repeat steps 3-5 for each cell in the row.
- Type </TR> to complete the row.
- Repeat steps 2-7 for each row.
- To finish the table, type </TABLE>.
[Back to top]
FOR REFERENCE :
I've added these URLs for reference just in case trainees want to explore more on the HTML structure.
[Back to top]
|
