Creation of Class Style in Adobe CS5 Dreamweaver
Adobe CS5 Dreamweaver CSS and Browser Compatibility
Creation of New Tag Styles in Adobe CS5 Dreamweaver

Preview Your Page in Adobe CS5 Dreamweaver

Adobe Creative Suite 5 (Adobe CS5) Dreamweaver offers options in previewing your web page. You can quickly preview your file by simply clicking the Preview/Debug in Browser button on the Document toolbar and selecting a browser to preview your page. You can also preview your page in Adobe’s BrowserLab or Adobe’s Device Central (which simulates several different mobile and PDA devices).

The Preview/Debug in Browser button lets you select from browsers installed on your system.
The Preview/Debug in Browser button lets you select from browsers installed on your system.

You can always add browsers from the Preferences panel by choosing Edit→Preferences→Preview in Browser (Windows) or Dreamweaver→Preferences→Preview in Browser (Mac).

Preview your page using Live View

Dreamweaver CS5’s Live View displays your page as you would see it in a browser. This feature is a nice alternative to the Preview in Browser command because you don’t ever need to exit Dreamweaver.

  1. With a page open in the Document window, click the Live View button on the Document toolbar.

  2. To see the resulting source code of your page, click the Live Code button that appears next to the Live View button.

    This step is equivalent to using the View Page Source or View Source options available in most every browser. In this mode, you can only view code, not edit it.

  3. To edit your page code, switch to Split view or Code view on the Document toolbar.

Preview your page using the new Adobe BrowserLab

Adobe’s BrowserLab is a unique service that is accessible from directly within the Dreamweaver environment. You can view and simulate your web site in a number of different browsers, browser versions, and operating system environments from one single location. You can even preview different environments side-by-side to see how different browsers render your site.

The Dummies.com site shown in BrowserLab as it will appear in Firefox for Windows XP (left) and Int
The Dummies.com site shown in BrowserLab as it will appear in Firefox for Windows XP (left) and Internet Explorer 7 on Windows XP (right).

To preview your site in Adobe BrowserLab, click the Preview/Debug in Browser button on the Document toolbar and choose Preview in Adobe BrowserLab or File→Preview In Browser→Adobe BrowserLab.

  • Add a Comment
  • Print
  • Share
blog comments powered by Disqus
Image Rollovers in Adobe CS5 Dreamweaver
Adobe CS5 Dreamweaver Site Reports
Table Cell Merging in Adobe CS5 Dreamweaver
Adobe CS5 Dreamweaver Page Images
HTML Basics in Adobe CS5 Dreamweaver
Advertisement

Inside Dummies.com