An overview of HTML

   

http://www.meyerconsult.com/htmlintro/overview.html


What doesURL mean anyway? What about HTML?

Web browser

A program, or piece of software, that runs on your computer and allows you to view web pages. The two most common web browsers are Netscape Communicator, and Internet Explorer.

Web page

A single document published on the world wide web (usually written in HTML).

Web site

A collection of web pages, usually published by the same business, organization or person.

Web server

A machine on the Internet or on a company Intranet which runs web server software (and serves up web pages).

Home page

There are two definitions. (1)The main page for a web site, or, (2) thethe page that comes up in your web browser (Netscape, Internet Explorer) when you first launch that program

HTML

This is an abbreviation for Hypertext Markup Language, the language which is used to format web pages. Many times you'll see the end of a web address ending in .html or .htm which means that the web page you are looking at is formatted in HTML. PC users who still have Windows 3.1 operating system are limited to 3 letter file extensions which is why some pages end in .htm instead of .html

URL

Uniform Resource Locator. The address for a World Wide Web page or site. Everything published on the world wide web has its own URL. When you find a web page or site that you are interested in, you can tell what its address is by looking in the rectangular white "location" or "netsite" box that stretches along the top of the web browsing window (see example below).

Web page title

These are the words that appear in the bar above your web browsing window. These words are chosen by the web page designer and are meant to be a brief description of the contents of that web page.

Bookmarks/Favorites

If you are using your computer at home, make sure you figure out how to save a bookmark or add a favorite web site in your web browser. You can then bookmark today's site in order to get back to it more easily. Please note: when making a bookmark or adding a favorite, it is he title of the web page you are on that gets saved.

Tilde character ~

Usually found in a URL, the tilde character is a Unix abbreviation which means "go to this user's home directory." If you have web publishing space with an Internet Service Provider that uses Unix, you might have a tilde as part of your URL. For example, my free web space that I get as part of my ISPs account has the URL: http://members.cruzio.com/~deana/

Underbar character _

Usually found in a URL, the underbar character is a substitute for a space. When two words are separated by an underbar, it looks as if there were a space there: fred_smith. This is used to get around the fact that you cannot have any spaces in file or directory names when publishing files for the web.


What is HTML?

HTML stands for Hypertext markup language. The way HTML works is you use tags to mark up the various elements of a web page:

  • Text
  • Graphics
  • Links
  • etc. . .

The user's web browser then interprets or  parses the tags and uses the tags along with their attributes to figure out how to display the information on the user's screen.

When parsing the tags, the web browser ignores all whitespace. What does this mean? Any extra spaces or returns (blank lines) are discarded before the browser displays the page to you.

For those of use used to word processing, where we just hit return several times if we want several blank lines, designing pages in HTML can be quite a challenge!

 


Why do web pages sometimes look different on different computers?

Keep in mind that since each user can have their web browser set to a different default font, or a different default font size, this can change how a web page displays from computer to computer.

Some older machines with older video cards can not display graphics at as high a resolution as newer machines. Many web site designers do not test their graphics on older machines to see what they look like. Some web sites are so poorly designed that somebody on an older machine cannot navigate them at all. The primary goal when designing your web site or web pages is: who is your audience?. Design the page so that all members of your target audience will be able to navigate it.

Also, the same web page might be displayed differently depending on which web browser you are using because of subtle differences in how each browser is configured to display those tags. Some browsers are more forgiving of a beginner's errors. A page that looks fine in one browser might not display at all on another! It is always a good idea to look at any page you've done using both Netscape and Internet Explorer.

An agency called the World Wide Web Consortium has been working to achieve some standardization in how browsers interpret HTML. They also provide one of the most technically correct validation services. To use this service, you must specify what version of HTML you are using as the first line of your document (you'll see as the first line in all of my examples--just copy and paste it).

Dr. HTML also provides another validation service (use the single page analysis link). Dr. HTML allows for spell checking in addition to checking the structure of your HTML.

Using validators is the best way to insure that your web page will remain viewable even as HTML continues to evolve.

 


Almost all tags have start and end tags.

 

 


With only a few exceptions, most HTML Tags have a start and an end tag. The exceptions in HTML 4.0 are:

  • The line break tag <BR>
  • The horizontal rule tag <HR>
  • The image tag <IMG>
  • The basefont tag <BASEFONT>
  • The the input tag used in forms <INPUT>

 

Although you can leave off certain end tags, what happens is the web browser then makes assumptions about where that tag should have ended which can result in strange results.

It is always better to use explicit end tags because then you are telling the browser specifically where you wanted the tag to end, and not relying on defaults which could vary from browser to browser.

Start tags always have the syntax:

<TAGNAME>

End tags always have the syntax:

</TAGNAME>

Many tags have attributes. Attributes are specified inside the start tag. If there are attributes that apply to the tag:

<TAGNAME ATTRIBUTE1=somevalue ATTRIBUTE2="someother value">

Note: Some attributes need quotes around the value. Some do not.How can you tell when you use quotes? It is simple, actually. Any time that attribute's value has a character in it other than a-z, A-Z, or 0-9, then you need quotes.




How can I know which attributes can be used inside of which tags?

Not all attributes can be used in all tags. The best way to find out what attributes can be used inside which tags is to buy a book such as:

HTML 4 (Visual Quickstart Book) by Elizabeth Castro
Peachpit Press
book (ISBN: 0-201-35493-4)

This book is user-friendly and helpful to the novice (although not technically correct in a few minor places. Appedix D (page 361) has a list of which attributes can be used inside of each tag.

HTML: The Definitive Guide
O'Reilly Publishers
3rd Edition
ISBN: 1-56592-492

This is a really technical and dry book, and may not appeal to the new user, but it is the definitive guide to what attributes can be used within tags, differences between browser interpretations, and technical problems that might arise with certain tags/browsers.

There are some tags that cannot have attributes. These are:

  • The bold <B>, italic <I> and other text emphasis tags.
  • The list item tag <LI>
  • There might be more, I can't think of any at the moment . . .

 


Always nest, never overlap

In HTML you should always close the tag you most recently opened first. Don't get the tags out of order, or you might get some very strange results, as well as having trouble getting those pages to validate!

<FIRSTTAG><NEXTTAG> The text you are marking up</NEXTTAG></FIRSTTAG>

What I usually do is put in both the start tag and end tag in and then click my mouse in between them and add the text that I am trying to mark up. That way I don't ever forget to end a tag I started.