you’re reading “Dreamweaver MX and Valid (X)HTML” an article from edgeofmyseat.com
This CSS, Dreamweaver, Web Standards article was written by Rachel Andrew on Sunday, June 30th, 2002
In a previous article I discussed ways in which we could develop using Dreamweaver 4 and still attain standards compliancy in our html. In that article I had to take into account the fact that Dreamweaver 4 really wasn’t up to the job and to produce valid mark-up we were reduced to altering the default document and other hacks in order to be sure that we didn’t introduce any non-valid code.
If you have downloaded a copy of the Dreamweaver MX Preview Release you may be pleasantly surprised to find how many of the things that we, as developers wishing to work to the W3C standards, want and need have been incorporated into the program. This article is designed as a quick tour of some of the most helpful new features.
DOCTYPES
Dreamweaver MX now adds a DOCTYPE to your documents. Selecting File > New will launch the New document dialogue where you can select from a wide variety of page types. Selecting ‘Basic Page’ ‘HTML’ will give you a page with an HTML 4.01 Transitional DOCTYPE. You want XHTML? You’ve got XHTML. Before you click ‘Create’ to make your page, check the ‘Make document XHTML Compliant’ checkbox, and you will not only start off with a document with the correct XHTML DOCTYPE, but Dreamweaver will now work in XHTML with this document, closing tags, quoting attributes and generally being the kind of software we’ve all asked for.
New Document
Alt Text
Dreamweaver MX ships with Accessibility features, many of which are turned OFF by default. You probably want to turn these useful reminders on. To do this go to: Edit > Preferences > Accessibility and check the box ‘Images’ below ‘Show Attributes when Inserting:’.
Accessibility Preferences
With this option turned on, each time you insert an image you will be prompted to add alt text, like so:
Image Tag Accessibility Attributes Tag
In the accessibility preferences you can also turn on prompts to add attributes for Form Objects, Frames, Media (such as Flash movies) and Tables. If you are interested in, or are required to use best practices for accessibility then this functionality can serve to ensure you don’t miss attributes.
Page Designs (Accessible)
If you are unsure as to how to use the Accessibility Attributes, there is often no better way than to see them in practice. Dreamweaver MX now ships with a collection of Page Designs, including a separate category for Accessible Page Designs. These can be found by choosing: File > New > Page Designs(Accessible). In this dialogue you will be able to choose from a selection of Accessible Designs for common uses. These can really help you get a head start in understanding how to use the Accessibility Attributes.
The Validator
Dreamweaver MX now has its own validator. The validator preferences can be found by selecting: Edit > Preferences > Validator
Validator Preferences
In this dialogue you can choose which versions of html you would like to validate against. Once your preferences are set you run the validator on the document you are working on by:
For an HTML page
File > Check Page > Validate Markup
For an XHTML or other XML document
File > Check Page > Validate as XML
Your results will appear on the Validation tab of the Results Panel. Double clicking an error will highlight it in your document making it easy to find the offending item.
Validation tab of Results Panel
There is no validator for CSS within Dreamweaver MX, so don’t forget to check that your CSS file is valid by checking it at: http://jigsaw.w3.org/css-validator/
Things to Remember
Whilst I believe the Macromedia have done an outstanding job on bringing Dreamweaver up to this standard, at the end of the day it is still up to the person at the keyboard to ensure that their pages validate, and not rely on any software to ‘do it for you’.
One place you will still need to take care, particularly when working in XHTML is when using third party extensions. Many popular extensions will have been made pre-Dreamweaver MX, particularly in these early days, and may not comply with XHTML or even HTML specifications. Run your page through the validator to find out. Often the changes that will need to be made to the mark-up will be very minor and need not mean you have to stop using your favourite extension - you might just need to switch into code view to make a few small edits before uploading your page.
For more information on the new CSS features in Dreamweaver MX, read my article as published on the Macromedia Web site - Best Practices in CSS with Dreamweaver MX, and also another tutorial on this site ‘Dreamweaver MX and external CSS-P‘.
