How to Preview Your Page in Adobe Dreamweaver CS6 - dummies

By Jennifer Smith, Christopher Smith, Fred Gerantabee

Perhaps you’ve completed your page in Adobe Dreamweaver CS6 and you want to investigate how it looks in a browser. 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.

Choosing in which browser to preview a page.

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

The Dreamweaver CS6 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.

To view your page in Live View, follow these steps:

  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.

Adobe BrowserLab is a unique service that is accessible from directly within the Dreamweaver environment. You can view and simulate your website 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.

Previewing a web page on the Adobe BrowserLab

Before you can use the BrowserLab service, you must make sure you have access. To get access, visit the website, or follow the login steps presented when you first try and use the service within Dreamweaver.

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, or click the Preview button in the new Adobe BrowserLab panel located in the workspace on the right.