Understanding WYSIWYG HTML Editors - Dreamweaver CS6

In this video you'll see how WYSIWYG editors handle the heavy lifting of building a web page by writing the HTML code for you as you're building the page visually.

Dreamweaver CS6 has three separate views that can be utilized to create your site: Code, Split and Design.

Design View

Design view operates as the WYSIWYG portion of Dreamweaver, allowing any changes that are make in this view to be applied to the Code view immediately; thus your site code is automatically created.

Code View

Code view allows you to custom code your site by manually entering the HTML. Your code can be rendered in Design view to give you an idea of how it will appear; however, be aware that Design view is not 100% accurate of what will be seen in every browser. To get a better idea of the visual, you can activate Live View Mode.

Note: While Live View Mode is active, you will not be able to make an edit to the site code. If you need to make an edit, it is recommended that you de-activate Live View Mode and then make the proper changes in either Code view or Design view.

Split Mode

Split Mode allows you to directly view both Design and Code view simultaneously. Because edits on either view are immediately reflected, you can watch your code change instantly while editing in Design view; or highlight a section of code to see what it corresponds with in Design view.


Getting Started with Dreamweaver CS6


Dreamweaver is a popular Adobe program for creating websites and applications. It supports HTML5, CSS3, PHP, FTP, jQuery and more and works with HostGator web hosting.

You can learn more about Dreamweaver by visiting Adobe's website or the video learning portal, Adobe TV. The video in this article is courtesy of Adobe TV.