HTML A要素(タグ)のmailtoで件名や本文に日本語を使った場合の文字化け、UTF-8やSJISによるエンコード、一部の環境でメールアプリが起動しない件。
HTMLのA要素(タグ)のhref属性にmailtoを書くと、そのリンク(アンカー)をクリックした際にメールアプリ(メールクライアント、メーラー)が起動し、メールが送信できる状態になる。 連絡先、お問い合わせなどメールを送ってもらいたいページで使用される。
基本は、mailto のあとにコロン(:)を書き、宛先のメールアドレス(To)を書く。
HTMLの例<a href="mailto:test@example.com">test@example.com</a>
実際の表示
test@example.com
mailto は個人ホームページ黎明期によく見かけたが、その後迷惑メールが増えてきて、ホームページにメールアドレスを直接書く人は少なくなった。
mailto にはいろいろオプションがあり、宛先以外に件名や本文なども書ける。 メールアドレスの後にはてな(?)を書いて各項目を記述できる。
件名(Subject)は subject= の後に書く。
<a href="mailto:test@example.com?subject=件名サンプル">test@example.com</a>
本文(Body)は body= の後に書く。
<a href="mailto:test@example.com?body=本文サンプル">test@example.com</a>
複数の項目を指定するには & でつなげる。
<a href="mailto:test@example.com?subject=件名サンプル&body=本文サンプル">test@example.com</a>
CC や BCC も指定できる。
<a href="mailto:test@example.com?cc=cc@example.com&bcc=bcc@example.com">test@example.com</a>
本文は改行できるが、改行は %0d%0a と書く必要がある(大文字で %0D%0A でも良い)。
<a href="mailto:test@example.com?body=本文%0d%0a改行">test@example.com</a>
ここからが本題だが、件名や本文に日本語を使うと文字化けする場合がある。 その際は、日本語をURLエンコード(エスケープ)するとよい、ということになっている。
URLエンコードといっても、UTF-8 や SJIS(Shift_JIS)などどのエンコーディング(文字コード)を使っているかによって得られる文字列が異なる。
エンコードなしの場合 subject=件名&body=本文 UTF-8の文字列をURLエンコードした場合 subject=%e4%bb%b6%e5%90%8d&body=%e6%9c%ac%e6%96%87 SJISの文字列をURLエンコードした場合 subject=%8c%8f%96%bc&body=%96%7b%95%b6
ただ、残念なことにURLエンコードしてもメールアプリによっては文字化けが解消されない場合がある。
下表はいくつかのブラウザとメールアプリを使い、件名と本文のエンコーディング(文字コード)ごとの文字化けを調べた結果である。 ※「○」は問題なし、「文字化け」は件名と本文の両方文字化け、「本文のみ文字化け」は本文のみ文字化け。
OS | ブラウザ (すべて最新版) |
メールアプリ | エンコードなし | UTF-8 | SJIS | ISO-2022-JP |
Windows 10 | Internet Explorer | Windows Live Mail 2012 | ○ | 本文のみ文字化け | ○ | 文字化け |
Windows 10 | Edge | Windows Live Mail 2012 | ○ | 本文のみ文字化け | ○ | 文字化け |
Windows 10 | Chrome | Windows Live Mail 2012 | 本文のみ文字化け | 本文のみ文字化け | ○ | 文字化け |
Windows 10 | Firefox | Windows Live Mail 2012 | ○ | ○ | メール起動しない | 文字化け |
Windows 10 | Internet Explorer | Thunderbird 45 | ○ | ○ | 文字化け | 文字化け |
Windows 10 | Edge | Thunderbird 45 | ○ | ○ | 文字化け | 文字化け |
Windows 10 | Chrome | Thunderbird 45 | ○ | ○ | 文字化け | 文字化け |
Windows 10 | Firefox | Thunderbird 45 | ○ | ○ | メール起動しない | 文字化け |
Android 6 | Chrome | Gmail 最新版 | ○ | ○ | 文字化け | 文字化け |
iOS 10 | Safari | Mail 最新版 | ○ | ○ | 空白 | 文字化け |
ページのエンコーディング(文字コード)はUTF-8を使用し、SJISのページでも試したが結果は同じだったので、ページの文字コードの影響はない模様。
ブラウザやメールアプリはたくさんあるので一概には言えないが、この結果を見る限り、2017年現在の環境ではエンコードしないのが無難で、次点でUnicode(UTF-8)が無難だろう。
昔、Firefox用のmailtoはエンコードしておいた方が良いという話もあったようだが、今はそうでもなく、SJISでエンコードした場合に至ってはメールアプリが起動すらしない。 最近はスマホでサイトを見る人が多いので、AndroidとGmail、iOSとMail(デフォルトのメールアプリ)での動作を優先する方が良いだろう。