Basics of HTML Hypertext Markup Language
part 1 | part 2 | link to html resources
- Format text, graphics, sound, and video so other computers can read or see your data.
- Permits links between documents.
- Allows browsers to interpret the information on the screen.
Part 1-Table of Contents
TagsReturn to Table of Contents Special Characters embedded in your document which allow browsers to properly display your information.
The key to using HTML is understanding tags. <b> <i> and <b>
Tags are the special combinations of letters, numbers, and symbols which tell browsers how to format and display documents you compose.
<b>This text will appear in bold</b>
| | ||
opening tag affected textclosing tags
You can use more than one tag to decide how your text will appear. For example...
<b><i>This text will appear in bold and italics </i></b>
| | || |
opening tags affected text closing tags
Adding additional tags increase your options for changing the look of your text. For example... <h1><b><i> This text will appear in bold and italics </i></b></h1> All tags should now be in lower case and except for <br>, all should have begining and ending tags.
Anatomy of a Home Page Return to Table of Contents Home pages consist of two general sections in which information is placed.
The head provides information about the URL of your Web Page and its title.
The body of the document contains all your text and graphics.
The Basic Structure of an HTML Document Return to Table of Contents All Web pages follow this simple structure...
<html> <head> <title>The document's title appears here</title> </head> <body>The document's contents appear here</body> </html>
All home pages begin with the <html> tags to permit your browser (and others') to "read" what you've composed. All of your work will appear between these two tags:
<html>
</html>
The first tag to appear between <html> are the <head> tags. The <head> tags enclose information on the URL of your page. A short descriptive title of your Web page will appear here.
<html>
<head>.. </head>
</html>
The <title> tags appear between the <head> tags Titles will appear in the title bar of your browser's window and on the user's bookmarks or favorite places. NOTE: Do not use colons or backslashes in your titles. These characters cannot be read by some operating systems!
<html>
<head>
<title>HomeTown Public Library</title></head>
</html>
The <Body> Tags appear between the last <head> tag and the last <html> tag. The body contains the information from your Home Page that is displayed by the browser.
<html>
<head>
<title>HomeTown Public Library</title>
</head>
<body>. Your data here!!. </body>
</html>
Basic TagsReturn to Table of Contents
The <h#> Tag Return to Table of Contents The <h#> tag allows you to size your text, using a "heading" format that is a certain font size, bold, with spaces above and below.
Enter the <h#> where # is a number from 1 to 6. For example...
<h1> My Home Page </h1> <h2> My Home Page </h2> <h3> My Home Page </h3> <h4> My Home Page </h4> <h5> My Home Page </h5> <h6> My Home Page </h6>
After the beginning "header" is entered and completed, you can begin to type the text you wish to appear.
<html>
<head>
<title>HomeTown Public Library</title>
</head>
<body>
Welcome to the HomeTown Public Library website!We provide access to the information of the world! </body>
</html>
The <p> Tag Return to Table of Contents To begin a new paragraph, don't use the <ENTER> key. You must type <p> at the beginning of the new paragraph and </p> at the end of the paragraph.
<html>
<head>
<title>HomeTown Public Library
</title></head><body>Welcome to the HomeTown Public Library website! <p>We provide access to the information of the world!</p> <p>Look in our Computer Catalog!</p> <p> Ask a Question at the Reference Desk!</p> <p>Some of Services include:</p>
</body></html>
The <br> Tag Return to Table of Contents The <p></p> tag inserts a large amount of space between paragraphs. To avoid this, you can use the line break option by entering <br>. Note: You do not have to enter </br> at the end of each line.
<html>
<head>
<title>HomeTown Public Library
</title></head><body>Welcome to the HomeTown Public Library website! <p>We provide access to the information of the world!</p> <p>Look in our Computer Catalog!</p> <p>Ask a Question at the Reference Desk!</p> <p>Some of Services include:</p> Reference<br>
Computerized Literature Searching<br>
Interlibrary Loan<br>
Photocopy Service<br>
</body></html>
Emphasizing Text Return to Table of Contents You can change the font size of the text with the <h#> tag. Note the default is <h3>
<p>Some of Services include:</p> Reference<br>
Computerized Literature Searching<br>
Interlibrary Loan<br>
Photocopy Service<br> <h3>Our hours are Monday through Friday, 9 am to 8 pm.</h3> </body>
</html>
The <b> Tag Return to Table of Contents You can also have your text appear in bold face by using the <b> and </b> tags.. <p>Some of Services include:</p> Reference<br>
Computerized Literature Searching<br>
Interlibrary Loan<br>
Photocopy Service<br> <b>Our hours are Monday through Friday, 9 am to 8 pm.</b> </body>
</html>
The <i> Tag Return to Table of Contents You can have your text appear in italics by using the <i>; and </i> tags.. <p>Some of Services include:</p> Reference<br>
Computerized Literature Searching<br>
Interlibrary Loan<br>
Photocopy Service<br> <b>Our hours are:</b> <i>Monday,</i>9 am to 6 pm<br>
<i>Tuesday,</i> 9 am to 9 pm<br>
<i>Wednesday,</i> 12 pm to 9 pm<br> </body>
</html>
Link to Part 2 | Link to HTML Resources
Adapted from the simplified revision of the HTML Primer by NCSA found at this address:
http://archive.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimerAll.html
Credit for the organization of this demonstration of tags goes to Paul S. Hoffman and Molly Youngkin of the National Network of Libraries of Medicine/Midcontinental Region, Omaha, Nebraska.Page researched and written by Rosalind F. Dudden, Health Sciences Librarian, Gerald Tucker Memorial Medical Library, National Jewish Health.
Developed for the course, website Planning and Basic HTML, for the Central Colorado Library System in 1996; Revised 1997; Revised 2003.
