Many websites use table-based layouts to display information on their pages. Tables are useful for presenting tabular data (such as rows and columns of repeating elements) and are extremely easy to create on a page. But tables also tend to generate a great deal of code that is difficult to read and maintain. Additionally, because of the amount of tags required, and the potential for "nesting," tables can cause problems for disabled people who are using screen readers to view web pages.

A CSS-based layout--that is, a layout that uses block elements instead of table rows and columns--contains much less code than a table-based layout of the same nature. CSS-based layouts generally use <div> tags instead of <table> tags to create CSS layout blocks used for layout. You can position these CSS layout blocks anywhere on the page, and assign properties to them such as borders, margins, background colors, and so on. Additionally, people using screen readers to view web pages have a much easier time browsing pages built with CSS because the code is simpler and shorter.

Dreamweaver lets you create layers. A Dreamweaver layer is an HTML page element that you can position anywhere on your page. More specifically, it is a <div> tag (or any other tag) with an absolute position. You use Dreamweaver to drag layers on your page and then position the layers where you want them. The layers act as content blocks that hold assets like images, Flash files, text, and so on.