Hands On Web Site Development

The Central CAPT web site has moved to be part of a new National CAPT web site. In 10 seconds you will be automatically redirected to http://captus.samhsa.gov/central/central.cfm -- Use this form if you have any questions.

Paul Zobitz, Central CAPT

This document was derived from a presentation given at Technology and Prevention: Working Together for Results on June 14, 2001. The headings relate to the notes given at the presentation.

A Brief History of the Internet

700 BC -- Homing pigeons carry messages in ancient Greece.
1860 -- The Pony Express carried mail between St. Joseph, MO and San Francisco, CA.
Today -- Through the use of Hypertext, users across the globe can access large amounts of information in a variety of formats 7x24.

What's the Difference between the World Wide Web and the Internet?

The Internet is a worldwide computer network that links thousands of smaller networks to allow information exchange
The World Wide Web (WWW) is an Internet service, based on the HTTP protocol that allows publishers to post data in richly formatted pages and users to navigate information on servers around the world through a system of hyperlinks.

The Internet and the WWW are two different inter-related concepts. While they are often used interchangeably in common speaking, knowledge of the difference between the two is important when doing Web development. The WWW is basically one way of accessing information on the Internet.

What is HTML

HTML = Hyper-Text Markup Language
HTML is the language used to create information on the Web (or Web pages).
HTML is a set of tags developed by the creators of the Web to mark the structural elements of text documents.

HTML pages are basically plain text files that contain special programming code. When these pages are viewed in a browser, the code tells the browser how to format the text and graphics on the page.

Why should I care?

Knowledge is power
Understand what is possible with a Web page
Ensure Web designers don't sell you the Brooklyn Bridge

It is important to understand HTML if you are planning to create a Web presence for your organization or company. A basic understanding of HTML will ensure that you know some things that can and cannot be done with a Web page. It is also important to know some basics so that you will have greater confidence when dealing with Web designers. Knowledge goes a long way in ensuring that a Web design firm will not attempt to sell you something that you either do not need or is not possible.

Why Publish HTML pages?

Communicate Information
Educate
Advertise

Publishing HTML pages, or creating a Web site is an important way to reach people with your message.

What Kind of Software Do I Need?

Notepad, WordPad, or any text editor
Microsoft Word or any other word processing software
Any other program that offers an "export to HTML" feature
Graphical HTML editors
- Allaire HomeSite
- MacroMedia Dreamweaver
- Microsoft FrontPage

To create HTML pages, one really only needs a text editor, but there are many programs available. Most software (e.g. Microsoft Word, WordPerfect, etc) allow one to save or export documents to HTML format. On the high end, there are specific programs that make it easy to create HTML code.

Do I Need Any Other Tools?

Computer must have a browser
Internet Service Provider (ISP) with Web space, to make your pages viewable by others

A browser allows you to actually view Web pages. For creating your own Web site, you must have a place to put the files that is connected to the Internet. This space where others go to see your Web pages is called a Web host. Most ISPs have limited Web space available. If you are planning on creating a Web space for a company, it is best to look into a company that can provide the Web hosting for you.

HTML Basics

To view HTML code, choose the "View Source" command from the browser
Look of a page is controlled by tags
All HTML tags are in brackets
e.g.
```
<HTML>
```
Most tags need to be turned on and off
e.g.
```
This text will be in bold
```

The first step in understanding HTML is to simply take a look at the actual code for a web page. If you view the source of this page, you can begin to gain an understanding of HTML.

HTML Basics

Tags can be upper or lower case, but upper case is most common
HTML files should be plain text files
HTML files must end with .html or .htm extension
To view an HTML document saved locally, use the "Open File" command, not the "Open Location" command from the browser

HTML Tags Covered in Session

```
<HTML> </HTML>
```
-- Used at the beginning and end of document
```
<HEAD> </HEAD>
```
-- Page header information (does not show up in browser)
```
<TITLE> </TITLE>
```
-- What appears in the browser window's title
```
<BODY> </BODY>
```
-- The "meat and potatoes" of the Web page
```
<H1> </H1>
```
-- Used to denote a heading
```
 
```
-- Paragraph Marker
```
 
```
-- Bold text
```
 
```
-- Underline text
```
 
```
-- Italic text
```
 
```
-- Change font attributes
```
<A HREF="http://www.site.com"> </A>
```
-- Link to another Web Page
```
<OL> </OL>
```
-- Ordered List (creates a numbered list); each item is denoted with a
```
<LI>
```
tag
```
<UL> </UL>
```
-- Unordered List (bulleted list); each item is denoted with a
```
<LI>
```
tag

Other Fancy Effects

Find out if you can add dynamic content to your Web site
Most dynamic content comes from Plug-ins or CGIs
Use forms to collect data or send an email

For more information on dynamic content, check out Adding Fancy Stuff to Web Pages

For More Information

These links provide additional information on HTML. You can also go to your local bookstore or library to find a plethora of books that cover all aspects of HTML and Web page creation.

Putting the Pieces Together -- www.ccapt.org/ptpt.html
A Beginner's Guide to HTML -- archive.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimerPrintable.html
HTML Resources Guide -- www.webcom.com/html/
Web Developers Virtual Library -- www.wdvl.com