31-08-2012, 04:41 PM
Dreamweaver Tutorial: How to Create a Website with Dreamweaver CS3 (Part 1)
DREAMWEAVER.doc (Size: 105.5 KB / Downloads: 30)
What You Will Need
Dreamweaver CS3
You will need Dreamweaver CS3 (obviously). The tutorial assumes that you are using Dreamweaver CS3 . There are versions of Dreamweaver for both Windows and Mac OS X — either version will do fine. For the most part, both versions work in the same way.
Note: if you are using Dreamweaver CS4, please see my other tutorial series Dreamweaver CS4 Tutorial instead. The latter was written specifically for that version of Dreamweaver, and takes advantage of some of its newer features. Likewise, Dreamweaver CS5.5 users should read the Dreamweaver CS5.5 Tutorial and Dreamweaver CS5 users the Dreamweaver CS5 Tutorial.
A Web Hosting Account
You will need a web host to publish your pages to. For the complete beginner, a web host is (loosely speaking) a company which has computers that are permanently connected to the Internet. After you design your web page(s), you will need to transfer your pages to your web host's computer (called a web server), so that the rest of the world can see it. There are numerous web hosts around — you can find a list of cheap web hosts on http://www.thefreecountrywebhosting/budget1.shtml
There are other things involved in getting your first web site up and running, such as getting your own domain name, making your website search engine friendly and promoting your web site. This tutorial however does not deal with those matters — it is strictly about designing (creating) and publishing (uploading) your website using Dreamweaver. If you are a total beginner, you may want to consult my article How to Start / Create Your Own Website: The Beginner's A-Z Guide for an overview of the entire process and all the things you will need.
Overall Goals of the Dreamweaver Tutorial
By the end of this tutorial, you will have set up a working website with multiple pages, including a main page, a feedback form, an About Us page, and a Site Map. Your pages will contain a sophisticated navigation menu bar, images, multiple columns, a form, links to other pages within your site, links to other sites, text in different font sizes, etc. In other words, you will have a fully functional website.
More importantly, you will know how to use Dreamweaver to create, design and publish your site so that you can design new sites any time you want.
Goal of this Chapter
In this chapter, you will learn to create a rudimentary two-column web page (like this web page that you are currently reading) and publish it so that it can be accessed on the Internet. By the end of this chapter, you will be viewing your web page on the Internet with your favourite web browser.
Note that this is a hands-on tutorial. To benefit from it, in fact, to even understand it, you need to follow the steps as I describe them. The practical nature of this guide makes it difficult to follow or understand if you're not doing the things mentioned.
Designing the Home Page: Preamble
The page you are about to design will serve as the website's "Home Page", which means that it is the main page of your website. It is the page that visitors will see if they type your website's address without specifying any page name. For example, if your domain is called "example.com", and your visitor types "http://www.example.com", they will see this page.
A home page typically contains brief information about what the site is about as well as links to the other pages of your website. If this is the home page of your personal site, you will probably want to welcome your visitors and mention briefly what they can hope to see on your site. If this is the home page of a company site, it will typically mention briefly what the company sells, it's main products and point the visitors to individual product pages or other pages on your site.
For the purpose of this tutorial, I will provide example text for a fictitious company called "Example Company", selling some fictitious products. You should of course use your own text rather than my supplied text. For example, if your company is called XYZ Inc, go ahead and use "XYZ Inc" in places where I use "Example Company". Likewise if you are creating a personal website, and you are out of ideas as to what to call your site, call it by your name. For example, if your name is Shakespeare, call it Shakespeare's Website.