User Guide Cancel

Optimize code

Last updated on Mar 10, 2023

Learn how to clean up code in Dreamweaver, check for browser compatibility, validate XML documents, and make pages XHTML compliant.

Clean up code

You can automatically remove empty tags, combine nested font tags, and otherwise improve messy or unreadable HTML or XHTML code.

For information on how to clean up HTML generated from a Microsoft Word document, see Open and edit existing documents .

In an open document, select Tools > Clean Up HTML.
In the dialog box that appears, select any of the options, and click OK.

Note:

Depending on the size of your document and the number of options selected, it may take several seconds to complete the cleanup.

Remove Empty Container Tags

Removes any tags that have no content between them. For example, and are empty tags, but the tag in some text is not.

Remove Redundant Nested Tags

Removes all redundant instances of a tag. For example, in the code This is what I really wanted to say, the b tags surrounding the word really are redundant and would be removed.

Remove Non-Dreamweaver HTML Comments

Removes all comments that were not inserted by Dreamweaver. For example, <!‑‑begin body text--> would be removed, but <!‑‑TemplateBeginEditable name="doctitle”‑‑> wouldn’t, because it’s a Dreamweaver comment that marks the beginning of an editable region in a template.

Remove Dreamweaver Special Markup

Removes comments that Dreamweaver adds to code to allow documents to be automatically updated when templates and library items are updated. If you select this option when cleaning up code in a template-based document, the document is detached from the template. For more information, see Detach a document from a template.

Remove Specific Tag(s)

Removes the tags specified in the adjacent text box. Use this option to remove custom tags inserted by other visual editors and other tags that you don’t want to appear on your site (for example, blink). Separate multiple tags with commas (for example, font,blink).

Combine Nested Tags When Possible

Consolidates two or more font tags when they control the same range of text. For example, big red would be changed to big red.

Show Log On Completion

Displays an alert box with details about the changes made to the document as soon as the cleanup is finished.

Verify tags and braces are balanced

You can check to make sure the tags, parentheses (( )), braces ({ }), and square brackets ([ ]) in your page are balanced. Balanced means that every opening tag, parenthesis, brace, or bracket has a corresponding closing one, and vice versa.

Check for balanced tags

Open the document in Code view.
Place the insertion point in the nested code you want to check.
Select Edit > Select Parent Tag.

The enclosing matching tags (and their contents) are selected in your code. If you keep selecting Edit > Select Parent Tag, and your tags are balanced, eventually Dreamweaver will select the outermost html and /html tags.

Check for balanced parentheses, braces, or square brackets

Open the document in Code view.
Place the insertion point in the code you want to check.
Select Edit > Code > Balance Braces.

All of the code between the enclosing parentheses, braces, or square brackets is selected. Choosing Edit > Code > Balance Braces again selects all of the code inside the parentheses, braces, or square brackets that enclose the new selection.

Check for browser compatibility

The Browser Compatibility Check (BCC) feature helps you locate combinations of HTML and CSS that can trigger browser rendering bugs. This feature also tests the code in your documents for any CSS properties or values that are unsupported by your target browsers.

Validate XML documents

You can set preferences for the Validator, the specific problems that the Validator should check for, and the types of errors that the Validator should report.

Do one of the following:
- For an XML or XHTML file, select File > Validate > As XML.
- The Validation tab of the Results panel displays a “No errors or warnings” message or lists the syntax errors it found.
Double-click an error message to highlight the error in the document.
To save the report as an XML file, click the Save Report button.
To view the report in your primary browser (which lets you print the report), click the Browse Report button.

Validate documents using W3C validator

Dreamweaver helps you create standards-compliant web pages with its in-built support for the W3C validator. The W3C validator validates your HTML and XML documents for conformance to HTML, XHTML, or XML standards. You can validate both open documents, and files posted on a live server.

Use the report that is generated after validation to fix errors in your file.

Note:

In Dreamweaver preferences, you can specify the parser against which your documents must be validated. This preference is used as a fallback setting in cases where the DOCTYPE cannot be detected automatically.

Validate an open document

Select Window > Results > Validation to open the Validation panel. This panel displays the results of the validation.
Select File > Validate > Current Document (W3C).

Validate a live document

For live documents, Dreamweaver validates code received by the browser. This code is displayed when you right-click in your browser, and choose the option to view the source code. Validating live documents is especially useful when validating dynamic pages using PHP, JSP, and so on.

The Validate Live Document option is enabled only when the URL of the page being validated begins with http.

Select Window > Results > Validation to open the Validation panel. This panel displays the results of the validation.
Click Live View.
Select File > Validate > Live Document (W3C).

For live documents, when you double-click an error in the W3C validation panel, a separate window opens. The window displays the browser-generated code, and the line with the error is highlighted.

Customize validation settings

Select Window > Results > Validation to open the Validation panel.
In the W3C Validation panel, click the W3C Validation (Play) icon. Select Settings.
Select a DOCTYPE for validation if a DOCTYPE has not been explicitly specified for the document.
If you do not want errors and warnings displayed, clear the options.
Click Manage if you want to delete any warnings or errors that you have hidden using the W3C Validation panel. When you remove warnings and errors, they are not displayed when you select Show All in the W3C validation panel.
Select Don't Show W3C Validator Notification Dialog if you do not want the W3C Validator Notification dialog displayed when you begin validation.

Work with validation reports

After validation is complete, the validation reports are displayed in the W3C Validation panel.

For more information on the error or warning, select the error/warning in the W3C Validation panel. Click More Info.
To save the report as an XML file, click Save Report.
To view the entire report in HTML, click Browse Report. The HTML report provides the complete list of errors and warnings along with a summary.
To jump to the location in the code containing the error, select the error in the W3C Validation panel. Click the Options button, and select Go to Line.
To hide errors/warnings, select the error/warning. Click the Options button, and select Hide Error.
To view all the errors and warnings, including the hidden errors, click the Options button. Select Show All. Any hidden errors and warnings you deleted in the Preferences dialog are not listed.
To clear all the results in the W3C validation panel, click the Options button. Select Clear Results.

Set Validator preferences

In addition to the standard W3C Validator, Dreamweaver supports external code validators that you install as extensions. When you install an external validator extension, Dreamweaver lists its preferences in the W3C Validator category of the Preferences dialog box.

Select Edit > Preferences (Windows) or Dreamweaver > Preferences (Macintosh).
Select W3C Validator from the Category list on the left.
Select tag libraries to validate against.

You can’t select multiple versions of the same tag library or language; for example, if you select HTML 4.01, you can’t also select HTML 5. Select the earliest version you want to validate against. For example, if a document contains valid HTML 4.01 code, it will also be valid HTML 5 code.
Select Display options for the types of errors and warnings that you want the Validator report to include.
Click Apply to apply the changes, and click Close to close the Preferences dialog box.

Make pages XHTML-compliant

When you create a page, you can make it XHTML-compliant. You can also make an existing HTML document XHTML-compliant.

Create XHTML-compliant documents

Select File > New.
Select a category and type of page to create.
Select one of the XHTML document type definitions (DTD) from the DocType pop‑up menu on the far right of the dialog box, and click Create.

For example, you can make an HTML document XHTML-compliant by selecting XHTML 1.0 Transitional or XHTML 1.0 Strict from the pop‑up menu.

Note:

Not all document types can be made XHTML-compliant.

Create XHTML-compliant documents by default

Select Edit > Preferences or Dreamweaver > Preferences (Mac OS X), and select the New Document category.
Select a default document and select one of the XHTML document type definitions from the Default Document Type (DTD) pop‑up menu, and click OK.

For example, you can make an HTML document XHTML-compliant by selecting XHTML 1.0 Transitional or XHTML 1.0 Strict from the pop‑up menu.

Make an existing HTML document XHTML-compliant

Open a document, and do one of the following:
- For a document without frames, select File > Convert, and then select one of the XHTML document type definitions.
  For example, you can make an HTML document XHTML-compliant by selecting XHTML 1.0 Transitional or XHTML 1.0 Strict from the pop‑up menu.
- For a document with frames, select a frame and select File > Convert, and then select one of the XHTML document type definitions.
To convert the whole document, repeat this step for every frame and the frameset document.