Ross Communications - HTML and web page editing help for new web site designers

HTML TUTORIALS

What is HTML
Introduction
Lesson1:Tags
Lesson2:Paragraphs
Lesson3:Attributes
Lesson4:Lines
Lesson5:Graphics
Lesson6:Alignment
Lesson7:Links
Lesson8: Tables
Lesson9: Frames
Uploading Webpages

EXTRAS

Quick Reference
Color Chart
Webpage Templates
Free Web Graphics
Graphics Optimizer
Resources
Free Software

Coffee Cup Editor. HTML editing software that is very easy to use and sells for under $50 with lifetime upgrades.

Text Pad HTML editor. Another easy to use html editor. I have used both of these programs a lot, with great results.

Core FTP is a File Transfer Program that is very easy to use and there is no cost to use the free version wich will work very nicely.

FTP Explorer
FTP Explorer is also a FTP (file transfer) program and this is at no cost as well. Very easy to use.

XPlorer is a program that will put 2 windows on your desktop and allow you to transfer files between them. Move files easily on your own desktop, Easy to use.

Same as above, just another version. Both are very good and very easy to use.

Meta Tags. This program will help you with Meta Tags on your site. You should really get to know this free program.

Did You Know
Graphics that are put on webpages need to be optimized so that the page won't take too long to load. This is done by reducing the graphic's file size in a graphics program such as Paint Shop Pro.

Lesson 5: Graphics
Putting A Picture On The Web Page
The tag for putting a picture on your web page is:

<IMG SRC="graphicfilename.gif">
It is a single tag, requiring no end tag. The IMG means "image" and SRC means "source". SRC is an attribute of IMG, it tells the browser where to find the graphic.The stuff in the quotation marks is the file name of your graphic.

Don't Forget Format
The majority of graphic formats supported on the web are either in gif or jpg format. When putting your graphic name in the IMG SRC tag always include the format it is in and always enclose it in quotation marks. Example:"button.gif" Note the dot between the name and format and that there are no spaces. Very important don't forget.

Putting Your Files In The Same Place
Put your graphics in the same folder (directory) as the html file, for instance if you keep your html document in a folder called "my pages", keep your pictures in that folder too otherwise they won't show up on your web page because the browser will not be able to find them. The same thing goes with other web pages that are linked together, keep them in the same place.

Each Graphic Has Its Own IMG SRC
Each graphic you want to put on a page will have its own IMG SRC tag:

<IMG SRC="button.gif"> <IMG SRC="button2.gif">
Result:

To put the graphics further apart from each other add this:   between the two tags:

<IMG SRC="button.gif"> <IMG SRC="button2.gif">

Result:

See the little space between the buttons? This is what   does. It is a space equivalent to one character or letter. The more you use the wider the space will be. You can also use it to indent your sentences or for a larger space between words or letters.

To put a graphic on a new line use either the or tags:

<IMG SRC="button.gif"> <IMG SRC="button2.gif">

Result:

To make your graphic go down even further add a couple of tags between the graphics or to give your fingers a break add this between the pictures:

   
Example:

<IMG SRC="button.gif"> 

<IMG SRC="button2.gif">

That will make your picture jump down more than a single tag.

Remember the CENTER tags? Use them to center your graphics on the web page:

Result:

Notice how the first graphic is enclosed in the beginning and end CENTER tags. If you wanted to center the second graphic as well, the end CENTER tag (you know, the one with the / ) wouldn't come until after the second graphic. Remember that from the first lesson?

Background
To add a textured background on your web page you will need background wallpaper which is actually a graphic repeated over and over until the screen is filled. There are a lot of places on the web where you can get backgrounds for free, I even have a few of my own right here. Now that you have a background this is how to put it on your page:

<BODY BACKGROUND="graphicname.jpg">

BACKGROUND is an attribute which goes in the beginning <BODY> tag. Substitute "graphicname with the file name of the graphic, don't forget the format or to enclose it in quotes.

If all you want is to change the color of the web page use the BGCOLOR attribute in the BODY tag:

<BODY BGCOLOR="#00FFFF">

Don't forget to enclose the color code in quotation marks (in case you are wondering, 00FFFF is aqua). And that's it, now you are ready to learn how to align graphics with text in

Lesson 6

Here are some links that have helped me

Html Made Easy is now a book! Don't spend money on books you won't understand, The Complete Html Made Easy takes you every step of the way in building a website, and it makes it fun and easy too!
More Info

XARA WEBSTYLE4

An Excellent Web Page Program

EVERYONE can make quality web graphics with Xara Webstyle, whatever your skill level. From banner ads to complete web pages, simply customize the templates.

XARA3D is the Number 1 Tool for creating stunning, professional-quality 3D web graphics. See why for yourself

ALL designers need fonts - get yours for as little as $2 US from

Links to Free Scripts

These Links are to sites that provide scripts and various other offerings to help you spruce up your web pages.

Dynamic Drive DHTML code library
Visit Dynamic Drive for free, original DHTML scripts and components, all of which utilize the latest in DHTML and JavaScript technology!

Links to Tools

These links will take you to sites that provide such things as guestbooks, Polls, Forms and a whole lot more. Scripts and programs you can add to your site to provide your users with information or get information.

BRAVENET.COMProvides many resources for web pages and is worth the visit.

Much information is provided by our State Regulatory Authority. From this link you can registar for the do not call list, or do not fax list. This site will also allow you to lodge your complaints about your local phone company. Check it out.