Home
Username:
Password:
Adobe Dreamweaver CS5 Tutorials

Site Setup / Project Step 2: Site Setup

Subtitles of the Movie

Now that you've been introduced to the Dreamweaver Interface and are comfortable finding your way around the workspace areas in Dreamweaver and you've chosen some potential color schemes to work with and received some site setup tips, you're now ready to set up your Dreamweaver site for the course project. This is a pretty straightforward procedure, but very important so we're going to go slow and steady. A mistake here can cost dearly in lost time and frustration at all stages of your Web work. Start off by designating an area on your computer where you're going to create all of your Site files. Give this a name such as Dreamweaver CS5, or first project or my website or a descriptive name for the actual site. Inside of this folder create an images subfolder with a lowercase i. Also, create another folder outside of the project folder called Work Files. This one is inside my project files just for demonstration purposes, but go ahead and move this out. Usually I place the project folder and the Work Files folder in the same major folder or on the Desktop somewhere. Make sure that all of your images go in your images subfolder. There's an image right here, notice, that I'm going to place in the correct location. You can probably use my project files folder as a model. Notice that you're going to place all HTML files in this project folder, all your script files, your css files. This'll work for your first few Dreamweaver projects because they'll be very small. You're not going to have that many HTML and css files, but as you work with more ambitious websites you can go ahead and subdivide your project files folder into subfolders based, perhaps, on content. It's very important, however, that all your images which include PNG files, JPEG files, GIF files, are stored safely here in your images subfolder and, perhaps most importantly, the mistake that most students make is that the Work Files folder contains files that don't go up on your host. They won't actually be a part of your website. These may be Photoshop files, they may be PNG files that are not ready for the Web Browser. In this case, I have a Wireframe PDF, or perhaps a PowerPoint diagram that will not be part of the final website. You separate these Work Files because everything in the project files folder will be uploaded to your host. Once you've established a location for your project files and you've organized this folder correctly, you're now ready to set up the Site definition in Dreamweaver. Start by choosing Site from the Main Menu, New Site. Go ahead and here in the dialog provide a descriptive name for your site. My first project. So make this descriptive. You can include spaces and capital letters. This is just to identify this site from other sites here in your Dreamweaver application. Then, most importantly, you need to define your Local Site Root Folder. This will be the folder that you just established and organized. In this case it's going to be in my Work Files folder, my project folder, so if I go to my VTC master folder, Dreamweaver CS5, Work Files and then right here, project files, will be the Local Site Root folder for my project. Click on Open and then click on Select. Before you close this dialog or move off to the Servers Category, make sure that this Local Site Root Folder is correct. That should be an absolute path, probably somewhere on your hard drive. This is probably longer than it needs to be. I often recommend students just place this folder in your C drive. Don't place this folder on the Desktop. Don't place it in the My Documents area. The problem with choosing the Desktop, or My Documents, is that you don't really know where physically that folder resides on your hard drive. The next step is to set up your Servers, your Remote Location, for your website. If you're going to have problems, probably this is where it will be. In fact, so many new Dreamweaver users have problems with this aspect of Site Setup that Adobe finally kind of separated this. You don't have to set up your Servers to get started working in Dreamweaver, you just need to set up your Local Site Root Folder and give it a name, but if you have established a host for your project website, then go ahead and follow the rest of the instructions in this movie. If you haven't established a host and don't want to, you want to work locally, then you can go ahead and skip ahead. Click on the Plus icon there and in the Basic tab, give it a Server Name. Choose your Connection option - either FTP, SFTP, Local-Network, WebDAV, or RDS. Most of you will probably do FTP. Then get from your host the FTP Address, the Username and the password. This is usually where students struggle. You may need to contact your host to get them to tell you specifically the FTP Address. They use different terms for this - hosting address, server address. This will not be your URL to your website but will be the address to the FTP Server where you can start uploading your files, so don't know what that is usually. Sometimes it's your Domain Name, sometimes not. Sometimes it's a series of numbers separated by dots. It's really hard to predict. Best to get that from your host. Once you've entered FTP Address, Username and Password click on the Test button to test to make sure that connection is working. Let me demonstrate with one of my existing sites here. Here is the connection information for current project: 69.89.31.184 is my FTP Address, Username User and there's my Password. Click on the Test button and I get this message: Dreamweaver connected to your Web server successfully. Once you get that you can go ahead and Save the connection information and that will then close the dialog and bring you back here to the Servers Category of the Site Setup for your Dreamweaver site. Click Save to close that dialog and then what Dreamweaver will do is update the Site Cache for that project, bring you to the Manage Sites dialog, click Done. And now you're ready to move on to the next movie.

Tutorial Information

Course: Adobe Dreamweaver CS5
Author: James Gonzalez
SKU: 34157
ISBN: 1-936334-48-8
Release Date: 2010-08-31
Duration: 10.5 hrs / 121 lessons
Work Files: Yes
Captions: Available on CD and Online University
Compatibility: Vista/XP/2000, OS X, Linux
QuickTime 7, Flash 8

VTC Sign up & Benefits

  • Unlimited Access
  • 98,729 Video Tutorials (23,265 free)
  • Video Available as Flash or QuickTime
  • Over 1026 Courses
  • $30 for One Month Access
  • Multi-User Discounts Available