Dreamweaver tutorial 01: Defining A Site

Hi, Welcome, My name is Daniel Walter Scott. I am trainer here at Bring Your Own Laptop. This course is designed for people who have never used Dreamweaver before or are new to Web Design. The topic we are covering today is: How To Define A Web Site in Dreamweaver

This is the first step when it comes to creating your website with Dreamweaver. What happens is in a website, you need to have all of your elements of your website in one folder. Unlike some professions, like Graphic Design where you get to have images, logos and text all over your hard drive, to design a website you get to keep all of these things in one folder. They call it your ‘Local Folder’. What you need to do is to tell Dreamweaver using its ‘Site’ function , you define the site and tell it where that folder is kept. Let’s do this together now.

Step 1 - define the site

The first thing to do is to go up to ‘Site’ and go to ‘New Site’. You will need a new site definition for every new website you are working on. If you are working on only one website then you will only have to do this once. Me, as a freelance Web Designer, I have lots of these sites deifnied all over my hard drive.

So we give this site a name. I am going to call this one ‘Example Tutorial’. This is where you give it a name, the client name or a job description, something useful for you to find it. Where it says ‘Local Site Folder’, this is where on your hard drive your web site is going to be kept. I am going to click on ‘Browse Folder’. I am using a MAC. It doesn’t matter whether you are using a MAC or PC.

I am going to put a new folder on my desktop. You might keep yours on your documents. I am going to call this ‘Example Tutorial’. I am going to click ‘Create’ and then click ‘Choose’. So I’ve told it a site name which is ‘Example Tutorial’ and I have told it where I am going to keep this web site. So every file that I design now needs to go inside this folder.

Link your images folder

The last thing I need to do now is look at the advance settings. I need to click on the ‘Advance Settings’. If that doesn’t word click on ‘Local Info’ and you should get the right hand side looking like this. The last thing that we need to do is tell Dreamweaver where we would like to keep our default images folder. To do that, click on ‘Browse’. Now you could keep all of your images in the ‘Example Tutorial’ folder but it is very common to have a sub folder in your website you could call it ‘images’ or ‘img’. It should be a lower case ‘I’ and what ever you name it make sure that you use the naming convention that has no spaces, so don’t have a space included. So don’t use ‘*’, ‘#’, or ‘?’. These symbols can throw up problems for your website. If you have to use a space, use a hyphen instead. You could use an under score but a hyphen is more commonly used.

I am just going to call my folder ‘images’ (with a lower case ‘i’) click ‘Create’ and click ‘Choose’. So I’ve told it (in this site box at the top) where on my hard drive it’s going to be kept, and under ‘Advance Settings’, ‘Local Info’, I’ve told it where the images are going to be stored on my website.