HTMLメールの作成方法（マイスピー）

メルマガで文字の装飾を使ったメールを配信したい！というときにhtmlメールを使うとそれが可能となります。

そうは言っても、どうすればいいの？という方のために解説動画を作りましたので、ご覧ください。

html化のメリット

• 文字を装飾できる（太字、下線、赤文字、マーカー）
• 画像を挿入できる
• 文字にリンク付けできる
• メルマガの開封率を計測できる

ビジネス中級者になってくると、メルマガ開封率をしっかりと把握することで、ビジネス向上のためのマーケティングが可能となってきます。

html化のデメリット

• 多く入れすぎると、Gmailでプロモーションに入りやすくなる

※これの対策としては、テストメールで確認することが大事です。もしプロモーションに入るようでしたら、文字の装飾を減らす、リンクを減らす、画像を減らすなどを行なってみると、プロモーションに振り分けられずに受信ボックスに入るようになることもあります。

ちなみにどういうときにGmailのプロモーションに振り分けられるかの条件を、Google側は提示していません。せっかく作ったメールが読まれない、、ということにならないようにしていきたいですね！

htmlメールを作るときのポイント

• 文章を先に作っておく
• 画像は、横サイズ350pxがベスト
• 装飾はあとからやればOK

スマホでメルマガを見る人が大半なので、画像の横サイズは350がベストです。350以下だと文字も綺麗に配列されている印象があります。

応用編：ボタンを作ってリンクさせる方法

以下のコードを使うと、ボタンリンクが作れます。

<center><span style=”color: rgb(255, 255, 255);”><a href=”●●リンクURL●●” target=”_blank” style=”text-decoration:none; background-color:#1e2e6b; color:#fff; text-align:center; font-weight:700; border-radius:5px; padding:15px 0px; width:100%; display:inline-block;”>●●文字●●</a></span></center>

ボタンの色など凝りたい方は、カラーコードを変更すると良いです。

ちなみに緑、青、赤、は以下のコードです。

LINE

<a href=”●●リンクURL●●” target=”_blank” style=”text-decoration:none; background-color:#00b900; color:#fff; text-align:center; font-weight:700; border-radius:5px; padding:10px 0px; width:100%; display:inline-block;”>●●文字●●</a>

緑色のボタンリンク

公式ホームページ

<a href=”●●リンクURL●●” target=”_blank” style=”text-decoration:none; background-color:#1da1f2; color:#fff; text-align:center; font-weight:700; border-radius:5px; padding:10px 0px; width:100%; display:inline-block;”>●●文字●●</a> 

青色のボタンリンク

YouTube

<a href=”●●リンクURL●●” target=”_blank” style=”text-decoration:none; background-color:#FF0000; color:#fff; text-align:center; font-weight:700; border-radius:5px; padding:10px 0px; width:100%; display:inline-block;”>●●文字●●</a>

赤色のボタンリンク

マイスピーの契約はこちらから！

マイスピーの契約はこちらから可能です！