Dreamweaver Uploading and Final Touches

Now that you can build an entire site in Dreamweaver, were going to learn how to check all of your links, how to upload your site, and how to use Dreamweaver together with a wonderful program called the Offline Explorer to figure out how your favorite sites are built.

Backing-Up Your Sites

It is super-death-incredibly-important to have a hard back up of any site you build. You should keep a back up outside of your computer CD-R, or something. Dont think of the copy on your server as a back up. Something could go wrong on your local computer, corrupting your files. You might unknowingly upload those files, replacing the good ones. The Academy's web design course strongly recomends backing up your site.

Checking Links

Lets say that youve built a huge site; you upload the site and show it to your client. Youre very proud. Ten minutes later, your client calls you and tells you that links arent working. How cool do you look now?

Dreamweaver has an automatic link checker at your disposal. It wont fix links for you, but it will tell you which ones are broken. If you have a dial-up connection youll need to sign on to the Internet before checking links.

To check the links in your site, click:

SITE-> CHECK LINKS SITEWIDE

Dreamweaver will run a report. Have fun fixing links!

Adding Meta Tags

Of course youll want to add meta tags to your site so that it can be found on the Internet. You can add keywords and descriptions, as well as meta-jump tags by clicking:

          INSERT-> HEAD TAGS

Uploading Your Site

Dreamweaver comes with a fully functional FTP program that you can use to upload your pages. Before you upload, you must have a site host and a domain name. For advice on choosing a host, see "Choosing a Host and Uploading" chapter in the HTML section.

**NOTE: If you have any problems uploading your site, immediately, pick up the phone and call your hosting services tech support. Often a host has unique server configurations that they "forgot" to tell you about. Dont suffer needlessly. I once toiled for three hours because the server I was working on needed a ".html" extension and I was using ".htm".

To upload your page, you will need:

1.      Your FTP Host Address
Your hosting service will need to give this to you. It will usually look like: "ftp.yourhost.com"

2.      Your User/Log-in Name
You will designate a user/log-in name when you originally get your hosting service. This is the same kind of user name that you choose when signing up for membership at a website.

3.      Your Password

**Sometimes you also will need a "Host Directory". This refers to a folder other that the main root folder that your site must be kept in. If they dont mention it, you probably dont need it.

Configuring Dreamweavers FTP Program

Youll need to set Dreamweaver up to connect correctly with your host.

1. Open the Define Sites window by clicking SITE-> DEFINE SITES
2. In the Define Sites window, choose your site and click Edit.

The Site Definition window should pop up.

3. On left "Category" column, choose Web Server Info
4. In the "Server Access" pull-down, choose FTP

5. Fill in the FTP Host, your login, and your password

The FTP Host will direct Dreamweaver to your Host server, your login and password will direct Dreamweaver to your online root folder.

6. Click OK

If The Server is On-Site

Sometimes youll be working at a company that has their own server. In this case you wont have to upload over the Internet. To load onto a local server, you'd usually just move files around in the office network. You'll have to find out which folder the website is kept in. Ask your client or whoever maintains his server. In Dreamweaver, you can set the site's folder on the office network by clicking:

SITE-> DEFINE SITES-> choose your site-> EDIT

After clicking  EDIT, you'll choose REMOTE INFO from the left side of the window, and then choose LOCAL/NETWORK from the "Access" pulldown menu. 

By clicking the little folder next to the "Remote Folder" field, you'll be able to navigate through the network and choose the site's folder on the server.

Uploading Your Site

Youll upload the site from the Site Files View (F8)

You need to be signed on to the Internet to upload files.

To upload your whole site, you can click:

          SITE-> PUT

"Put" refers to the action of placing your site on the server.

Uploading Individual Files

You dont have to upload the entire site every time. To upload one item in the Site Files view, simply click it and click the Put Files button. Getting a file from the server is as easy as selecting it and clicking the Get Files button.

When you upload a page, Dreamweaver will ask you if you want to upload its Dependent Files. Dependent files are files (like images) and that are required for the page to display correctly. If you choose to upload dependent files, Dreamweaver will find any file attached to the page and upload it for you. How nice.

Uploading a Page From the Design View

You can upload a page directly from the design view. By utilizing this feature, you can avoid forgetting to upload a page you just worked on. It happens.

At the top of the design view click the upload/download arrows, and choose Put.

Automatically Uploading Changed Files

Dreamweaver will keep track of whats newer on your machine than on the server. If you tell it to, Dreamweaver will upload everything youve worked on since you uploaded last time. It calls this process Synchronizing Files. To synchronize files, click:

          SITE-> SYNCHRONIZE

You will have to choose if you want to download or upload files, and whether you want Dreamweaver to delete files on the host that it cant find on the local root.

Note about Uploading

It is very important to know that, while uploading, Dreamweaver doesnt ask you if you want to replace older files with newer ones, it just does it. If you are not sure that you want to permanently change a web based file, save your local file with a different name.

Using Offline Explorer to Figure Out How Sites Are Built

When building your first websites, you need to analyze how other professional sites are built. If you pay attention to sites that you like, you can avoid a long learning curve. Simply examine sites you like, and learn from them. If you like the way theyve built a nav bar, then build one like it. If youre an artist, itll be easier for you. If youre not an artist, learning from (and to a point, mimicking) other sites is essential.

Sometimes its hard to figure out how a site was built just by looking at it. Thats where handy programs like the Offline Explorer come in. They download a whole page or site, including all graphics, code, and components. You can open those pages in Dreamweaver and see how theyre built!

Offline Explorer is available at:

http://www.metaproducts.com

The Mac equivalent, Web Devil, is available at:

http://chaoticsoftware.com

Both softwares are shareware. You can use them for free for a limited time and pay if you like them

Setting a Save Folder

The first thing youll want to do after opening is set a folder for the Offline Explorer to save its files to.

1. Click:

VIEW-> OPTIONS

2. In the Options, click Directories (under advanced)

3. Click "Move" to specify the download directory. The download directory is where the offline explorer will save all the files it downloads.
4. Click OK

Downloading a Site

Downloading a site is relatively easy. All you have to do is tell Offline Explorer the site address, and how many levels deep to load. For example, if you wanted Offline Explorer to load the page and all pages linked to it, you would load 1 level deep. If you wanted to download all pages linked to those pages too, you would load 2 levels deep, and so on. If you only wanted to load the page addressed, you would load 0 levels deep.

To download a site/page:

1. Type the address of the page to be loaded in the address bar.
2. Type the number of levels to load in the "Level" field (next to the address bar)

3. Click Download

The explorer will download like crazy. This may take a while if you choose even a few levels deep.

Open Downloaded pages in Dreamweaver

You just downloaded a site, including all the images, folders, text, and other elements. Now you need to open it in Dreamweaver, right?

1. Define a new site in Dreamweaver.
2. The downloaded files are now contained in the folder specified in the "options" window of the Offline Explorer. In that folder there is now another folder labeled with the URL downloaded. Set this "URL" folder as your new sites root folder.
3. In the Site Files View (F5), Youll be able to double click the page to look at. Sometimes it takes a bit of looking around to find the correct page. Look around and click files with .htm following them. Remember that "index.htm" is sometimes called "default.htm".

 

Thats it! Now you know Dreamweaver. Go practice!

| Back to Courseware