Basic Web Publishing M. Scott Gartner 7/15/98

Introduction What will I be covering? What won’t I cover? Should you create a web page?

Steps to creating a web site. Get an ISP account and an address Get some web space –5Mb should be plenty Get an editor –notepad –word/wordperfect/other word processor –HTML authoring program HotMeTaL, Front Page, HotDog, etc.

More steps Have a goal –Getting a job –Selling a product –Research –Publishing your own writings or graphics Design the site Upload the site to the ISP’s computer Update it often

What is a web site? A set of files (the part you provide) –HTML –graphics –image maps –Java class files –etc. A computer connected to the Internet. A web server (Netscape, Apache, IIS)

Creating your first web page A minimal example A minimal example This is the body of the page

What is a tag? Enclosed in angle brackets “ ” (less-than and greater-than signs) The name of the tag. A list of zero or more attributes For example: – Tag names are not case sensitive – is identical to,, or

Closing tags Uses the same tag name but begins with a forward slash – Some enclosed text Most tags in HTML have both tags and closing tags Tags can enclose other tags – Bold and Italics Some have only the opening tag –,

Back to the minimal web page the tag pair encloses the entire page –Text outside of this tag may not be processed by a web browser. the tag pair encloses the page header –Text within here will not be displayed within the web page

Header tags Some tags only make sense in the header sets the window title denotes information about the page There can only be one section in a web page.

Body tags Text formatting tags Form tags Graphic display tags Java applets JavaScript or VBScript Basically anything that doesn’t go in the header.

The Body Tag has attributes Background image – Various colors –Background –Foreground –Links –Visited links –Active links

Colors in HTML Common names: “red,” “purple,” “gray,” etc. Hexadecimal triplets Red, Green, and Blue are written as: –#RRGGBB For example: –White is #FFFFFF, black is #000000, and yellow would be #FFFF00

Body tag using color background color will be black foreground color will be white link color will be apricot –

Character formatting tags strong - - usually bolded emphasis - - usually italicized cite - - usually italicized usually fixed width tags –keyboard -, sample - –code -, typewriter - bold - - bold italic - - italic

Font size and color range from 1 (small) to 7 (large), default 3 Seven, Six, Five, Four, Three, Two, One Font colors are hex triplets or color names Black, maroon, green, olive, navy, purple, teal, gray, silver, red, lime, yellow, blue, fuchsia, aqua

Paragraph formatting All white space is compressed Paragraphs and breaks must be specified Indenting and other spacing Organizing the page

Section tags division - paragraph - break - nobreak - heading tags levels 1 (largest) through 6 (smallest) – This is a large heading – This is a small heading

Special characters

Preformatted text Returns and space for formatting Tab support Fixed-width characters Displays any tag except

Comments Can be placed around other tags – This header is hidden -->

Separators Produces a horizontal line Width and height of line can be controlled – width can also be a percentage of browser width –

Images A file in the HTML directory – A file in a sub-directory – A file at some absolute location –

What formats to use GIF - Graphics Interchange Format –Limited to 256 colors –Useful for cartoon style graphics JPG - Something –May be millions of colors –Better compression, but “lossy”

Hyperlinks Also called “anchors” Transfers control to another HTML file Text to highlight Another file in the HTML directory – A file in a sub-directory –

Conclusion Writing HTML is easy Creating a web site is hard Keep it simple Use tools where you can HTML links on my web site: – Questions to me at:

Basic Web Publishing M. Scott Gartner 7/15/98