... Recommend this series to a friend.
We're getting there. We covered making a link to another website, making a link on one of your pages to another page on your website (provided it's on the same level of your file manager), and now, we'll be linking to a higher level. That means IF you had pages in sub-directories, which is not the case now, how would you link to your homepage (index.html)? Answer: the tag would have to include your entire website address (url) ending with index.html ... in my case it would look like:
<A HREF="http://geocities.datacellar.net/buddychai/index.html"> Name of Link </A>
Well, we are back on your homepage (index.html) editor. No, I didn't forget your second page; that's a page where you will play around by yourself now that you are getting the basics of html coding. Now the question is how we link from one part of a page to another part of the same page. I'm sure you've seen examples of pages where they have a link on the top of the page directing you to another part of that same page, or a link wherever on the page link you "To the top" … how's that done? The tags are very easy. Where you want the link you place the following:
<A HREF=#whatever> TO WHEREVER </A> ... this is the anchor link.
I say "whatever" because it can be any few letters or even one number; but it has to have the pound sign in front of it. At the target (where you want the link to take you), you place the following:
<A NAME="same as in the original link"> ... this is the target link.
Meaning that whatever the "whatever" is in the original link, it goes between the two quotes in the target tag, only NO pound sign. Confusing? But that makes good sense to me. Anyway that's it. Now you have a link on a page to another section of that same page.
Now the question is how we link from one part of a page to another part of another page. Not too different from what we just did, only now we have to include some additional URL material. If it is to another page on the same file manger level, than code it like this (if it's to a page on another level, then the full URL is necessary):
HTML Index Section … spelled out as follows:
<A HREF="00.html#INDEX"> HTML Index Section </A>
Notice how the above link takes you to *within* the opening page, directly to the table of contents. Just thought I'd point it out to you. Now how did we get the link to go just to that spot?
The above is what you put on the origin page; what you would put on the particular section of the target page is the same as we did when moving within a page (like we did above when linking within any one page). You would label that section with this:
<A NAME="same as what you have on the original link"> ... "same as what you have on the original link" can be a number or a series of letters. So in this case, the target section would have this tag before the particular section you want to link to:
<A NAME="INDEX"> … no need for any closing tag here, and that's it.
GeoCities by default opens your pages with their font. But you want your pages to reflect your particular taste. So you decide what you want. Now how do we instruct the browser to show your page with your choice of font? First, in order for you to see it, you have to have that font in your system.
You can see what you have with Start, Settings, Control Panel, Fonts. That is really a shortcut to where all your fonts are stored (which is your Windows folder). No matter, for you to see it on your pages, you have to have it; same with anyone else viewing your pages. So it smart not to choose an exotic font that nobody has. Keep the choice popular.
I've chosen "comic sans ms" … it appealed to me, no particular reason. Here is the html tag to show a page with that font. If you want the entire page to show up with that font, then the best place to put that tag is right after the "body" tag.
<FONT FACE="comic sans ms">
You can indicate the size of the font with this tag:
<FONT FACE="?"> text </FONT> … you would place a number where the ? is.
The type and size can be combined in one tag as follows:
<FONT FACE="comic sans ms" SIZE="4">
I happen to use size "4" on my pages; you can try different sizes for practice. It's very important is that for any "font" tag, you have to have a closing tag … </FONT> … whether it's for one letter, one word, or the entire page. If it is for the entire page, then the closing tag would go right before the closing "body" tag. Remember, "first in, first out" … remember? So the entire editor in your opening page would look like this (you might just use this as an example):
Try to understand what is happening with these tags, try to understand what each tag is doing; it's a great way of learning:
<HTML>
<HEAD>
<TITLE> My Webpage </TITLE>
</HEAD>
<BODY BACKGROUND="URL OF YOU PAGE/Bkg/tanbkg.gif" TEXT="#003300" LINK="#FF0000" VLINK="#006633" ALINK="#33CC33" MARGINWIDTH="50">
<FONT FACE="comic sans ms" SIZE="4">
<CENTER> <H1> Greetings from the Land of Oz </H1> </CENTER>
This is paragraph 1. <P>
This is paragraph 2. <P>
This is paragraph 3. <P>
<CENTER>
<IMG SRC=Files/eyes.jpg"> <BR>
Hey you out there … I'm watching you. <BR>
And I see everything you are doing. <BR>
Shame, shame, shame on you. <P>
Here's an interesting link …
<A HREF="http://geocities.datacellar.net/buddychai/Html/01.html"> HTML </A>
… sure hope you gain from it.
</CENTER>
</FONT>
</BODY>
</HTML>
Note that I made spaces between tags, and between tags and text, only so you can see the elements (attributes) better. But be sure you retain all the spaces you see that are WITHIN any two brackets ... those belong there. For example:
In you editor it isn't necessary to skip any lines; you work can look like this:
<HTML>
<HEAD>
<TITLE> My Webpage </TITLE>
</HEAD>
<BODY BACKGROUND="URL OF YOU PAGE/Bkg/tanbkg.gif" TEXT="#003300" LINK="#FF0000" VLINK="#006633" ALINK="#33CC33" MARGINWIDTH="50">
<FONT FACE="comic sans ms" SIZE="4">
<CENTER> <H1> Greetings from the Land of Oz </H1> </CENTER>
This is paragraph 1. <P>
This is paragraph 2. <P>
This is paragraph 3. <P>
<CENTER> <IMG SRC=Files/eyes.jpg"> <BR>
Hey you out there … I'm watching you. <BR>
And I see everything you are doing. <BR>
Shame, shame, shame on you. <P>
Here's an interesting link …
<A HREF="http://geocities.datacellar.net/buddychai/Html/01.html"> HTML </A>
… sure hope you gain from it. </CENTER>
</FONT>
</BODY>
</HTML>
Or like this; the page will look the same. Only problem is that it becomes more difficult to edit (make changes) when necessary ... but it will still work:
<HTML><HEAD><TITLE> My Webpage </TITLE></HEAD><BODY BACKGROUND="URL OF YOU PAGE/Bkg/tanbkg.gif" TEXT="#003300" LINK="#FF0000" VLINK="#006633" ALINK="#33CC33" MARGINWIDTH="50"><FONT FACE="comic sans ms" SIZE="4"><CENTER><H1>Greetings from the Land of Oz</H1></CENTER>This is paragraph 1.<P>This is paragraph 2.<P>This is paragraph 3.<P><CENTER><IMG SRC=Files/eyes.jpg"><BR>Hey you out there ... I'm watching you.<BR>And I see everything you are doing.<BR>Shame, shame, shame on you.<P>Here's an interesting link ... <A HREF="http://geocities.datacellar.net/buddychai/Html/01.html">HTML</A> ... sure hope you gain from it.</CENTER></FONT></BODY></HTML>
I'm sure you understand that this little doodad >< is a closing bracket >, next to an opening bracket <, and if you can understand that conglomeration of tags and text, pal, you've come a long way, and soon you'll be teaching me.
We return to the … Table of Contents … enjoy your work.
And if anything to add or correct - - I certainly would appreciate it.
Return to ... Navigator ... that's it.