Dreamweaver is a professional HTML editor for crafting web pages and websites. Whether you value the control of manually coding HTML (hypertext markup language) or prefer to work in a WYSIWYG (what you see is what you get) editing environment, Dreamweaver gives you the tools you need to help your web page creation experience go smoothly.
Getting Started
To get started, open Dreamweaver and chose New from the File menu. In the New Document dialog box, choose Basic Page and click on Create. A new, blank web page is displayed on your screen. What you will see on the page will depend on the Dreamweaver view you are in. If you are in Design View, you will see nothing on the page. If you are in Code View, you will see the bare bones basic HTML code that every web page must have.
To switch between views, use the Code and Design buttons in the top left corner of the page. There is also a third view called Split that splits the page in half horizontally showing both Code and Design views simultaneously.
This article assumes you will be working Design view.
Adding a Title
In the Title field at the top of the page, add a title for your web page. Whatever you type in this field will appear in the title bar of the finished page as well as in the Favorites list if somebody were to bookmark your page, so you want to make this title short yet meaningful.
Adding Text
Click at the top of the blank page and add some text. You can copy and paste text from another program, or just type text directly on the page. To format text, select it and then use the various commands on the Text menu to create exactly the look you want. In addition to changing the font, style, and size of the text, you can also indent or outdent it, make numbered or bulleted lists, and apply paragraph formatting, such as space between lines and paragraphs.
As you type and format text in Design view Dreamweaver creates the underlying HTML code for the page. If you want to see what’s going on behind the scenes, click on the Code view button.
Adding an Image
To add an image to a page, position the insertion point where you would like the image to appear and then choose Image from the Insert menu. Navigate to the folder containing your image, select it, and click on OK to insert it at the cursor. You can use JPG, GIF, or PNG images on your Dreamweaver web pages.
Choose Image from the Modify menu to crop or sharpen the image, or to change its brightness and contrast settings.
Adding a Background Color
The default page color in Dreamweaver is white. You can easily change the background color to give your site some pizzazz. Choose Page Properties from the Modify menu. Click on the box next to Background Color and then click on the color you want to use. Click on the OK button to close the dialog box and apply the change. You will probably want to explore the Page Properties dialog box further when you have the time – it offers a lot of control over how a web page will look.
Saving Your Page
It is a good idea to save frequently while you are creating a page. To do so, choose Save from the File menu. The first time you save you will have to give the web page a name and save in it in the appropriate location. By default your web page will be saved with the .htm file extension.
Previewing Your Page
To see what you page would look like in a browser, choose Preview in Browser from the File menu and select the browser you wish to use. A separate browser window will open giving you a sneak preview of your page. Note that you must save your page before Dreamweaver will allow you to preview it in a browser.
The F12 key also activates the Preview in Browser command – it’s a great shortcut to remember because this is something you will want to do frequently.
Moving Forward
Are you ready to get a bit fancier with your web pages? Dreamweaver offers excellent user support through their Help files and tutorials. Choose Getting Started and Tutorials from the Help menu and invest some time in exploring what is offered. Using the built-in tutorials is a sure-fire way of getting yourself quickly acclimated to the richness of the Dreamweaver program.