Dreamweaver で HTML メールを作成する方法

Adobe の Web 開発ツールである Dreamweaver を使用すると、Web ページや電子メール メッセージなど、あらゆる種類の HTML ドキュメントを作成できます。 HTML マークアップの記述に慣れている場合は、コード ビューを使用して、HTML タグを含む電子メールを入力できます。電子メールを視覚的にスタイルしたい場合、Dreamweaver にはワープロ プログラムが提供する書式設定機能のほとんどが用意されています。分割ビューを選択して、コード ビューと表示ビューの両方を同じ画面に同時に表示することもできます。

フォーマットを確立する

ステップ 1

Dreamweaver を起動し、[新規作成] 列で [HTML] を選択します。

ステップ 2

デザインがまだ選択されていない場合は、上部の [デザイン] ボタンをクリックして、コード ビューからデザイン ビューに変更します。

ステップ 3

画面下部の [プロパティ] ウィンドウで [ページ プロパティ...] ボタンをクリックし、デフォルトのフォントとサイズ、テキストの色、背景色または画像 (ある場合)、およびページの余白を選択します。

ステップ 4

[カテゴリ] 列で [リンク (CSS)] を選択し、ロールオーバーなどのマウスの位置と、アクティブまたは訪問済みなどのリンク ステータスに基づいて、メッセージ内のリンクのフォント、サイズ、色を選択します。メッセージ内のリンクの下線のスタイルを選択してください。

ステップ 5

[カテゴリ] 列から [:Headings (CSS)] をクリックし、メッセージで使用するさまざまな見出しのフォント、サイズ、色を選択します。

ステップ 6

[カテゴリ] 列で [タイトル (エンコード)] を選択し、メッセージの件名などのドキュメントのタイトルを入力してから、[HTML5] などのドキュメントの種類と [Unicode (UTF-8] などの文字エンコード) を選択します。 ）」完了したら [OK] を選択します。

タイプとフォーマット メッセージ

ステップ 1

空白の画面にメール メッセージを入力します。メッセージの入力時または入力終了後に、画面下部の [プロパティ] ウィンドウからスタイルを適用して、テキストの書式を設定します。

ステップ 2

[プロパティ] ウィンドウの [形式] ボックスで見出しの種類を選択して、テキストをヘッダーとしてスタイル設定します。 「B」をクリックしてテキストを太字にするか、「I」をクリックして斜体で表示します。

ステップ 3

順序なしリストまたは順序付きリストとしてスタイルを設定するメッセージ内のテキストを強調表示し、[プロパティ] ウィンドウで [順序なしリスト] または [順序付きリスト] ボタンをクリックします。 「ブロック引用」ボタンを選択して、テキストをブロック引用としてフォーマットします。フォーマットを削除するには、[ブロック引用を削除] ボタンを選択してください。

ステップ 4

クリック可能なリンクにするテキストを強調表示し、[プロパティ] ウィンドウの [リンク] ボックスにリンクの URL を入力します。 [ターゲット] 選択ボックスで、リンクを開く方法を選択します。たとえば、リンクを強制的に新しいウィンドウで開くには、「_blank」を選択します。

ステップ 5

[挿入] を選択し、[表] をクリックしてメッセージに表を挿入します。行と列の数を選択し、表の幅を指定して、境界線の太さを入力します。テーブル セル内のパディングとテーブル セル間のスペースに使用するスペースの数を入力します。キャプションと表の要約を含める場合はそれらを入力し、[OK] をクリックします。画面に表示される表にテキストを入力します。

ステップ 6

[挿入] を選択し、[画像] をクリックし、もう一度 [画像] を選択して画像を挿入します。表示する画像ファイルを見つけて選択します。マウスで画像をドラッグして、メッセージ内の画像の配置を調整します。

プレビューと転送

ステップ 1

[ファイル] を選択し、[ブラウザでプレビュー] をクリックして、電子メールとそのフォーマットをプレビューするために複数のブラウザがインストールされている場合は、ブラウザを選択します。メッセージに含まれているハイパーリンクをクリックして、適切に解決されることを確認してください。

ステップ 2

「Ctrl-A」を押してメッセージ全体を選択し、「Ctrl-C」を押してコピーします。メール プログラムに切り替えて、新しいメール メッセージを作成し、必要に応じてメッセージ タイプを「HTML」に変更します。

ステップ 3

「Ctrl-V」を押して、メッセージをメール プログラムに貼り付けます。メッセージの宛先を受信者に指定し、メッセージの件名を入力して送信します。

ヒント

HTML が正しく解釈され、正しく送信されたことを確認するために、他の人に送信する前に自分自身に送信してメールをテストしてください。

警告

この記事の情報は、Dreamweaver CC に適用されます。他のバージョンまたは製品では、多少または大幅に異なる場合があります。