モバイル向けメールマーケティング5つのTIPS

　そもそもレスポンシブデザインは、CSSのメディアクエリという技術を利用する。表示する端末の画面サイズに応じたクリエイティブを、ワンソースで実現するというものだ。従って、メディアクエリが対応していないメールアプリには使えない。例えば、iPhone Gmail app、Android 2.1 Eclair native client、Android Gmail app、Windows Phone 7などは非対応である。しかし、大抵のメールアプリは対応していると言ってよい。

　Elliot氏によれば、「実際のユーザー所有割合で算出すると、米国では98.5%が対応していることになる」という。ちなみに、筆者が同じ方法で、日本のユーザーの実質的な所有割合ベースで算出したところ、最低でも“95％”が対応している、という数値が出た。

　また、もし非対応のメーラーだったとしても、文字化けが起きたり配信できないというリスクがあるわけではなく標準の表示幅のサイズで送られる。これらの事情を加味すると、レスポンシブメールによるリスクは限りなく少ない。

　これを前提としたうえで、モバイル向けにデザインを最適化するためには、どのようなテクニックがありえるのだろうか。Elliot氏は、5つのポイントを紹介した。

1：Concise Content

　モバイルの場合、コンテンツはなるべく簡潔にすべきである。すばやく読み込ませるために、メールの容量は出来るだけ軽くさせることを心がけつつ、スペースいっぱいに画像を配置させ、余白をなくすことがポイントだ。また、モバイルユーザーは、あまり文字をみない傾向がある。文字を挿入するのであれば、画像とセットで訴求するなど、工夫が必要だ。

2：1column

　カラムは1段を推奨する。レスポンシブデザインを使えば、標準が複数カラムの場合でも、1カラムにリサイズすることができる。モバイル環境は、表示領域が狭いため、おのずと画面サイズも小さくなる。カラムが多いと、ユーザーの導線が複雑化するため、読む気が失せてしまうことが多い。シンプルに、上から下に目を遷移できるよう、カラムは極力単一化すべきだ。また、ナビゲーションバーを横向きに設けている場合は、1カラムを考慮して、縦向きに変えるべきである。

3：Design for Touch

　モバイルの場合、クリックの代わりに、指でタップする。従って、タップしにくいサイズは避けるべきである。最小でも、ボタンは44×44px以上で作成すべきだ（ちなみにiPhoneは44ピクセルを基準にUIが作られている）。可能であればボタンは横幅いっぱいまで大きく伸ばしても良い。

4：More contrast

　モバイルの場合、特に移動中などで日光の下や電車の中など、明るい場所で閲覧することが多い。そのため、輝度（Brightness）を意識して、コントラストをはっきりさせたデザインにすると良い。これによって大きくメールの効果が変わるとまでは言い切れないが、確実にユーザーエクスペリエンスは向上するだろう。

5：iPhone Subject lines cut off at 35 character

　iPhoneの場合、件名は半角35文字、全角で18文字が受信ボックスで表示される最大数である。従って、モバイルを考慮するのであれば、訴求したい内容はこの文字数に含めるべきだ。

モバイルファーストからモバイルマストへ

　Elliot氏をはじめ、セッションで登壇したすべてのコマース系企業が“モバイルファースト“を強調する。そしてレスポンシブデザインを多用にとりいれ、効果をあげている。

　しかし、レスポンシブデザイン導入には様々なハードルがある。その主たる要因は、“クリエイティビティ”だ。レスポンシブの技術自体は、CSSが触れる人であれば、それほど難しいということではない。むしろ、メール特有のノウハウや特性を理解したうえで、効果につながるデザインを作れるかどうかが重要である。自社にとっての勝ちパターンを見つけるためには、“トライアンドエラー”が必要だ。

　なお、こうした状況はもちろん日本でも同じことが言える。エクスペリアンジャパンの開封エンゲージメントサービスで実施した分析によると、6割以上がモバイル環境で閲覧されていることが分かっている。この割合は、カンファレンスで公表された数字よりも大きい。

　つまり、日本においてもモバイルファーストを実践すべき時がすでに来ているのだ。