-->
Previous Table of Contents Next


Paragraphs

What about paragraphs? There are several ways to handle paragraphs, and the rules have changed with each version of HTML. The easiest approach, though, is to use the <P> and </P> tags to mark each individual paragraphs. For example, this code has three paragraph tag pairs used:


<HTML>

<HEAD>

<TITLE> This is my Web Page! Welcome! </TITLE></HEAD>

<BODY>

<H1> This is an H1. </H1>

<P> This is the first paragraph. It is a really interesting paragraph and

should be read several times because of its content. </P>

<P> Another paragraph. It’s not quite as exciting as the first, but then

it’s hard to write really exciting paragraphs this late at night. </P>

<P> The closing paragraph has to be strong to make you feel good. Oh well,

we can’t always meet your expectations, can we? </P>

</BODY>

</HTML>

The appearance of this code in the browser is shown in Figure 53.4. Note how each paragraph is distinct and has some whitespace between it and the next paragraph. What happens if you leave out the <P> and </P> tags? Since browsers ignore whitespace including carriage returns, the text is run together as shown in Figure 53.5. So, you should use <P> and </P> tags to separate paragraphs on your page. Remember that putting lots of blank lines between paragraphs in your HTML code doesn’t matter. Browsers will ignore them and run everything together.


Figure 53.4.  The use of paragraph tags separates text into discrete chunks with whitespace between them.


Figure 53.5.  Without paragraph tags, all the text is run together.


Note:  
Strictly speaking, you don’t need together </P> tags to indicate the end of a paragraph as another <P> would indicate the start of a new one. The <P> tag is one example of an open-ended tag, one that doesn’t need a closure. However, it is good programming practice to close the pairs.

What about comments in HTML code? You might want to embed some comments to yourself about who wrote the code, what it does, when you did it, and so on. The way to write a comment into HTML code is like this:


<! - This is a comment ->

The comment has angle brackets around it, an exclamation mark as the first character, and dashes before and after the comment text. Here’s an example of some HTML code with comments in it:


<HTML>

<!- Written 12/12/95 by TJP, v 1.23->

<HEAD>

<TITLE> This is my Web Page! Welcome! </TITLE></HEAD>

<BODY>

<H1> This is an H1. </H1>

<!- This section is about the important first para tag ->

<P> This is the first paragraph. </P>

</BODY>

</HTML>

Hyperlinks

Links to other places and documents are an important part of the World Wide Web. Links are quite easy to write in HTML. They begin with the link tag <A> and end with </A>. This is an example of an anchor tag, so named because it creates an anchor for links in your document.

The <A> tag is different from the tags we’ve seen so far in that it has some more text inside the angle brackets. Here’s a sample link in a document:


<A HREF=“page_2.html”>Go to Page 2</A>

In this example, the text between the two tags is what is displayed on the screen, so the user would see the text “Go to Page 2” underlined and usually in another color to indicate it is a link. If the user clicked on it, the HREF reference in the<A> tag is read and the document page_2.html is read into the browser. HREF means Hypertext Reference, and gives the name of a file or a URL that the link points to.

You can use links either in the body of text or as a separate item on a menu, for example. This code below shows a link in a paragraph and one on a line by itself:


<HTML>

<HEAD>

<TITLE> This is my Web Page! Welcome! </TITLE></HEAD>

<BODY>

<H1> This is the first heading on my page. </H1>

<P>This is a bunch of text that is written on my home page. I hope you like

it. If you would like to know more about me, choose <A

HREF=“about_me”.html>Tell me more about You</A>

and I’ll tout my virtues for you. </P>

<P><A HREF=“biblio.html”>See Bibliography</A>

</BODY>

</HTML>

When displayed in a browser, it looks like Figure 53.6. Each link is underlined in the text to show it is a link. (Some browsers change the color of the link text; others do different things as well.)


Figure 53.6.  A document with two links in it.

When you are specifying a link to a filename, you must be sure to specify the filename properly. There are two ways of doing this: relative and absolute. Absolute simply means you give the full path name, while relative means from the document’s current location. For example, this is an absolute path name used in a link:


<A HREF=“\usr\tparker\html_source\home.html”>

Relative path references are from the current location and can use valid directory movement commands. These are valid examples of relative paths in a link:


<A HREF=“..\home.htm”>

<A HREF=“../../html_source/home.html”>

Links to other URLs are much the same as a link to a document, except you give the URL after HREF. For example, this is a link to the Yahoo! home page:


<A HREF=“http://www.yahoo.com”>Go to Yahoo!</A>

You can have as many links in your documents as you want. It helps to make the link description as useful as possible so users don’t end up at pages or sites they didn’t want to access. If you are linking to other sites, you should occasionally check to make sure that the link is still valid. Many home pages change location, or disappear from the Web, so links should be verified to avoid misdirection.


Previous Table of Contents Next