このページの本文へ

HTMLメール事例紹介(国内編)

絶対見ておきたい国内有名企業のHTMLメール事例まとめ

2015年02月26日 11時00分更新

Web Professional編集部

  • この記事をはてなブックマークに追加
本文印刷

 「HTMLメールはマナー違反」と言われたのも今は昔。最近では海外企業だけでなく、国内企業のマーケティングメール/メールマガジンも素っ気ないテキストから見栄えのいいHTMLメールへの移行が進んでいます。

 今回は、国内企業のHTMLメールをまとめて紹介します。HTMLメールの移行にあたって、コンテンツやデザインを考えるヒントにどうぞ(海外編はこちら)。

*画像は一部修正しています。


ファッション/インテリア


ACTUS

01.png

 家具・インテリア企業のアクタスが定期的に配信しているニュースレター。この号は、仙台店の開店を知らせる内容で、目を引く大きな写真部分には「アクタス仙台店グランドオープン特設サイト」へのリンクが設定されています。ヘッダー部分は大きく見えますが、リンクは設定されていません。

GILT

02.png

 衣料品、アクセサリー、装飾品、雑貨などを販売する会員制サイト「GILT」の登録者向けメール。ヘッダー部分のロゴはネットショップの女性ページ、文字部分には該当ページへのリンクが設定されています。

SHIPS

03.png

 ファッションブランド「SHIPS」の登録者向けメール。各店舗のスタッフによるコーディネートと商品ランキングの紹介で構成されています。各商品は該当ページへのリンクが設定されています。

LOCONDO

16.png

 靴とファッションの通販で著名なLOCONDOの登録者向けメール。ヘッダーで各ジャンルへのリンクが設定されていて、すぐにサイトへ移動できるようになっています。特にプッシュしている商品は幅いっぱいの大きな写真画像で訴求。画像全体にリンクが設定されています。下部には女性用、男性用のシューズ、アパレル、バッグなどにも細かくリンクが設定されています。

Origami

18.png

 有名ブランドや大手百貨店などの質の高い商品を幅広く揃えるショッピングモール「Origami」の登録者向けメール。「今週のおすすめ品」として商品紹介を毎週配信しています。余白が多くとられたシンプルで見やすいデザイン。


小売/EC


TAKASHIMAYA ONLINE STORE

09.png

 高島屋オンラインストアの登録者向けメール。季節にあった商品や開催中のフェア、キャンペーンの紹介など、百貨店の店頭を思わせるコンテンツをきれいにまとめています。

無印良品

10.png

 無印良品の登録者向けメール。冒頭に「今週のおすすめアイテム」として商品を並べ、商品を強く押し出しているのが特徴です。その後で、特集やおすすめキャンペーンなどの他のコンテンツを紹介をしています。

TOWER RECORDS

  • URL:http://tower.jp/
  • 企業名:タワーレコード
  • 種別:商品紹介
11.png

 タワーレコードの登録者向けメール。上から順番にピックアップした商品を並べて紹介しています。「ピックアップ」は幅いっぱいのバナーボタンが縦に並ぶレイアウト。「注目アイテム」は画像、アンダーラインテキスト、「詳細はこちら」ボタンと、1商品で3つリンクを設定してサイトへ誘導しています。

DHC

13.png

 ディーエイチシーの登録者向けメール。オンラインクーポンを冒頭に大きく目立つように配置し、キャンペーンページへ強力に誘導。定期配信される商品紹介メールですが、件名やデザインでキャンペーンメールのように見せています。健康食品や化粧品からプレゼント、送料、スマホアプリの紹介まで、情報満載のマーケティングメールです。

Yahoo! JAPANショッピング

14.png

 ヤフーが「Yahoo!ショッピング」の利用者向けに送信している商品紹介メール。膨大な商品を扱っているにもかかわらず、掲載商品を絞り込み、大きな画像でバランスよく紹介。すっきりとした印象です。

HTMLメールの限界

 PCの大きな画面では目を引くHTMLメールも、海外ではこんな問題が提起されています。

“47% of email opens are on mobile devices, yet many emails are only designed for desktop viewing. Text is often difficult to read, details in images are hard to see, and links are impossible to click on mobile. 〜litmus.com”
メールの47%はモバイルデバイスで開かれているが、まだその多くのメールはデスクトップでの見え方を前提にデザインされている。テキストはしばしば読むのが困難で、画像の詳細も見えにくい、モバイルデバイスではリンクがクリックしにくい

CJ01.png
出典:Litmus - The How-To Guide to Responsive Email Design

 こうした問題点をクリアし、メールのスマートフォンへのシフトに対応するための考え方が、「レスポンシブEメールデザイン」です。レスポンシブEメールデザインの手法を1から解説した書籍『レスポンシブEメールデザイン マルチデバイス時代の魅せるメルマガの作り方』(KADOKAWA刊)で、一歩先を行くHTMLメールを作ってみませんか?

  • 著者:こもりまさあき
  • 価格:本体2,400円 (税別)
  • 発売日:2014年1月16日
  • 形態:A5型 (184ページ)
  • ISBN:978-4-04-870668-1
  • 発売:KADOKAWA
Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

HTMLリファレンス誘導バナー

CSSリファレンスサイト誘導バナー

Webディレクター江口明日香が行く

ランキング