Build Your Own Standards Compliant Website With Dreamweaver 8

Create standards-compliant and accessible Web sites with Dreamweaver that will work across a broad range of browsers and platforms, are easier to develop, maintain, download, and index, and are accessible to disabled users. Original. (Intermediate)

# Introduction

* Who Should Read This Book?
* What’s In This Book?
* Further Reading
* The Book’s Website
o The Code Archive
o Updates and Errata
* The SitePoint Forums
* The SitePoint Newsletters
* Your Feedback
* Acknowledgements

# What are Web Standards?

* Web Standards Defined
* Who Needs Web Standards?
o Web Designers and Developers
o Browser Manufacturers
o Authoring Tool Manufacturers
o Web Users
* Using Web Standards
o Creating a Valid XHTML Document
o Validating your Document
o Using Valid CSS
o Validating for Accessibility
o Applying a Semantic Document Structure
o Separating Presentation from Document Structure
* Summary

# Site Planning and Setting up for Development

* The Code Spark Site Design
o Features of the Code Spark Website
o Designing the Site
* Structuring the Site
o Dealing with Common Elements
* Setting up a Web Server
o Installing Apache
o Testing SSI
o Using IIS as your Local Web Server
* Hosting your Site
* Setting up Dreamweaver
o Your Workspace
o Setting Preferences
* Summary

# XHTML and Semantics

* What is XHTML?
o XML
o XHTML
* What Makes a Valid XHTML Document?
o The DOCTYPE
o The html Element
o The head Element
o The body Element
* XHTML and HTML: the Differences
o Quoting Attribute Values
o Closing all Empty and Non-empty Elements
o Avoiding Minimizing Attributes
o Writing Elements and Attributes in Lowercase
o Nesting Elements Properly
o Using id Instead of name to Identify Elements
* Why use XHTML?
o Creating Clean Markup
o Making Code Easier for Machines to Process
o Boosting the Portability of Content
o Allowing Integration with other XML Applications
* XHTML in Dreamweaver
o Creating New Pages
o Converting Existing Pages
* Semantic Markup
o Using Elements Semantically
o Semantic Markup and Text-Only Devices
* Summary

# Constructing the Document

* The New XHTML Document
* The Main Content Area
o Linking to Other Tutorials
o Displaying Browser Statistics
* Other Page Elements
* The Heading and Main Navigation
o The Sidebar
* Validating your XHTML
o Validation in Dreamweaver
* Summary

# CSS and Dreamweaver

* Why CSS?
o CSS Basics
* Your Basic Toolkit
o Setting Preferences for CSS
o The Page Properties Dialog Box
o The CSS Panel
o The Property Inspector
o Editing CSS in Code View
o Sample CSS Styles
o CSS Page Designs
o Design Time Style Sheets
o The Style Rendering Toolbar
o CSS "Layout Blocks"
* Summary

# Constructing the Layout with CSS

* The Homepage Document
* Defining the Basic Layout
o The Header
o The Content Area
o The Navigation Area
* Creating CSS Rules
o The Body Area
o Styling the Header div
o The Top of the Header Area
o The Accessibility Buttons
o The Main Navigation
o Styling the Navigation Links
o The Properties Pane of the CSS Panel
* The Content Area
o The Content Sections
o Using Dreamweaver Visual Aids
o The Headings
o The Contents of the Homepage Boxes
o Styling Tables
o The Browser Statistics Section
* The Sidebar
o The Search Box
o The Topics List
o The Articles Lists
o Rounding Out the Sidebar
* CSS Validation and Browser Testing
o Validating the Code
o Browser Testing
* Summary

# Accessibility

* Will Considering Accessibility Stop us Creating Exciting Designs?
* Which Users Benefit?
* Which Guidelines are we Working to?
o The Web Accessibility Initiative (WAI)
o WACG Checkpoint Priorities
o Legislation
* Dreamweaver Tools for Accessibility
* Accessibility in Practice
o Priority 1
o Priority 2
o Priority 3
* Accessibility Validation
o The Dreamweaver Accessibility Validator
o Cynthia Says: Online Validation
* Summary

# Building the Site

* Creating the Includes
o The First Include: head.html
o The Second Include: top.html
o The Final Include: bottom.html
* Creating The Base Page
* The Tutorial List Page
o Creating the Lists
o Adding to the CSS
* An Example Tutorial Page
o Adding CSS for the Tutorial Page
o The Author Image
o The Author Credit and Date
o The Introduction Text
o Inline Images
o Quotes
* Highlighting the Current Section in the Navigation Area
* The Sitemap
o Marking up the Sitemap
o Styling the Sitemap with CSS
* Summary

# Forms and Third-party Services

* The Contact Form
o Marking up the Form
o Laying out the Form with CSS
o Client-side Validation Using Dreamweaver
o Submitting the Form
* Adding a Search Facility
o Creating an Atomz Account
o Adding the Search Form to Your Site
o Editing the Atomz Templates
* Summary

# Alternate Style Sheets

* Accessibility Controls
o Text Resizing
o Switching Style Sheets
o A “Low Graphics” Layout
* Media Types
o Print Style Sheet
* Final Tasks
o Final Validation
* Summary

# Index