[web] WEBフォントをHTMLメールで使えるか調べる



 

最終的にはメールマガジンのシステムからHTMLメール形式で大量に送ることになるので、これはWEBフォントがHTMLメール上で使えるかの実験です。


実験始めるまでの壁とか

実験でHTMLメールを送るのは、以外と敷居が高い。

HTMLメールを制作可能なメーラーの環境がないと進まない。

HTMLメールとリッチテキスト形式を同義にしている所があったけど多分違う。検索で要らないサイトが多すぎて大変だった。

OfficeOutlook2007では「ソース」や「ひな形」(近いのはある)メニューが見当たらない。。。ここに一番時間を取られた。

Googleもリッチテキストしか作成できない。。。断念。

確認したいだけなのに、かなり時間かかってる。

Thunderbirdでできた。


作業の流れ

  1. WEBフォントを導入したページを事前に用意(このへんは書き方のサイトを確認)
  2. PremailerでHTMLメール用のHTMLソースを書きだしてもらう
    http://www.moongift.jp/2012/06/20120628-2/?utm <使い方を書いているサイト
  3. Thunderbirdの 「挿入>HTML」で出る入力欄にHTMLソースをペースト
  4. 送信、メーラーで確認

※外部ファイルへのアクセスを禁止していると見れない


フォントメーカーの対応状況

Googleフォント=HTMLメールで見れる

モリサワクラウドフォント=HTMLメールで見れない
※契約時に特定のドメインからしかアクセスできない設定になっているため、表示されないようだ。

現状の日本語のフォントは制限が多いため、実用的ではない。


注意点

サーバー上に、メールで表示する画像(ずっと必要)や、変換元のHTML(メール制作後は不要)を置く場所に、ロックがかかっているとPremailerやメーラーでアクセスできない。


参考にしたサイトなど

HTMLメールなメルマガをWebメール対応したときのメモ

http://dounokouno.com/2010/01/29/html

同報DMは、テキストからHTMLメールへ? 作り方と送信方法

http://www.tokyocafe.net/slog/?eid=372

Webフォントを指定するには?

http://css3.sophia-it.com/reference/


追記:

クロームやThunderbirdでグーグルフォントのMolleが、サイトの記述のままだと表示されなかった件、以下の記述でかいけつ(xxxは任意のクラス)。

xxx {font-family: ‘Molle’ !important;
font-style: italic;
font-weight: 400;}

ちなみに、IEではデフォルトの記述で表示された。


サイトデザインに差をつける Webフォントコレクション (ijデジタルBOOK) おすすめ商品
サイトデザインに差をつける Webフォントコレクション (ijデジタルBOOK)



コメントを残す