1 - Site definition in Dreamweaver

Questions & Comments

Leslie Bauman - 1 year ago

where is the video

Administrator Tayla Coman - 1 year ago

Hi Leslie, the videos are directly above this comment section, can you not see them?

Leslie Bauman - 1 year ago

no i don't see any links for videos

Leslie Bauman - 1 year ago

except for the one you put in your response but nothing on the page itself

Leslie Bauman - 1 year ago

i switched to chrome from safari now i see the video
thanks for your help
didn't load in safari

Administrator Tayla Coman - 1 year ago

Okay no worries Leslie.

younes O - 1 year ago

hi i was not able to download the files

Administrator Tayla Coman - 1 year ago

Hi Younes, Does this work? https://www.dropbox.com/s/7rjj6jsyf25jqzm/Dreamweaver%202014.zip?dl=0

Mike Cranfield - 1 year ago

Hi Guys, So quick question?

After taking this tutorial (I think) I built my website - www.bda4sale.com

I am very impressed with it and so are my clients..

One question though - there is a white space between the Menu bar at the top and the "hero-box" as I believe you call it...

How can I get rid of the white space???



Administrator Tayla Coman - 11 months ago

Hi Mike, looks like you've removed it. Are you happy with that or do you want it completely gone? I think it looks good how it is

Mike Cranfield - 11 months ago

Yes - I changed the <h1> Tags to be <div class="h1"> I don't know why/how this worked but it did..!!

Administrator Tayla Coman - 11 months ago

The h1 tags by default have padding/margin which would have created that gap that you wanted to get rid of.

ALL ACCESS: $12 per Month + Cancel anytime   

Video Description

Defining a new site

Because your website is a collection of files and folders you need to tell Dreamweaver where to look for them all.

  1. From your top menu choose Site > New Site
  2. Name it with your new project (e.g. Example Site)
  3. You’ll need to create a new folder on your hard drive for your website to go into. This should be unique for every website.
  4. Choose the browse icon next to Local Site FolderDreamweaver Browse Button
  5. Go to where you want your folder to appear and add a new folder e.g .Example Website. 
    Manage a Dreamweaver site
  6. Choose Advanced Settings > Local info
  7. We need to tell Dreamweaver where we’ll store all of our images. This is typically called the ‘Images’ or ‘img’ folder.
  8. Choose the browse icon next to Default Image FolderDreamweaver Browse Button
  9. Add a new folder called ‘Images’.
  10. Click Save

Video Transcription

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. 

ALL ACCESS: $12 per Month + Cancel anytime