ITEC 745 - Roderick - Fall 2005
Course PreLIMINARIES

745 Home 745 Schedule 745 Links 745 Forum 745 Helpers 745 Syllabus

The following concepts will provide a good base of reference knowledge that will help you manage the web building process. While it is true that Dreamweaver will manage these and many other details, it is important that you understand what exactly Dreamweaver is doing for you. This will allow you to better troubleshoot abnormalities and manipulate the application.

File Management

While the Dreamweaver Site Definition utility handles most file management for you, it is crucial for you to understand the basic concepts of file management so that you can better interact with the application. The most important part of this has to do with the terms "Local" and "Remote" sites. As the graphic below shows, the terms Local site refers to files kept on the computer you are working on (which may be at home, the office or a computer lab). The term Remote site refers to files kept on a Web Server, which in turn, broadcasts those files on the Internet.

Site Definition Illustration

Most webmasters use a Local site to work from so that they can perfect files they are working on and so that an open internet connection does not have to be used when working on file (such as when you don't wish to engage a modem while you work). It is recommend you also handle your work this way. When your files are ready to moved to Web Server and viewed by users on the Internet, you typically use FTP (File Transfer Protocol) to move them there. Dreamweaver's Site Definition utility handles this process for you. For adding a file to the Remote Site, you use the "Put" command (as in putting the file-blue arrow pointing up)) and for getting a file from the Remote Server, you use "Get" (green arrow pointing down). These two commands are located in the Site Definition toolbar.

 

But what happens when you may work from multiple computers at different times as your local sites? When only working from one website, it is fairly easy to ensure that the files on your local site are the latest version. However, when you may do some work from one computer, say an office computer and do more work from another computer, say your home computer, the correct versions of files can get screwed up pretty quick.

Site Definition Illustration-Multiple Computers

Synchronization

Synchronization is an automated procedure built-in to Dreamweaver's Site Definition utility that allows users to reconcile versions of files between local and remote sites. The command can be found either by select "Site" > "Synchronization" from the Site panel or by right-clicking on the folder or file you'd like to synchronize (see graphic below).

Synchronization Example

When the Synchronization command is selected, the following dialog box will appear (see graphic below). Under Synchronization, you will select whether you want to synchronize only the selected folder or the entire site. Under Direction, you select

  • "Put newer files to remote: when working from the local site, it will inpsect for newer files on the local site and move them to the remote site, updating the versions of the file there with the version from the local site.
  • Get newer files from remote: when working from the local site, it will inspect for newer files on the remote side and update the local files with that version.
  • Get and Put newer files:

Synchronization Dialog Box

A summary will always be provided for you to check or uncheck files before processing.

More Info:
http://www.macromedia.com/support/dreamweaver/site_planning/site_understanding/

http://bss.sfsu.edu/andrew/itec745/lectures/site_define.htm

What's In A Name (Naming Files)

File Names

File names are the names of the files and folders that populate your website. These are the names like "index.htm" or "bio.htm".

  • no spaces: did you not includes spaces in your names, using underlines_to represent spaces instead.
  • avoid caps: did you not include initial capital letters, attempting to keep names all lower case?
  • no special characters: did you not use special characters in your names?
  • consistency: whatever you did right or wrong, did it follow a consistency.

File Name Extensions

This question often comes up: which do I use, "htm" or "html" as an extension for my web pages? The fact is the two are interchangeable and either can be used. Windows operating systems only see three letter extensions. Either will work. What it comes back to is the rule of consistency. Whatever extension you decide to use, always use it within your site.

Naming Home Pages and Default Pages

When you visit a website, you enter the URL (http://www.cnn.com) and a page automatically opens up as the home page. In other words, you don't have to specify an initial home page (http://www.cnn.com/homepage.htm), it simply opens up for you. This is because the server has indicated an initial page naming scheme that will automatically open both for the root level (top folder) and all sub-folders. The name varies from server to server but is generally "index.htm(l)", "default.htm(l)" or "welcome.htm(l)". By naming the file appropriately, it will force that page to automatically open either for the root level (http://www.cnn.com) or for any subfolder (http://www.cnn.com/world).

Titles

Titles should not be confused with file names. Titles are what appear at the top of a browser window when the page is opened, what is saved in your Favorite or Bookmark list and are also evaluated by search engine spiders. Perhaps more importanlty, titles serve as an important direction finder for users telling them the name of the file they are looking at, hopefully hinting at its subject matter and alerting them to the overall website it is on.

Titles should let users know where they are in your site. An example is "Andrew Roderick, ITEC 745-About Me". They typically can include three components:

  • the overall site they are on "Andrew Roderick"
  • the section of the site they are on "ITEC 745"
  • the page they are on "About Me"

Consider putting the overall site name first so that when it is bookmarked, it appears alphabetically since many browser bookmarks are done that way.

Linking - Absolute vs. Relative

Hyperlinks are the vehicle for connecting web pages, both within a website and across the entire web. When you link to website or individual pages outside your website, you must use what is known as an absolute link, which, in other words spells out the entire web address. When using Dreamweaver's linking tools, all of this is handled for you. But it is important to understand these differences when you are troubleshooting problems that may arise.

Absolute: http://www.cnn.com/world
This includes the protocol ("http://"), the server ("www.cnn.com") and any subdirectory or page ("/world")

Relative links are an option for when you are linking to pages within your own website. Instead of spelling out the entire web address for every link as shown above, (which can get cumbersome), you can not include the protocol and server portion and just directly refer to the file you are linking to and it's place in the folder structure of your site.

Relative: /bio.htm or /courses/course4.htm

One command that is key to this linking syntax is "../", which indicates to move up one directory in the structure. For instance, in the file list below, if you wished to link from the file "youth/index.htm" to the file "default.htm", you would use the following syntax: "../default.htm". If you notice, the "../"indicates for the linking path to move out from the youth directory and up to the root level (or highest level) where the file "default.htm" sits.

Example File Hierarchy Structure

 

More Info:
http://hotwired.lycos.com/webmonkey/99/39/index3a_page3.html?tw=design

http://www.uwec.edu/webDev/Pagebuild/naming.htm

 

 
© 2005 Andrew Roderick. Some Rights Reserved. ( Creative Commons License). XHTML | CSS | 508
Email Instructor | Department of Instructional Technology - San Francisco State University