こんにちは。AND SPACEコーダーの足立です。
皆さんはHTMLメールというものをご存知でしょうか?
HTMLメールとは、HTML形式で作成されたメールのことです。フォントや色、大きさを変えることができるだけでなく、画像や動画を入れたり、することができ、テキストだけのメールよりもより視覚的に情報を伝えることができ、メールマガジンなど、BtoCの場面でよく使われることのあるメール形式です。
メリットも多いHTMLメールですが、ゼロから作るにはHTMLの専門的な知識が必要になることから敬遠している方もいるのではないでしょうか。今回の記事では、HTMLの知識がゼロでも簡単にHTMLメールを作成することができるインターネットサービスについてご紹介させていただきます。
Benchmark Email
https://www.benchmarkemail.com/jp/Benchmark Emailとは、HTMLメールをドラッグ&ドロップ方式などの直感的に操作できるエディターで、初心者でもかんたんにメール作成できるサービスです。
初期費用が無料で、毎月250通までの送信であれば無料のまま利用することができます。
複雑なHTMLコードを書く必要がないので、知識いらずで作成・配信をすることが可能です。
また、Benchmark Emailでは、HTMLメールの他にもメルマガ配信やステップメールの配信を行うことができます。
HTMLメールの送信するまでの手順
※アカウント作成などの、使う前の基本設定やログイン方法については省略しています。
事前準備
先にメールを送信する相手のリストを作成しておくと、後の手順がスムーズになり楽です。1.メニューから「コンタクトリスト」を開く
2.新規リストの作成から通常リストを選択
3.リストへのメールアドレスの登録方法を選択
下記の4つの方法がありますので、リストに追加するメールアドレスの数、
パソコンの環境などを考慮して、適切なものを選びます。
インポート機能を使って作成(xls・csv・txt)
xls・csv・txtのいずれかのファイル形式でメールアドレスのリストを追加することができます。
登録用のファイルを用意する必要がありますが、一度に登録できるメールアドレスの件数に制限がないので、大量のメールアドレスを一度に追加する必要がある場合は、こちらで追加することをおすすめします。
コピー&ペーストで作成
一度に最大50件までのメールアドレスを、コピー&ペーストで追加することができます。
登録件数が50件以内で、上記に記載のファイル形式でメールアドレスのリストをお持ちでない場合にはこちらで追加するのをおすすめします。
1件ずつ登録
入力欄から、1件ずつメールアドレスを登録することができます。
登録件数が数件など、ごく少ない場合にはこちらで追加するのをおすすめします。
サービスからインポートする(Google contacts・Microsoft CRM)
Google contacts・Microsoft CRMなどと連携している場合にはこちらで追加するのをおすすめします。
4.登録完了
登録が完了したら、「次へ」または「リストの追加」を押します。
「顧客情報を追加致しました。」という緑色の文字が表示されていれば、追加の完了です。
HTMLメールの作成手順
事前準備が完了したら、HTMLメール本体の作成を始めます。
1.メニューから「メール」を開く
2.メール作成から「通常メール配信」「ドラック&ドロップ方式」を選択する
通常にHTMLメールを配信する場合は、「ドラック&ドロップ方式」を選択します。
HTMLのコードに慣れている方は、HTMLビルダーから、ソースコードを記述する方式でHTMLメールを作成することができます。
また、HTMLでなく通常のメール配信をおこないたい場合は「PLAIN TEXT EDITOR」を選択します。
今回の記事では「ドラック&ドロップ方式」での作成方法をご紹介します。
3.情報入力
入力欄に沿って、以下の内容を入力します
メール名
管理画面上に表示されるメールの名前です。メール詳細
- 件名:送信されるメールの件名です。
- 差出人:送信されるメールの差出人の設定です。
- 送信元メールアドレス:送信されるメールの送信元アドレスの設定です。
- 返信先メールアドレス:送信したメールに対しての返信がこのアドレスに届きます
パーミッション/ウェブページの表示
- パーミッションリマインダー:購読者がメールの受信に同意するかどうかを確認するパーミッションリマインダーを表示します。
- ウェブページ表示のリンクを追加:受信者の環境によって、HTMLメールを閲覧できなかった場合、代替のWEBページへ飛ばすことができるリンクを表示するかどうかの設定です。
トラッキング
Google Analytics連携:ONにすることで連携設定が可能です。
SNS連携
SNSとの連携をON/OFFで切り替えることができます。
連携機能は下記の一覧となります。
- Twitterでメールを自動的につぶやく
- Facebookのタイムラインまたはページにメールを自動的に投稿
- このメールをベンチマークのコミュニティーに追加
- このメールをベンチマークアーカイブWebページへ追加
4.顧客リストを選択(作成済みの顧客リストから送信するリストを選択)
事前準備で登録したリストを選択します。
選択したリストに登録されているアドレスに対して、作成したHTMLメールを送信することができます。
5.エディター(メールのデザインの作成)
送信するHTMLメールの内容とデザインを作成します。
レイアウト
HTMLメール全体のレイアウトを選択することができます。
白紙レイアウトからは全体のレイアウトの配置のみ設定できます。
また、無料のテンプレートを使用することも可能です。
デザインテンプレートは豊富に用意されており、その数は500種類以上です。
ブロック
「レイアウト」で設定したレイアウトに対して、様々な要素を挿入したり、削除したり、色の変更などをおこなうことができます。
ブロックの追加はドラック&ドロップで直感的におこなうことができます。
また、追加したブロックを再選択し、詳細メニューを開くことでボタンの場合はボタンのcolorの設定やボタンにのせるテキストの内容を変更することができたり、
上下左右の余白や位置(左寄せ・中央寄せなど)の設定をすることもできます。
ただし、設定できる余白は0〜20pxの間なので、それ以上に余白を取りたい場合は改行を入れる、または余白のみで作成したブロックを挿入するなどの工夫が必要です。
HTMLメールのデザインが完了したら、「保存&次へ」を押します
6.配信設定
デザインが完了したら、配信の設定をしていきます。
メール設定の確認
3で入力した情報の確認です。誤りがなければ特に入力・変更する必要はありません。
スケジュールの詳細
配信日の設定を行うことができます。お間違いのないよう設定してください。
設定が終わったら、配信設定を押すと配信設定完了です。
作成の手順は以上で終わりです。
Benchmark Emailを使えば、ややこしいHTMLコードを記述することなく、簡単にHTMLメールが作成できます。一度試してみてはいかがでしょうか。
以上、春の暖かさが待ち遠しい足立でした。
足立
この記事を書いた人2017年に成人したてながら、家族を支える鳥取出身の家族大好き娘。なんとなくふんわりと情報系の仕事に興味があった為、デザイン専門学校にてWebデザインを専攻する。講師の谷川から、真面目ぶりが買われてスカウトされ、インターンを経験後、入社を決める。コミュニケーションに対する苦手意識はあるものの、コーディング作業は楽しく、学べる事を嬉しく思っている。実家を離れてからは、趣味のTRPGを思う存分堪能している。現在大阪総合デザイン専門学校の非常勤講師として勤務中。