Click here to go back
this is mainly an experiment with HTML, so later, I can more easily edit other web pages, or post in the Snes9x forum
Since this explains basic uses of HTML code, you may find it useful

Basics of Text Manipulation


i.e. fancy things you can do with text
Use Bold to emphasize a word
<b>This is Bold</b>
gives this:
This is Bold

Underlines is also a good way to emphasize words.
<u>This is Underlined</u>
This is Underlined

Italics is also a good way.
<i>This is Italics</i>
gives this:
This is Italics

another one, is for mistakes, or just info you want people to know, that no longer applies, like an old site to go to. It's quicker to do than rewriting the entire thing. this is Strikethrough, Strikethrough, as the word is striked through
<s>This is Strikethrough</s>
This is Strikethrough

Use each with care. as you don't want to use all 4 too often, especially on the same sentance:
This is unreadable bold, italic, strikethrough, and underlined text. looks like a mess, don't it?
Now, for web pages, all you will have, is one long line extending who knows where in the whatchamacallit page. it is really extremely difficult for any visitor to read, because they will have to scroll to the right to see it.
to avoid this, use the Break tag, which is:
<br>
so:
This is line 1<br>This is Line 2
will bring this:
This is line 1
This is Line 2

but, that can get really redundant, on larger web pages. do you really want to type out <br> for each line, and then testing to make sure it all fits on the screen?

Would you like to have the browser auto word wrap it, so that should it be too long, Internet Explorer or Opera will split it up between different lines?

This is done with the Paragraph tag or
<p>

to end the paragraph, while not necessary, the ending tag should be there, just for the neatness factor. and that ending tag is:

</p>
so, lets say you want to have this auto-wrap:
but, that can get really redundant, on larger web pages. do you really want to type out each tag for each line, and then testing to make sure it all fits on the screen?
using the paragraph tag: <p> but, that can get really redundant, on larger web pages. do you really want to type out the tag for each line, and then testing to make sure it all fits on the screen?</p>
brings:

but, that can get really redundant, on larger web pages. do you really want to type out the tag for each line, and then testing to make sure it all fits on the screen?



Making Hyperlinks, the Foundation of the Web


A hyperlink, is something within a web page that you click, to go to another web page.
This could be any web site in existance, and even lead to nowhere (by doing a fake hyperlink)
This is quite simple.
<a href="http://www.google.com">This is Google's Wonderful Search Engine</a>
gets this:
This is Google's Wonderful Search Engine
click it, and you will go to Google.
That's it!
That's all there is too hyperlinking!
well, there is a way to do it fancier, but that's later.

Using images in your Web Page


Quite simple, really. at least getting a picture in your web page.

This is done via the IMG SRC tag, and can be used for any kind of image you want. Jpegs (Joint Photo Experts Group), GIF (Compuserve's Graphics Interchange Format), PNG (Portable Network Graphics). All are quite popular formats, but the most widely used ones are JPGs, for stuff with a lot of colors, and GIFs, used for animation, or for logos

The HTML code is the same for each. A web browser knows the difference between all the formats, and you can consider all images the same, at least in the way you work with them.


<img src="http://www.cns.utoronto.ca/usg/tux.gif">
will show up as this:

or,
<img src="http://revolution.cx/images/Zelda.jpg">
gets this:


This works well, but sometimes, if the site is concerned about bandwith, they will not allow this type of direct linking. you are putting something of their's on your site. They can do it if they feel it's a copyrighted image of anything, mostly something new (latest pics of the ISS) or if they can't spare the bandwith, it costs money, and if they use more, they get charged more. So, test this first, then if you can't get it to work, put the image in a folder on your web site. preferably something like "Images", so you don't have to find half a dozen pictures whereever. then you use the Backslash / to tell the browser to look within the web server. think of it as saying "look in this subfolder, and use this file". Various ways to make a folder, but it's pretty easy on most web space providers, either click a "create folder" link, or upload an entire folder.

Now, for the images stored on your web site:
<img src="/images/tux.jpg">

Don't neglect the "Quote marks" surrounding it, or it will break everything after that, and it won't show up at all

That, brings this:


Gif Images are the same
<img src="/images/tuxlogo.gif">
brings this:


Now, you know how some places have an image, that when clicked, transports you to another site? This is done, by combining the Hyperlink tag with the image tag. just put the image tag in between:

<a href="http://www.google.com"><img src="http://www.google.com/logos/Logo_60wht.gif"></a>
brings this:

voila, a clickable link!

Now, why the border? blame the Browser. To Get rid of it, use some extra commands, whose full useage will be explained later. This command is:

IMG BORDER="0"
use like this:
<a href="http://www.google.com"><img BORDER="0" src="http://www.google.com/logos/Logo_60wht.gif"></a>
which brings: