こんにちは、ライブドアブログを担当しておりますディレクターの小林です。

サービスをリリースしてせっかく新規にユーザー登録してもらっても、ユーザーがサービスに戻ってこないという悩みは多くのウェブディレクターが抱えていると思います。アプリなどではスマートフォンOSのプッシュ通知機能を使ってユーザーにリマインドを行うサービスも増えていますが、eメールを使ったユーザーへのリマインドについてもまだ押さえておきたいところです。

ライブドアブログでは、新規にブログを作成してくれたユーザー向けにHTML形式のeメールを使ったフォローをはじめました。「ブログを作ったはいいもののまずどうすればよいのかわからない」という初心者の方や、知識にかかわらず三日坊主になりがちな方を応援するのが目的です。今回はライブドアブログでの実例をもとに、ユーザーへのHTMLメール配信で気をつけたいところを紹介したいと思います。

iosmailbox
(photo: iOS mailbox by ekkiPics)

ユーザーのサービス利用度によって内容を最適化


ライブドアブログでは、ブログ作成直後・その翌日・その5日後と新規ユーザーフォローのためのメールを送らせて頂いていますが、ただ同じ文面・内容を送るのではなく、その方がブログのデザインテンプレートを設定しているかや記事投稿の有無などで内容を出し分けています。

こういったリマインダにありがちな「それもうやったよ!」というメールにはならないように、開発の工数はかかるかもしれませんが、開いてもらったメールを一通でも無駄にしないように「まだやってないことをサジェストする」のを前提として設計するとよいでしょう。

ライブドアブログのケースでは、まずブログに記事を書いてもらうことが重要な第一歩ですので、記事を書かれていない方には、ブログ投稿のアドバイスやブログのネタをサジェストしました。また、管理画面を触ってもらう&愛着を持ってもらうという意味でデザインをデフォルトから変えてもらうのが重要と考えたため、デザインテンプレートの例をメール内で表示させています。

mail2


メール配信はオプトインが基本


2008年の法改正により、広告や宣伝を含む内容のメールはユーザの承諾を得たうえで送信することが義務付けられました。

▼参考:Networkキーワード - オプトイン/オプトアウト とは:ITpro
http://itpro.nikkeibp.co.jp/article/Keyword/20080729/311680/

こういったサービスのリマインダのメールも宣伝に該当してしまう場合があるので、ユーザのメールアドレスを保持しているからと言って無条件に送信すると、特定電子メール法や個人情報保護法に抵触する可能性があります。

当初は私も「このメールは商品の購入などを勧めるわけではないためオプトアウト(承諾なしに送信し、メール内に受信停止の導線を明示)で問題ないだろう」と思っていました。ただ、「自社の宣伝」が条件に含まれることを念頭に置くと、登録情報のみを記載したメールやパスワードリマインダ以外はほぼオプトイン形式にするのが望ましいかと思います。

ユーザー向けのメール配信の可否の選択画面においては、「空のチェックボックスにつけさせる/すでにチェックされていて外せる」というのはどちらでも問題ないようですが、明示的に選択できるようになっていない場合は違反扱いとなる場合もあります。わかりやすくチェックボックスなどを設け、きちんと同意を得たうえで送信しましょう。

HTMLメールのマークアップ


昨今のウェブのマークアップでは表現の自由度がかなり上がっていますが、HTMLメールでのマークアップには制限が多く自由度は低くなります。外部CSSやjavascriptは当然使えないため、HTMLのtableタグを中心にレイアウトをし、インラインにスタイルを書くのが基本となります。

せっかく視覚的に豊かなデザインを作成しても崩れてしまっては意味がないので、メーラやブラウザなどの環境によって表示がかなり変わることを考慮し、主要なメーラ・ブラウザでの確認は念入りに行うことをおすすめします。

メール全体の幅はライブドアブログの場合は、650pxとしていました。ウェブでは960px、あるいはそれ以上の幅が主流となってきていますが、メーラでの表示領域は狭いときで画面の半分程度となる場合もあるので、少し狭めとしました。また、この程度の幅に押さえることでスマートフォンで見た場合もある程度見やすい表示になります。

メーラによって表示されるスタイルも異なるので、角丸などを確実に表現したい場合は画像を使ったほうが安心です。しかし、メーラやユーザの設定により画像がデフォルトでは表示されないこともあるのでそこも配慮が必要になります。

角丸や装飾など直接内容に関わりのない画像であれば表示されなくてもそこまで問題ないのですが、見出しのテキストなどを画像で表現したりする場合は内容がわからなくなる可能性があります。対策として、画像のimgタグに必ずalt=""(画像が表示されない場合の代替テキスト)を記述します。「見出し画像1」などではなく、以下の例にあるように、画像内のテキストをそのまま書いておきましょう。

mail


以上、HTMLメールをユーザーに配信する上で気をつけたいポイントをいくつかお伝えしましたがいかがでしたでしょうか?
LINE株式会社ではLINEだけではなくメールも読むディレクターを募集しています。