This chapter is from the book
This chapter is from the book
This chapter is from the book
Previewing in a Browser
Although Dreamweaver is pretty much WYSIWYG, it doesn't display every CSS tag or play most animation, and it includes visual aids that will not show up in Web browsers. To find out how your page looks in a particular browser, you need to actually use that browser to view your page. You should always look at your pages in the browser window to see whether things such as CSS, type faces, layers, and table layout designs conform to your intent.
When you install Dreamweaver, the software will detect your most recent available versions of Netscape and Internet Explorer, and if you're upgrading, the list of browsers from your prior version of Dreamweaver will be imported.
To view your page in a browser
- With the page you want to preview open in the Document window, select File > Preview in Browser > [Browser Name] from the menu bar (
Figure 3.53
); or from the Preview menu on the toolbar (
Figure 3.54
); or press F12 or Ctrl+F12 (Command+F12) to use a default browser.
Figure 3.53 Select File > Preview in Browser and then select a browser. Find out how to add browsers to your list in the next section.
Figure 3.54 Select a browser from the Preview menu.
Dreamweaver will open the page in a new browser window; if the browser isn't currently running, Dreamweaver will launch it for you ( Figure 3.55 ).
Figure 3.55 Preview your page, at any stage of its development, in an actual Web browser so you can see what it really looks like. In the Document window, design aids such as table markers are visible, whereas they are invisible in these browsers.
- To view changes, close the browser window and return to Dreamweaver by using the Taskbar (the Dock on the Mac). Edit your page and repeat Step 1 to see your changes.
)
)
)
Adding additional and default browsers to the preview list
In addition to Netscape and Internet Explorer, popular browsers include Mozilla, Opera, Safari for the Mac, and Lynx, a text-only browser. You may also want to add older versions of some browsers to test support of CSS, tables, and layers. And if you're designing for portable or alternative devices, you may use browsers that emulate these tools. You can add to the preview list any browser that's on your computer.
To edit the preview list
- From the Document window menu bar, select File > Preview in Browser > Edit Browser List (Figure 3.53). The Preferences dialog box will appear, with the Preview in Browser panel displayed (
Figure 3.56
).
Figure 3.56 Add software to the browser preview list using the Preferences dialog box's Preview in Browser category.
- Click on the plus (+) button. The Add Browser dialog box will appear (
Figure 3.57
).
Figure 3.57 You can edit the name and location of the browser in the Add Browser dialog box.
- Click on the Browse button. The Select Browser dialog box will appear (
Figure 3.58
).
Figure 3.58 The Select Browser dialog box acts just like an Open dialog box; use it to choose the program file for the browser.
This dialog box is similar to an Open dialog box. Browse through the files on your computer, and select the program file (.exe on a PC) for the browser.
- Click on Open. You'll return to the Add Browser dialog box.
- If you like, you can edit the name of the browser (e.g., Netscape 7 instead of Ntscp.exe) in the Name text box.
- Click on OK. The Add Browser dialog box will close, and you'll return to the Preferences dialog box, where you'll see the new listing in the Browsers list box.
- To add a keyboard shortcut to a browser, select the browser's name and click the checkbox for Primary Browser (F12) or Secondary Browser (Ctrl+F12 in Windows, Command+F12 on the Mac).
- Click on OK to close the dialog box.
)
)
)
Your addition will appear in the File > Preview > in Browser menu, and you'll be able to preview or print the current page using your choice.