HTMLJunction - HTML Lesson 6

ASP Coding

Let HTMLJunction Program your site with ASP. Rewrite existing code or install ASP scripts! Learn more...

Visit the new
HTMLJunction Store
A place for Coders, Programmers
and Computer Buffs

Top 5 Downloads

EZNewsletter: 11096
EZGallery: 6265
EZPoll: 6114
EZUpload: 5573
EZGuestbook: 4298

Download Stats

EZHomepageBasic: 1573
EZOnlineEditor: 3885
EZMedia: 3616
EZNewsletter: 11096
EZGuestbook: 4298
EZHomepagePro: 3511
EZGallery: 6265
EZPoll: 6114
EZUpload: 5573
EZScheduler: 2224
Avatars: 346
Smileys: 229
: 34
: 1
: 1

HTMLJunction News

ASP Article - Dynamic Date Dropdown Menu.

ASP Article - Import Text File to an Access Database.

EZScheduler now available for download!

ASP Junction has just been launched!

HTMLJunction has a new store!

More News...

Avatars for your Web Site

Smileys for your Web Site

Lesson 6

Uploading with FTP
Lets talk about saving HTML files first. It is a good idea to save your HTML file and all files that go with it in the same folder.(If you have arach. v4, it will automatically do this for you!) I know I've said this somewhere before, but...in my computer(C: drive) I have a folder called My Documents and in that folder I have a folder called WebPages (See fig.1) and in that folder I have separate folders for each one of my web pages or web "sections" (See fig.2) and I when I upload, I try to keep the same structure on my server!

fig.1

fig.2

SmartFTP

NOTE: If you are using Angelfire I recommend you use the built in uploader that they provide! The first thing you will want to know is that
FTP stands for File Tranfer P rotocol. It is basically a program that allows you to upload files from your computer to the internet or download files from the internet to your computer.

There are quite a few programs out there that will do this such as WsFTP, CuteFTP, SmartFTP and FileZilla. This lesson will deal with SmartFTP as it is a good professional program and best of all it is free! If you search out forums dealing with html and the like and ask what the best FTP program is, most will tell you SmartFTP is the best...'nough said!

Once you have opened and looked over the program, one of the first things you will notice are some windows asking for an ftp address and login/password info, that should be self explainatory. The ftp address should look like fig.3

fig.3

You will also see a window that says Port, its default should be 21, I have never had a need to change it! Once you have entered the information press the

"connect" button. After it has finished downloading you should see something like in fig.4, you may have more or less folders, some may have different names but the structure should be the same!

fig.4

You will see that I have a folder called "httpdocs", if you dont have one, you should have something like "root","top", "public html" or something like that (thats if you have your own domain name, if you dont, then you are probably already in your "root" folder), The "root" folder(as we will call it) is where you put the first page or "homepage" of your web site and it must be called index.html or index.php or something like that! Your webhost may supply some way to change this to something like default.html if so make sure you do not have "index.html" as this will override default.html. For our examples we will use "index.html". (see fig.5)

fig.5

The address to that file would be "http://www.yoursite.com" or "http://www.yoursite.com/" or "http://www.yoursite.com/index.html". There are a few things to note here:

That the "root" folder is not in the address.
That there is a "/" at the end of one of them.
That all three examples are saying "look in the root folder for index.html".

When I want to add another page, what I do is create a new folder inside httpdocs or drag and drop a folder by clicking on folder in the task bar and upload the files for that page into it. (see fig.6) The address to that page would be "http://www.yoursite.com/newfolder/page2.html". There are a few things to note here also:

The address assumes that it will look in the root folder for the new folder.
You can name your second page index.html as long as your second page is not in your "root" folder.(you cannot have 2 files with the same name in the same folder)
If you do call it index.html then the address can be shortened to "http://www.yoursite.com/newfolder/", the "/" is saying look in the new folder for "index.html", otherwise you will have to include the name of the file in the address.

I would only use index.html for my homepage to avoid confusion!

fig.6

To upload using SmartFTP, right click on the folder you want to upload to and select: upload-direct-select files, then go to the files on your computer that you want to upload. (NOTE: if you hold down the "control" key, you can select more than one file to upload at one time!)

Well that about does it! If you have followed along from lesson 1 you should now have a couple of pages on the internet! If you have some scripts you want to use on your site and your not sure how to do it come on back, my next lesson should be on "scripts" or something like that!

Now that your done take a TEST