AP Elements offer a clean, standards-compliant alternative to developing websites. Using CSS in conjunction with <div> tags affords you the capability to cleanly separate positioning and formatting properties from structural code. Learn how in this sample chapter.

In This Chapter

• Introduction to AP Elements
• Working with AP Elements
• Designing Tableless Web Pages Using AP Elements
• Built-In CSS Page Layouts

In Chapter 5, "Web Page Structuring Using Tables," you learned that using HTML tables to structure the content of elements on the page is not only easy, but also, when used correctly, extremely flexible. Unfortunately, you probably also noticed that as the site became more complex, the process of getting the tables perfectly adjusted and getting the content exactly where you wanted it to be was hit or miss at best. After working with merging and splitting cells, adding transparent GIF spacers, and experimenting with the horizontal and vertical spacing, you might be thinking there's got to be a better way to structure your site. There is! That is where CSS and, more specifically, AP Elements come in.

As you'll learn throughout the chapter, AP Elements, or Absolutely Positioned Elements, are nothing more than CSS-driven "content blocks" in Dreamweaver that can contain text, images, media elements, and more. Beyond the simplicities of being able to add content to an AP Element, you can also freely position (usually by dragging and dropping) the AP Element anywhere you want on the page. As you'll see, this is possible because AP Elements rely on standards-compliant CSS positioning properties for controlling the structuring of these unique elements. Regardless of whether you're a print designer looking for web-based structuring techniques that closely resemble print programs like InDesign or Illustrator, or a seasoned web page developer who's traditionally relied on tables for web page structuring, AP Elements are your answer!