Beginning to Create your Website continues...

Step 3

Dreamweaver will now display the Site Window. This step will show how to begin creating and developing the HTML documents and supporting files needed to produce the product. We must begin by understanding how these files will be created, stored, and displayed when necessary.

The right pane of the Site window will contain the folders and files for the local view of the site and the left pane will contain the files for the remote site to be stored on a Web server so other people can view it.

You can use the Site window to manage the site’s folders and files. You can open, rename, copy, and move files, as the project requires.

Most Web pages are created using HTML code. HTML uses tags to encode each piece of information on a Web page. These tags tell the Web browser how to display each piece of information. For example, the <p> (begin paragraph) and </p> (end paragraph) tell the browser that all of the information placed between the two tags should be displayed in the paragraph format.

When an HTML document is displayed in the Document window in Design View,
The document is displayed, as it would appear in a Web browser. This way, you can immediately see the formatting and editing changes, as they would appear in a browser.

You do not need to know HTML to create an HTML document in Dreamweaver. The Dreamweaver software will automatically write the code as you enter text and insert objects in the Document window. However, it is helpful to understand how HTML works so you can edit the HTML code itself as you become more proficient using Dreamweaver to build Web pages and Web sites.

There are several ways to view and edit HTML code using Dreamweaver. Code Inspector will display the HTML code in a separate floating panel. This option is accessed from either the Window menu or by clicking the Code Inspector button on the launcher bar.

You can also access the HTML code of your document by switching from Design View to Code View. The first three buttons on the tool bar will allow you to switch between Code view, Design view and a split screen for Code and Design view. Use Screen tips to discover the function of each button.