Wood County Free-Net's Official

HTML Help Page

Lesson 13

Comments | Targets | | Bordered Backgrounds



Sometimes it's important to write comments in your code that only you can see. These comments will NOT show up on your page. Maybe you want to know where the code begins/ends for your Guestbook or something else on your page.

One very important thing to remember here is that inside this comment code you cannot, I repeat CANNOT insert any HTML codes, it will not work!

The code looks like this: <!-->

Very easy, but everything typed in must go between the two dashes. Most of the time we add more dashes to make the item stand out in your HTML document. Like this:

<!--------------BEGIN EDITING HERE-------------->

That is how it will look in your HTML document, but it will not show up on your page you are creating.



Did you ever wonder how others can make the links they put on their pages open up into another, brand new, browser window? Or...if the window is a frame (has more than one opening on the screen, like my homepage), how they can make the link open up in a full window instead of the other half of the frame? These are called Targets and are inserted in the Link address code.

Let's do this one first, since I feel it is the most common. We have a link on one of our pages, we want the visitor to visit the link (that's why it's there), but we don't want to lose our visitor off of our page. This code will open up the link into a brand new browser window, leaving your window open behind it. This way when they close, or leave, the site you sent them too, your site will still be in another open window. Okay, let's try this.

This first code will be: TARGET="_blank", yes you must use the underline in front of the word blank, and the word blank must be in lower case letters.

Here is the code inserted into a link code:

<A HREF="http://www.wcnet.org/~kbrandt" TARGET="_blank">Brandt Home Page</A>

This is what it will look like: Brandt Home Page, try it out click on this one to see it open into a new browser window. Now go back to the first Brandt Home Page link (above) and click on that one...it just changes the current page to the new page (mine), then you would have to use the Back button on the browser to get back to your page.

Next...say you have frames on your homepage and you want to let your visitor view the page you will be sending him/her to, view that page in a full screen instead of inside one of your frames. Frames will do that if you do not use these codes. If you have links inside your frames they will load inside that frame.

Again, look at my homepage, see the smaller frame on the left and the main (or larger) frame on the right? If I just put regular links on the left side of the screen, the window the links would open up into would be that very narrow side of the screen. Also, if the links on the right were not told where to load they would load on the right (that side is larger, but I like my visitors to be able to see the whole page on the whole screen).

So...to make the link load into a full page, but use the same browser window we would use TARGET="_top". Again you need the underline before the word top and the word top must be in lower case letters. This is the one I have used on most of my pages that you see indexed on the left side of the frame on my homepage. If you click on one of these items, they will load on a full page, but use the same browser window.

Well....maybe you want the left side of the screens links to all load into the main (or right side of the screen). This way your visitor always has your links on the left side of the screen to use. One problem could arise here though...if the new page also has frames. Their frames will load on the main screen inside your frames and then you could have a royal mess. But, some still like this option, and it can work if you don't have any outside links on the new main page.

To make the new page load into the main side of the screen you would use: TARGET="main". Note: no underline here and yes main must be in lower case letters.



Some backgrounds you might want use on your pages could have a left border (some even have top borders on them). These borders will usually vary in size from an inch to two inches. You don't want them to be too large because it takes away room from your print and graphics on the right side.

If you just key in your code for your page as you normally would the text and graphics will overlap onto the left border of the page. This looks very tacky and makes it hard to read the page. Check out this example page to see what I mean. Yuck! You can't even read the words on the left side!

Well, let's fix that, OK?

The code is part of the Table Code, which is in another lesson.

This is the code you would insert on your page, right after the BODY tag:


Ok...see where it says WIDTH=80% in the above code? You can change this percentile to whatever is needed for the particular background. Play around with the percentage until your text is centered on the right side of the screen, but not overlapping onto the left side of your border.

This code is creating a table on our page with a width of 80% of the page and aligning it on the right side of the screen, leaving the 20% empty on the left side of the screen, where the border is on the background.

Now at the bottom of your page just before the closing HTML and BODY tags copy and insert this code. </TD><TR></TABLE>

This last code is closing out our table on the page and does need to be at the very bottom of the page. We want everything on the page to be between these two codes, which are still inside our Body and HTML tags.

Ok..now check out this page to see the better version.

Here are some background borders you can save and use for your homework assignment. Or, choose something when you are surfing on the net, check out my Graphics Page.

NOTE: These are not the full files, they are cropped off. You will need to click on the image you like to go to the actual graphic. When on that page right click on it and save as...

Eagles Butterfly
Sunshine Teddy
Yellow Flowers

Back to HTML Help Index Page    Question Form

Created and Updated by Kathy Brandt ~ 2/26/2005