General information about coding in Dreamweaver

Learn about how Dreamweaver supports the different coding languages that are used to build websites.

The most popular programming languages to design and develop fully functional websites are HTML, HTML5, and CSS for the front-end, and PHP, JavaScript, Java, and jQuery for the back-end.

You can design the appearance of a website (such as fonts, and colors for example) across a website using CSS. You can then use HTML to insert images, text, videos, forms, and other pieces of content together into a cohesive web page.

Using CSS and HTML together, you can build a static site. However, most websites require some form of interaction (such as requiring a customer to fill out a form, or make a payment) and a database to store all the website data.

To create these back-end channels of communication, you need a server-side programming language (such as PHP) that communicates with the database.

Programming languages supported by Dreamweaver

In addition to text-editing capabilities, Adobe Dreamweaver provides various features, such as code hints, to help you code in the following languages:

HTML
PHP
CSS
JavaScript

Other languages, such as Perl, are not supported by the language-specific coding features in Dreamweaver; for example, you can create and edit Perl files, but code hints don’t apply to that language.

Automatic code modification

You can set options that instruct Dreamweaver to automatically clean up your hand-written code according to criteria that you specify. However, your code is never rewritten unless the code rewriting options are enabled or you perform an action that changes the code. For example, Dreamweaver does not alter your white space or change the case of attributes unless you use the Apply Source Formatting command.

A few of these code rewriting options are enabled by default.

The Roundtrip HTML capabilities in Dreamweaver let you move your documents back and forth between a text-based HTML editor and Dreamweaver with little or no effect on the content and structure of the document’s original HTML source code. These capabilities include the following:

Use a third-party text editor to edit the current document.
By default, Dreamweaver does not make changes in code created or edited in other HTML editors, even if the code is invalid, unless you enable code-rewriting options.
Dreamweaver does not change tags it doesn’t recognize—including XML tags—because it has no criteria by which to judge them. If an unrecognized tag overlaps another tag (for example, <MyNewTag><em>text</MyNewTag></em>), Dreamweaver marks it as an error but doesn’t rewrite the code.
Optionally, you can set Dreamweaver to highlight invalid code in Code view (in yellow). When you select a highlighted section, the Property inspector displays information on how to correct the error.

XHTML code

Dreamweaver generates new XHTML code and cleans up existing XHTML code in a way that meets most of the XHTML requirements. The tools that you need to meet the few XHTML requirements that remain are also provided.

Note:

Some of the requirements also are required in various versions of HTML.

The following table describes the XHTML requirements that Dreamweaver meets automatically:

XHTML requirement	Actions Dreamweaver performs
There must be a DOCTYPE declaration in the document prior to the root element, and the declaration must reference one of the three Document Type Definition (DTD) files for XHTML (strict, transitional, or frameset).	Adds an XHTML DOCTYPE to an XHTML document: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Or, if the XHTML document has a frameset: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
The root element of the document must be html, and the html element must designate the XHTML namespace.	Adds the namespace attribute to the html element, as follows: <html xmlns="http://www.w3.org/1999/xhtml">
A standard document must have the head, title, and body structural elements. A frameset document must have the head, title, and frameset structural elements.	In a standard document, includes the head, title, and body elements. In a frameset document, includes the head, title, and frameset elements.
All elements in the document must nest properly: <p>This is a <i>bad example.</p></i> <p>This is a <i>good example.</i></p>	Generates correctly nested code and, when cleaning up XHTML, corrects nesting in code that was not generated by Dreamweaver.
All element and attribute names must be lowercase.	Forces HTML element and attribute names to be lowercase in the XHTML code that it generates and when cleaning up XHTML, regardless of your tag and attribute case preferences.
Every element must have a closing tag, unless it is declared in the DTD as EMPTY.	Inserts closing tags in the code that it generates, and when cleaning up XHTML.
Empty elements must have a closing tag, or the opening tag must end with />. For example, <br> is not valid; the correct form is <br></br> or <br/>. Following are the empty elements: area, base, basefont, br, col, frame, hr, img, input, isindex, link, meta, and param. And for backwards-compatibility with browsers that are not XML-enabled, there must be a space before the /> (for example, <br />, not <br/>).	Inserts empty elements with a space before the closing slash in empty tags in the code that it generates, and when cleaning up XHTML.
Attributes can’t be minimized; for example, <td nowrap> is not valid; the correct form is <td nowrap="nowrap">. This affects the following attributes: checked, compact, declare, defer, disabled, ismap, multiple, noresize, noshade, nowrap, readonly, and selected.	Inserts full attribute-value pairs in the code that it generates, and when cleaning up XHTML. Note: If an HTML browser does not support HTML 4, it might fail to interpret these Boolean attributes when they appear in their full form.
All attribute values must be surrounded by quotation marks.	Places quotation marks around attribute values in the code that it generates, and when cleaning up XHTML.
The following elements must have an id attribute as well as a name attribute: a, applet, form, frame, iframe, img, and map. For example, <a name="intro">Introduction</a> is not valid; the correct form is <a id="intro">Introduction</a> or <a id="section1" name="intro"> Introduction</a>.	Sets the name and id attributes to the same value, whenever the name attribute is set by a Property inspector, in the code that Dreamweaver generates, and when cleaning up XHTML.
For attributes with values of an enumerated type, the values must be lowercase. An enumerated type value is a value from a specified list of allowed values; for example, the align attribute has the following allowed values: center, justify, left, and right.	Forces enumerated type values to be lowercase in the code that it generates, and when cleaning up XHTML.
All script and style elements must have a type attribute. (The type attribute of the script element has been required since HTML 4, when the language attribute was deprecated.)	Sets the type and language attributes in script elements, and the type attribute in style elements, in the code that it generates and when cleaning up XHTML.
All img and area elements must have an alt attribute.	Sets these attributes in the code that it generates and, when cleaning up XHTML, reports missing alt attributes.

Regular expressions

Regular expressions are patterns that describe character combinations in text. Use them in your code searches to help describe concepts such as lines that begin with “var” and attribute values that contain a number.

The following table lists the special characters in regular expressions, their meanings, and usage examples. To search for text containing one of the special characters in the table, escape the special character by preceding it with a backslash. For example, to search for the actual asterisk in the phrase some conditions apply*, your search pattern might look like this: apply\*. If you don’t escape the asterisk, you’ll find all the occurrences of “apply” (as well as any of “appl”, “applyy”, and “applyyy”), not just the ones followed by an asterisk.

Character	Matches	Example
^	Beginning of input or line.	^T matches “T” in “This good earth” but not in “Uncle Tom’s Cabin”
$	End of input or line.	h$ matches “h” in “teach” but not in “teacher”
*	The preceding character 0 or more times.	um* matches “um” in “rum”, “umm” in “yummy”, and “u” in “huge”
+	The preceding character 1 or more times.	um+ matches “um” in “rum” and “umm” in “yummy” but nothing in “huge”
?	The preceding character at most once (that is, indicates that the preceding character is optional).	st?on matches “son” in “Johnson” and “ston” in “Johnston” but nothing in “Appleton” or “tension”
.	Any single character except newline.	.an matches “ran” and “can” in the phrase “bran muffins can be tasty”
x\|y	Either x or y.	FF0000\|0000FF matches “FF0000” in bgcolor=”#FF0000” and “0000FF’” in font color=”#0000FF”
{n}	Exactly n occurrences of the preceding character.	o{2} matches “oo” in “loom” and the first two o’s in “mooooo” but nothing in “money”
{n,m}	At least n, and at most m, occurrences of the preceding character.	F{2,4} matches “FF” in “#FF0000” and the first four Fs in #FFFFFF
[abc]	Any one of the characters enclosed in the brackets. Specify a range of characters with a hyphen (for example, [a-f] is equivalent to [abcdef]).	[e-g] matches “e” in “bed”, “f” in “folly”, and ”g” in “guard”
[^abc]	Any character not enclosed in the brackets. Specify a range of characters with a hyphen (for example, [^a-f] is equivalent to [^abcdef]).	[^aeiou] initially matches “r” in “orange”, “b” in “book”, and “k” in “eek!”
\b	A word boundary (such as a space or carriage return).	\bb matches “b” in “book” but nothing in “goober” or “snob”
\B	Anything other than a word boundary.	\Bb matches “b” in “goober” but nothing in “book”
\d	Any digit character. Equivalent to [0-9].	\d matches “3” in “C3PO” and “2” in “apartment 2G”
\D	Any nondigit character. Equivalent to [^0-9].	\D matches “S” in “900S” and “Q” in “Q45”
\f	Form feed.
\n	Line feed.
\r	Carriage return.
\s	Any single white-space character, including space, tab, form feed, or line feed.	\sbook matches ”book” in “blue book” but nothing in “notebook”
\S	Any single non-white-space character.	\Sbook matches “book” in “notebook” but nothing in “blue book”
\t	A tab.
\w	Any alphanumeric character, including underscore. Equivalent to [A-Za-z0-9_].	b\w* matches “barking” in “the barking dog” and both “big” and “black” in “the big black dog”
\W	Any non-alphanumeric character. Equivalent to [^A-Za-z0-9_].	\W matches “&” in “Jake&Mattie” and “%” in “100%”
Control+Enter or Shift+Enter (Windows), or Control+ Return or Shift+Return or Command+ Return (Macintosh)	Return character. Make sure that you deselect the Ignore Whitespace Differences option when searching for this, if not using regular expressions. Note that this matches a particular character, not the general notion of a line break; for instance, it doesn’t match a <br> tag or a <p> tag. Return characters appear as spaces in Design view, not as line breaks.

Use parentheses to set off groupings within the regular expression to be referred to later. Then use $1, $2, $3, and so on in the Replace With field to refer to the first, second, third, and later parenthetical groupings.

Note:

In the Search For box, to refer to a parenthetical grouping earlier in the regular expression, use \1, \2, \3, and so on instead of $1, $2, $3.

For example, searching for (\d+)\/(\d+)\/(\d+) and replacing it with $2/$1/$3 swaps the day and month in a date separated by slashes, thereby converting between American-style dates and European-style dates.

Server behavior code

When you develop a dynamic page and select a server behavior from the Server Behaviors panel, Dreamweaver inserts one or more code blocks into your page to make the server behavior work.

If you manually change the code within a code block, you can no longer use panels such as the Bindings and Server Behaviors panels to edit the server behavior. Dreamweaver looks for specific patterns in the page code to detect server behaviors and display them in the Server Behaviors panel. If you change a code block’s code in any way, Dreamweaver can no longer detect the server behavior and display it in the Server Behaviors panel. However, the server behavior still exists on the page, and you can edit it in the coding environment in Dreamweaver.

About coding in Dreamweaver

Programming languages supported by Dreamweaver

Automatic code modification

XHTML code

Regular expressions

Server behavior code

More like this

Get help faster and easier

Ask the Community

Contact Us