Web サイト作成に使用される各種コーディング言語の、Dreamweaver でのサポート状況について説明します。
フル機能の Web サイトを設計・開発するために使用される最もポピュラーなプログラミング言語は、フロントエンドについては HTML、HTML5、および CSS で、バックエンドについては、PHP、JavaScript、Java、および jQuery です。
Web サイト全体の外観（フォントや色など）のデザインには、CSS を使用できます。 その後、HTML を使用して、画像、テキスト、ビデオ、フォーム、およびその他のコンテンツ要素を挿入し、1 つの Web ページにまとめます。
CSS と HTML を使用して構築できるのは、静的サイトです。 ただし、ほとんどの Web サイトでは、何らかのインタラクション（顧客にフォームへの情報入力を求めたり、支払い処理を求めるなど）を行ったり、すべての Web サイト データを保管するためのデータベースを使用する必要が生じます。
これらのバックエンド通信チャンネルを作成するには、データベースと通信するサーバーサイドプログラミング言語（PHPなど）が必要になります。
Dreamweaverでサポートされているプログラミング言語
Adobe Dreamweaver は、テキスト編集機能に加えて、以下の言語でのコーディングを支援するコードヒントなどの様々な機能を提供しています：
- HTML
- PHP
- CSS
- JavaScript
Perl などの他の言語は、Dreamweaver の言語固有のコーディング機能ではサポートされていません。例えば、Perl ファイルの作成や編集は可能ですが、その言語にはコードヒントが適用されません。
自動コード修正
指定した条件に従って、手書きのコードを自動的にクリーンアップするように Dreamweaver に指示するオプションを設定できます。ただし、コード書き換えオプションが有効になっているか、コードを変更するアクションを実行しない限り、コードが書き換えられることはありません。例えば、Dreamweaver は「ソース書式の適用」コマンドを使用しない限り、空白文字を変更したり、属性の大文字小文字を変更したりすることはありません。
これらのコード書き換えオプションの一部は初期設定で有効になっています。
Dreamweaver のラウンドトリップ HTML 機能では、テキストベースの HTML エディターと Dreamweaver 間でドキュメントを相互に移動しても、ドキュメントの元の HTML ソースコードの内容と構造にほとんど影響を与えません。これらの機能は、以下のとおりです。
サードパーティ製のテキストエディターを使用して、現在のドキュメントを編集します。
デフォルトでは、Dreamweaver では、コードが無効であっても、コード書き換えオプションを有効にしない限り、他の HTML エディターで作成または編集されたコードを変更しません。
Dreamweaver では、判断基準がないため、XML タグを含む認識されないタグは変更されません。認識されないタグが別のタグと重複している場合（例：<MyNewTag><em>text</MyNewTag></em>)）、Dreamweaver はそれをエラーとしてマークしますが、コードを書き換えることはありません。
オプションで、Dreamweaver を設定して、コードビューで無効なコードを（黄色で）ハイライト表示することができます。ハイライト表示された部分を選択すると、プロパティインスペクターにエラーの修正方法に関する情報が表示されます。
XHTML コード
Dreamweaver では、新しい XHTML コードを生成し、既存の XHTML コードをほとんどの XHTML 要件を満たすようにクリーンアップします。残りのわずかな XHTML 要件を満たすために必要なツールも提供されています。
要件の一部は、様々なバージョンの HTML でも必要です。
以下の表に、Dreamweaver で自動的に満たされる XHTML 要件を示します。
XHTML 要件 |
Dreamweaver で行われる処理 |
|---|---|
ドキュメントのルート要素の前に DOCTYPE 宣言が必要で、宣言は XHTML の 3 つの文書型定義（DTD）ファイル（strict、transitional、または frameset）のうち 1 つを参照する必要があります。 |
XHTML DOCTYPE を XHTML ドキュメントに追加します。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> または、XHTML ドキュメントにフレームセットがある場合： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> |
ドキュメントのルート要素は html である必要があり、html 要素は XHTML 名前空間を指定する必要があります。 |
html 要素に namespace 属性を次のように追加します： <html xmlns="http://www.w3.org/1999/xhtml"> |
標準ドキュメントには head、title、body の構造要素が必要です。フレームセットドキュメントには head、title、frameset の構造要素が必要です。 |
標準ドキュメントでは、head、title、body 要素が含まれます。フレームセットドキュメントには、head、title、frameset 要素が含まれます。 |
ドキュメントのすべてのエレメントは、適切にネストされる必要があります。 <p>これは<i>悪い例です。</p></i> <p>これは<i>良い例です。</i></p> |
正しくネストされたコードを生成し、XHTML をクリーンアップする際に、Dreamweaver で生成されなかったコードのネスト修正を行います。 |
すべての要素名と属性名は小文字である必要があります。 |
タグと属性の大文字・小文字の設定に関係なく、生成される XHTML コードおよび XHTML をクリーンアップする際に、HTML 要素名と属性名を強制的に小文字にします。 |
すべての要素には終了タグが必要です。ただし、DTD で EMPTY として宣言されている場合は除きます。 |
生成するコードおよび XHTML をクリーンアップする際に、終了タグを挿入します。 |
空の要素には終了タグが必要です。または開始タグが /> で終わる必要があります。例えば、<br> は有効ではありません。正しい形式は <br></br> または <br/> です。 次は空の要素です：area、base、basefont、br、col、frame、hr、img、input、isindex、link、meta、 および param。 XML 非対応のブラウザーとの後方互換性のため、/> の前にスペースが必要です（例：<br />、<br/> ではありません）。 |
生成するコードの空のタグ、および XHTML をクリーンアップする際に、終了スラッシュの前にスペースを入れて空の要素を挿入します。 |
属性は最小化できません。例えば、<td nowrap> は有効ではありません。正しい形式は <td nowrap="nowrap"> です。 これは次の属性に影響します：checked、compact、declare、defer、disabled、ismap、multiple、noresize、noshade、nowrap、readonly、 および selected。 |
生成するコードおよび XHTML をクリーンアップする際に、完全な属性値のペアを挿入します。 注意： HTML ブラウザーが HTML 4 をサポートしていない場合、これらのブーリアン属性が完全な形式で表示されると解釈に失敗する可能性があります。 |
すべての属性値は引用符で囲む必要があります。 |
生成するコードおよび XHTML をクリーンアップする際に、属性値を引用符で囲みます。 |
次の要素には、name 属性と同時に id 属性が必要です：a、applet、form、frame、iframe、img、 および map。例えば、<a name="intro">Introduction</a> は有効ではありません。正しい形式は <a id="intro">Introduction</a> または <a id="section1" name="intro"> Introduction</a> です。 |
プロパティインスペクターで name 属性が設定される際に、Dreamweaver が生成するコードおよび XHTML をクリーンアップする際に、name 属性と id 属性を同じ値に設定します。 |
列挙型の値を持つ属性の場合、値は小文字である必要があります。 列挙型の値とは、許可された値の指定されたリストからの値です。例えば、align 属性には次の許可された値があります：center、justify、left、 および right。 |
生成するコードおよび XHTML をクリーンアップする際に、列挙型の値を強制的に小文字にします。 |
すべてのスクリプト要素とスタイル要素には type 属性が必要です。 （HTML 4 以降、language 属性が非推奨となったため、script 要素の type 属性が必須になりました。） |
script 要素では type 属性と language 属性を、style 要素では type 属性を、生成されるコードおよび XHTML のクリーンアップ時に設定します。 |
すべての img 要素と area 要素には alt 属性が必要です。 |
生成されるコードでこれらの属性を設定し、XHTML のクリーンアップ時に不足している alt 属性を報告します。 |
正規表現
正規表現は、テキスト内の文字の組み合わせを記述するパターンです。コード検索でこれらを使用して、「var」で始まる行や数値を含む属性値などの概念を記述できます。
次の表は、正規表現の特殊文字とその意味、使用例を示しています。表にある特殊文字のいずれかを含むテキストを検索するには、特殊文字の前にバックスラッシュを付けてエスケープします。例えば、some conditions apply* というフレーズで実際のアスタリスクを検索するには、検索パターンは apply\* のようになります。アスタリスクをエスケープしない場合、アスタリスクが続く「apply」だけでなく、「apply」のすべての出現箇所（「appl」、「applyy」、「applyyy」なども）が見つかります。
文字 |
意味 |
例 |
|---|---|---|
^ |
入力または行の始め |
^T は「This good earth」の「T」と一致しますが、「Uncle Tom's Cabin」の「T」とは一致しません |
$ |
入力または行の終わり |
h$ は「teach」の「h」と一致しますが、「teacher」の「h」とは一致しません |
* |
直前の文字の 0 回以上の繰り返し |
um* は「rum」の「um」、「yummy」の「umm」、「huge」の「u」と一致します |
+ |
直前の文字の 1 回以上の繰り返し |
um+ は「rum」の「um」と「yummy」の「umm」と一致しますが、「huge」では何も一致しません |
? |
直前の文字が最大1回（つまり、直前の文字がオプションであることを示します）。 |
st?on は「Johnson」の「son」と「Johnston」の「ston」と一致しますが、「Appleton」や「tension」では何も一致しません |
. |
新行（改行）以外のすべての単一文字 |
.an は「bran muffins can be tasty」というフレーズの「ran」と「can」と一致します |
x|y |
x または y |
FF0000|0000FF は bgcolor="#FF0000" の「FF0000」と font color="#0000FF" の「0000FF」と一致します |
{n} |
直前の文字の n 回繰り返し |
{1}o{2}{6} は「loom」の「oo」と「mooooo」の最初の2つのoと一致しますが、「money」では何も一致しません |
{n,m} |
直前の文字がn回以上m回以下一致します。 |
F{2,4} は「#FF0000」の「FF」と「#FFFFFF」の最初の4つのFと一致します |
[abc] |
角括弧で囲まれた文字のいずれか1つ。ハイフンで文字の範囲を指定します（例えば、[a-f] は [abcdef] と同等です）。 |
[e-g] は「bed」の「e」、「folly」の「f」、「guard」の「g」と一致します |
[^abc] |
カッコ内に含まれない文字 1 つ。 ハイフンで文字の範囲を指定します（例えば、[^a-f] は [^abcdef] と同等です）。 |
[^aeiou]は最初に「orange」の「r」、「book」の「b」、「eek!」の「k」と一致します |
\b |
語境界（スペース、改行など） |
\bbは「book」の「b」と一致しますが 「goober」や「snob」では何とも一致しません |
\B |
語境界以外のすべて |
\Bbは「goober」の「b」と一致しますが 「book」では何とも一致しません |
\d |
数字 1 文字 （[0-9] と同じ） |
\dは「C3PO」の「3」と 「apartment 2G」の「2」に一致します |
\D |
非数字 1 文字 （[^0-9] と同じ） |
\Dは「900S」の「S」と 「Q45」の「Q」に一致します |
\f |
用紙送り |
|
\n |
改行 |
|
\r |
キャリッジリターン |
|
\s |
スペース、タブ、フォームフィード、ラインフィードなどの 任意の単一の空白文字。 |
\sbookは 「blue book」の「book」と一致しますが、「notebook」では何とも一致しません |
\S |
非ホワイトスペース 1 つ |
\Sbookは「notebook」の「book」と一致しますが、「blue book」では一致しません |
\t |
タブ 1 つ |
|
\w |
下線を含む、英数字 1 つ （[A-Za-z0-9_] と同じ） |
b\w*は「the barking dog」の「barking」と一致し、 「the big black dog」の「big」と「black」の両方と一致します |
\W |
非英数字の 1 つ [^A-Za-z0-9_]と同等です。 |
\Wは「Jake&Mattie」の「&」と 「100%」の「%」に一致します |
Control+Enter または Shift+Enter（Windows）、または Control+Return または Shift+Return または Command+Return（Macintosh） |
改行文字。 正規表現を使用しない場合は、これを検索するときに 空白の差異を無視するオプションの選択を解除してください。これは特定の 文字と一致し、改行の一般的な概念ではないことに注意してください。たとえば、 <br>タグや<p>タグとは一致しません。 デザインビューでは、改行文字は改行ではなくスペースとして表示されます。 |
正規表現内でグループ化を設定し、 後で参照するには括弧を使用します。その後、置換 フィールドで$1、$2、$3などを使用して、最初、2番目、3番目以降の括弧で囲まれた グループを参照します。
検索フィールドで、正規表現の前の括弧で囲まれたグループを参照するには、 $1、$2、$3の代わりに\1、\2、\3などを 使用します。
たとえば、(\d+)\/(\d+)\/(\d+)を検索し、 $2/$1/$3に置き換えると、スラッシュで区切られた日付の日と月が入れ替わり、 アメリカ式の日付とヨーロッパ式の日付を 変換できます。
サーバービヘイビアーコード
動的ページを開発し、 サーバービヘイビアーパネルからサーバービヘイビアーを選択すると、Dreamweaver は サーバービヘイビアーを機能させるために1つ以上のコードブロックを ページに挿入します。
コードブロック内のコードを手動で変更すると、 バインディングパネルやサーバービヘイビアーパネルなどのパネルを使用して サーバービヘイビアーを編集できなくなります。Dreamweaver は ページコード内の特定のパターンを検索してサーバービヘイビアーを検出し、 サーバービヘイビアーパネルに表示します。コードブロックのコードを何らかの方法で変更すると、Dreamweaver はサーバービヘイビアーを検出してサーバービヘイビアーパネルに表示できなくなります。ただし、サーバービヘイビアーは ページ上に存在し、Dreamweaver のコーディング環境で編集できます。
