HTMLメール ( Outlook Express専用です)

(表示確認は、Windows XP IE6.0で行っています。)
・htmlメールを使うには(受信も)アンチウィルスソフトは、最新のものにしておいて下さい !!
・htmlメールに画像を入れて送りたいときには、相手の方に送って良いかの確認を必ずとりましょう !!
メーラーにOutlook Expressを使っていない人もいます。
また、Outlook Expressを使っていても6.0からはセキュリティが強くなり、画像が見えない、迷惑メールフォルダに入ってしまう、事もあります。
・ビットマップ画像や大きなサイズ(容量)の画像は送らないで下さい !!
以下は送信者、受信者ともにOutlook Expressを使っているとしてのものです。

   
1

画像が見えない

2 背景を入れる
3 画像の挿入
4 画像を横に動かす(MARQUEE)
5 背景を一列だけ並べる(ソース編集)
6 ひな形ウィザード…背景を一列だけ並べる
7 Stationery(ステーショナリー)って何?
8 Stationery(ステーショナリー)のショートカットを作る
   

 

1.HTML メールに含まれる画像を表示させる

(1)【ツール】 メニューをクリックし、 [オプション] をクリックします。

(2)【セキュリティタブ]】をクリックして、[HTML 電子メールにある画像および外部コンテンツをブロックする] のチェックをはずして、[OK] ボタンをクリックします。

 

2.メールに背景を入れる

画像は縦、横にタイル状にならべられます。

新規メールを出します。【書式】をクリックして
このとき下図のようにリッチテキストに が選択されていない(・がついていない)時には、
リッチテキストの文字の上をクリックします。
 

【書式】→
【背景】→【画像】をクリック
背景の画像がでます。

 

参照をクリック。
ファイルの場所を▼で選び画像ファイルを選択して
開く。
OKをクリック。
背景が出ます。

*背景の画像に周りが透過されたものを使うときには、背景色も同時に入れられます。
 【書式】→【背景】→【色】

ページTOPへ

3.メールに画像を入れる

上の図のように、[画像の挿入]をクリックします。
 灰色になっているときには入力面をクリックします。

参照をクリック。
ファイルの場所を▼で選び
画像ファイルを選択して開く。
OKをクリック。
画像がでます。

上の画面のとき
代替テキスト に文字を入れると 画像のそばにカーソルを近づけると文字がでます。

レイアウト
配置 右 または 左 に画像を配置すると文字を回り込ませることができます。
               (入力面で調整します)
外枠の太さ 数字を入れることによって画像の外枠がでます。黒です。1が1ピクセル

ページTOPへ

4.画像を横に動かす(MARQUEE)

新規メールをだします。
だした時にメールの下の部分に、図のように「編集・ソース・プレビュー」と でていないときには
新規メールの【表示】→【ソースの編集】をクリックします。

(1)最初に動かす画像を、[画像の挿入]で入れます。
    背景も入れられますが、背景は後で入れます。
(2)[ソース]のタブをクリックします。
(3)IMG の文字をみつけます。
(4)下図のように、<MARQUEE> </MARQUEE> と入力します。必ず半角英数を使って下さい。


(5)[プレビュー]のタブをクリックして動いているか確かめましょう。
 左から右に動きます。
(6)[編集]のタブをクリックして、編集画面に戻り背景を入れたりメールを書きます。
  (編集画面では動きません)

*画像のすぐ後ろに文字を入力すると文字も動いてしまいます。

 

右から左へ動かすには、
<MARQUEE direction="right"> </MARQUEE>

ページTOPへ

5.背景を一列だけ並べる

新規メールをだします。
だした時にメールの下の部分に、図のように「編集・ソース・プレビュー」と でていないときには
新規メールの【表示】→【ソースの編集】をクリックします。

(1)背景になる画像を、[書式]→[背景]→[画像]で入れます。
(2)[ソース]のタブをクリックします。

(3)上横一列に入れるとき(必ず半角英数を使って下さい。)
<style></style>の間に入れます。
------------------------------------
  BODY {
background-position: top left;
background-repeat: repeat-x;
}
------------------------------------

 

(3)左縦一列に入れるとき必ず半角英数を使って下さい。)
<style></style>の間に入れます。
------------------------------------
BODY {
background-position: top left;
background-repeat: repeat-y;
}
------------------------------------


背景色がわかっているときには
赤下線の #ffffff を変えます。

(4)プレビューのタブをクリックして確かめます。
(5)編集 のタブをクリックして、文字の位置を重ならないようにメールを入力します。
 左横一列は、インデントで文字の始まりを右にします。

ページTOPへ

6.ひな形ウィザードを使う

【書式】から背景の画像を入れるとタイル状に並んでしまいます。
縦、横に一列だけ並べたいときには

(新規メールは出しません)
(1)【メーッセージ】→【ひな形】→【ひな形の選択】をクリック。
  [ひな形の選択]の画面がでます。
  [プレビューを表示する]にチェックが入っていなかったら、入れます。
  新規作成をクリックします。

(2)[ひな形のウィザードへようこそ]がでます。
  [次へ]をクリック。


(3)[ひな形セットアップウィザード]の画面がでます。
画像にチェックが入っていないときにはチェックを入れます。
参照をクリック。ファイルの場所を▼で選び
画像ファイルを選択して開く。画像がでます。

(4)プレビューを見ながら [位置] [並べ方] を決めます。


(5)背景色を入れたいときには
  色にチェックを入れ、色を選択します。(何もしないときには白になります)


(6)フォントの種類と大きさ、色を決めます。

(7)文字が画像にかぶさらないように余白を入れます。


(8)名前をつけて[完了]をクリックします。
  (今作ったひな形はStationery(ステーショナリー)に保存されました。)
 見本は ひらがなを使っていますが、半角英数でスペースを空けずに名前をつけましょう。
 完成です。

使い方 最初の(1)の画面が出ます。
  今名前をつけたひな形がファイル名の欄に入っています。OKをクリックします。
 一度閉じてしまった時には、
 【メーッセージ】→【ひな形】→【ひな形の選択】で今作ったひな形の名前をクリックします。




編集
今作ったひな形で画像の背景色がわかっているもの、
画像が同じフォルダ(この場合Stationery)に入っているときは、このメールで変更できます。

色・画像の取替え
       
上図は左揃え・縦一列で作成。色を黒(#000000)にしました。
画像の背景色は #B6DEF7 です。(フリー素材 背景より)

[ソース]のタブをクリック。↓下2列の部分です。
bgClor=#000000 を #B6DEF7 に。

background=画像名 を変更

ページTOPへ

7.Stationery(ステーショナリー)って何?

画像の選択をするときなど、初めに出てくるのがステーショナリーです。
ひな形ウィーザードで作ったひな形、それに使用した画像はステーショナリーに納められました。
このように、メールをするときに使う道具を入れる専用のフォルダです。

 

8..Stationeryのショートカットを作る

Outlook Express を開かないで、ステーショナリーの中をみたい。
マイドキュメントのように、画像などを出し入れしやすくしたいときなど、
デスクトップにステーショナリーのショートカットを作ることができます。

Stationery(ステーショナリー)のショートカットを作るには
(1)マイコンピュータを、開きます。(Wクリック)
(2)(C)(D)に分かれている場合は、たいていはC。
  ( Windows○○)と書いてあれば、そちらを開きます。(Wクリック)
 分かれていないときは(3)へ。
(3)Program Files を開きます。(Wクリック)
(4)Microsoft Shared を開きます。 (Wクリック)

(5) ステーショナリーのフォルダをみつけたら
Stationeryのフォルダを右クリック。
[送る]→デスクトップ(ショートカットを作成)をクリックします。

デスクトップにStationeryへのショートカットができました。
WクリックするとStationeryが開きます。


・ひな形とそれに使う画像が同じフォルダに入っていることが必要です。
 Stationery の中に個々のフォルダを作ったときは、
  そのフォルダの中にひな形とそれに使う画像が入っていないと画像が見えなくなります。

ページTOPへ