How to optimize and debug code in Dreamweaver

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

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.

Merk:

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.

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.

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.

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.

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.

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.

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.

Merk:

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.

Select Window > Results > Validation to open the Validation panel. This panel displays the results of the validation.

Select File > Validate > Current Document (W3C).

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.

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.

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.

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.

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

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.

Merk:

Not all document types can be made XHTML-compliant.

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.

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.

Merk:

You can’t convert an instance of a template, because it must be in the same language as the template on which it’s based. For example, a document based on an XHTML template will always be in XHTML, and a document based on a non-XHTML-compliant HTML template will always be HTML and can’t be converted to XHTML or any other language.

Innlegg på Twitter™ og Facebook dekkes ikke av Creative Commons-vilkår.

Juridiske merknader | Regler for personvern på nettet

Optimize code

Clean up code

Verify tags and braces are balanced

Check for balanced tags

Check for balanced parentheses, braces, or square brackets

Check for browser compatibility

Validate XML documents

Validate documents using W3C validator

Validate an open document

Validate a live document

Customize validation settings

Work with validation reports

Set Validator preferences

Make pages XHTML-compliant

Create XHTML-compliant documents

Create XHTML-compliant documents by default

Make an existing HTML document XHTML-compliant

Spør fellesskapet

Kontakt oss

Clean up code

Verify tags and braces are balanced

Check for balanced tags

Check for balanced parentheses, braces, or square brackets

Check for browser compatibility

Validate XML documents

Validate documents using W3C validator

Validate an open document

Validate a live document

Customize validation settings

Work with validation reports

Set Validator preferences

Make pages XHTML-compliant

Create XHTML-compliant documents

Create XHTML-compliant documents by default

Make an existing HTML document XHTML-compliant

Mer som dette