Put your root down

This isn't hard, it just demands that you pay attention. File hierarchy is crucial for establishing logical links. It is also crucial so you don't pull out your hair and run around the lab screaming.

 

Helpful Hints

• Slow down, pay attention to your file names, your links.
• The only thing in your root folder should be files and images FOR THE WEB. No scraps, no roughs
• Create a roughs folder OUTSIDE of your root folder.
• Let Dreamweaver do the work --Edit files (create new, delete, etc) ONLY through the file browser.
• Your first page (home page) is ALWAYS called index.html

 

Follow that red arrow. Create, delete, rename files through the file browser. This way Dreamweaver will update the links for you.

 

Two basic ways to Construct your site

The size of your site helps determine the correct method.

 

Small site (Site 1)

With a relatively small site, create directories based on your content. Then create one assets folder. In most cases, you call this /images.

The code for the above image is this: <img src="images/folders.gif" width="410" height="300" border="1">

 

If you pay attention, you can catch any silly errors by just reading your own links.

 

 

 

Larger, more complex sites

Create directories based on content but each directory has their own /images directory. This helps manage a large amount of content.

 

 

Common mistakes and things to avoid OR THE File browser is magic!

Most hierarchy mistakes are due to silly errors. More helpful hints.

• spell check. Many broken links are due to spelling errors
• include the correct file extension.
• Choose EITHER .html or .htm
• Once you've uploaded files, remember to refresh!
• Create one root folder and DON'T MOVE IT. DON'T DELETE IT.
• Delete files from the FILE BROWSER not from your jump drive!

 

LOCAL vs Remote

 

Local site

This is your root folder and the local copies of your files

 

Remote site

Your files on the remote server (these are the files accessed when your adoring fans type in your URL)

 

get and put, put and get, all the live long day.

FTP

File transfer protocall-the processing of transfering files to a web server.

 

Dreamweaver makes this easy through the FILE BROWSER window.

 

 

PUT

A very sophisticated term for PUTTING your files on the remote server. Here it is used in a sentence: "I need to put my files on the web server"

 

GET

Another very sophisicated term for GETTING (or downloading) files from the REMOTE server to the LOCAL server. Here it is used in a sentence: "I need to get my files from the web server"

 

Synchronize

This command makes sure that the local site and remote site are in synch with each other. I wish I knew an N'Synch song so I could make a joke, but I couldn't name an N'Synch song to save my life. Come to think of it, I'm proud of that.

 

Anyhow-it is periodically necessary to SYNCHRONIZE your local and remote sites. Because you want to make sure the latest versions of your files are on the REMOTE server.

 

The Put timeline

The order will go something like this

• create your files
• spellcheck your files
• Access the file browser, and connect to the remote site (you can also do this from the SITE menu)

• then PUT your files
• Include DEPENDENT files (this means any assets-like images, sounds, etc)
• Launch a web browser, type in your URL and check your work online
• Repeat as needed.

You can also PUT and GET individual files. By accessing the PUT GET buttons on the top of the file.

 

 

Dreamweaver makes it so easy!

 

practice what you know

Remember ../ and / mean something in code.

Use your file hierarchy and linking knowledge to practice creating links using this diagram.

 

 

Create a link from contents.html to hours.html

Link from contents.html to catalog.html

Link from catalog.html to index.html

Link from tips.html to index.html