- Creating a New Page and Adding Text
- Setting Page Properties
- Introducing Cascading Style Sheets
- Changing Text Attributes in the Property Inspector
- Aligning Text
- Creating Lists and Indenting Text
- Adding a Separator to a Page: The Horizontal Rule
- Saving Your Work and Previewing in a Browser
- Summary
- Q&A
- Workshop
- Exercises
This chapter is from the book
This chapter is from the book
This chapter is from the book
Saving Your Work and Previewing in a Browser
Even though Dreamweaver is a WYSIWYG tool, you need to see how your page really looks in particular browsers. It’s a good idea to save your work before you preview it. Saving your work lets Dreamweaver set the paths to linked files, such as images, correctly. We’ll explore the concept of linked files and paths further in Hour 4, "Organizing: Defining and Configuring a Website." To save your web page, select File, Save.
Macromedia says you can define up to 20 browsers for previewing. Good luck finding 20 browsers! I generally have the following browsers installed for testing: Mozilla Firefox, Microsoft Internet Explorer, Netscape, and Opera on my Windows machine and Internet Explorer, Netscape, Safari, and sometimes Opera on my Mac. You have to have these programs installed on your computer before you can use them to preview your web pages. All the browsers mentioned have free versions and are available to download over the Internet.
First, set up a browser as follows:
Select File, Preview in Browser, Edit Browser List command. Dreamweaver’s Preferences dialog box opens to the Preview in Browser category. Dreamweaver might have already located a browser and entered it here during the installation process, so the list might not be empty. My Windows installation of Dreamweaver always finds Internet Explorer and places it in this list for me.
Click the plus button to add a browser, as shown in Figure 3.17.
Leave the Name text box empty for now; Dreamweaver automatically picks up the name of the browser.
Click the Browse button next to the Application text box and navigate to the browser program. For computers running Windows, the default installation location for most browsers is in the Program Files directory. For the Mac, look in your Applications folder.
Click either the Primary Browser check box or the Secondary Browser check box. This determines which keyboard shortcut you use to launch the browser. The keyboard shortcut for one primary browser is F12, and the shortcut for one secondary browser is Ctrl+F12.
Repeat steps 2–5 until all browsers have been added.
Make sure that the Preview Using Temporary Files is not selected. Click the OK button when you are done.
)
Figure 3.17 Set the browsers you will use to preview your web pages in the Preview in Browser category in the Preferences dialog box.
Below the browser list is a single check box option that controls whether you directly view your web page in the browser or whether you want Dreamweaver to create a temporary file to display in the browser. When the box is checked, you won’t need to save your web page prior to previewing in a browser because Dreamweaver creates a temporary file for you to display in the browser. If you uncheck this box, you need to save your web page prior to previewing it in the browser. I prefer to uncheck this box and know that I’m viewing the actual web page instead of a temporary file. Even after you’ve saved your page in Dreamweaver and previewed it in the browser, you can still undo changes that you made prior to saving the page.
Select File, Preview in Browser or select Preview in Browser on the Document toolbar to view the current web page. Select the browser you want to use from the menu. If the browser is already open, you might have to switch to the application to see your page. If the browser isn’t already open, Dreamweaver opens it and loads the requested page so you can preview it.
Dreamweaver actually checks each page you open in Dreamweaver for potential browser errors. The Check Browser menu on the Document toolbar displays whether you have any browser check errors in the target browsers selected. By default, Dreamweaver checks your page for errors in Internet Explorer 5 and Netscape 6. Modify the browsers and version in the Target Browsers dialog box, shown in Figure 3.18, by selecting Check Browser, Settings.
Congratulations! You’ve created your first web page in Dreamweaver and learned a lot about formatting the page and text on the page. Many of the tasks described in this hour will become habitual to you with every web page you create, and you will be able to quickly move through the steps you’ve practiced in this hour.
)
Figure 3.18 Select which browser definitions Dreamweaver uses to automatically check for errors.