Aタグの「mailto:」でメールを送る方法。
実は今は非推奨？細かな設定方法と注意点について

普段お問い合わせというと、今はお問い合わせフォーム的なものを使う事が多いのですが、特定の条件などにおいて、フォームではなくメーラー起動でメールを送るようにして欲しいという仕様をいただく機会があります。

いわゆる、Aタグのmailto機能ですね。

正直なところを言えばユーザー視点から見るとあまりおすすめしたい機能ではないのですが、そういう条件でないとダメと言われると対応しなければならないので、一通り設定方法を知っておく必要があります。

今回はそんなAタグのmailto:について見ていきたいと思います。

Aタグのhref属性に「mailto:」を指定するだけ

はい。使い方はとてもシンプルで簡単です。
通常のリンクであれば、URLを貼り付けるところに、メールを送信するmailto:を記載するだけです。

<!-- 書き方 -->
<a href="mailto:メールアドレス">リンクテキスト</a>

<!--実際の例 -->
<a href="mailto:contact@sample.com">メールお問い合わせ</a>

実際にこのリンクを作ってみるとこうなります。
メールお問い合わせ

hrefのところがmailto:に変わる以外は、通常のリンクと同じです。
アンカーテキストの文字は好きに書けます。

ただ、target属性はtarget="_blank"などを書いたとしても動作はしますが、そもそもクリックしたらメーラーが起動するのであまり意味がないかと思います。

カスタムすると件名やCCの指定なども可能

mailto:には、色々と設定できる項目があり、それらを設定することでメーラーが自動的に立ち上がった際に、件名やCCなどをあらかじめ自動入力させることが可能です。

条件の指定は、?と&を使って指定していく

これはmailtoだけに限った事では無く、コーディングをしていくとあらゆるシーンに共通しますが、こういった条件を指定する際、URLの後にパラメータとして条件を繋げていく場合、最初の条件のみ、「?」で繋げ、2個目以降は「&」を使って繋げて行きます。

<a href="mailto:contact@sample.com?subject=件名&body=本文&cc=support@sample.com&bcc=info@sample.com">メールお問い合わせ</a>

項目については次から説明していきますが、上記のように、条件を繋げて行く際、1個目は「?」で、2個目以降は「?」で繋げて行くというのを覚えておきましょう。

件名はsubject=で指定

メールの件名をあらかじめ指定しておきたい場合は、subject=で件名を記載します。

<!-- 書き方 -->
<a href="mailto:contact@sample.com?subject=件名をここに入れます">メールお問い合わせ</a>

<!-- 実際の例 -->
<a href="mailto:contact@sample.com?subject=裏方ワークスへのお問い合わせ">メールお問い合わせ</a>

上記のように設定すると、リンクをクリックした際に、件名に「裏方ワークスへのお問い合わせ」が入った状態になります。

CCやBCCはそのまま、cc=、bcc=で指定

アドレスをToの1つではなくCCやBCCなども使いたいという場合は、cc=やbcc=を使って宛先のアドレスを入力します。CC宛に複数設定したい場合はメールアドレスを「,」カンマで区切って入力します。

<!-- 書き方 -->
<a href="mailto:contact@sample.com?cc=CCの送信先メールアドレス">メールお問い合わせ</a>
<a href="mailto:contact@sample.com?bcc=BCCの送信先メールアドレス">メールお問い合わせ</a>

<!-- 実際の例 -->
<a href="mailto:contact@sample.com?cc=support@sample.com">メールお問い合わせ</a>
<a href="mailto:contact@sample.com?bcc=support@sample.com">メールお問い合わせ</a>
<a href="mailto:contact@sample.com?cc=support@sample.com&bcc=info@sample.com">メールお問い合わせ</a>

CCだけ、BCCだけも可能ですし当然CCもBCCにも両方という事も可能です。
ただ、BCCは本来相手にわからないように送れるものですが、こういう記載の方法だとわかる人にはBCC宛はどのアドレスかというのがバレてしまう可能性があるという点は知っておきましょう。

本文はbody=で指定

同じように、メールの本文も事前に文章を入れておく事が可能です。
ただ、この本文に事前に入れるのは、文字化けや長文を入れるのに向かないためあまりおすすめしません。

<!-- 書き方 -->
<a href="mailto:contact@sample.com?body=本文">メールお問い合わせ</a>

<!-- 実際の例 -->
<a href="mailto:contact@sample.com?body=お問い合わせ内容をご記入ください">メールお問い合わせ</a>

本文に改行やスペースを入れる際は、そのまま入力することができず、特殊な文字列を入力しないと反映されなかったり文字化けしたりします。

そのため、本文に入力する際はできるだけスペース無しの1行の文章のみにしておくのが良いかと思います。

実際にmailtoを使用するのはあまりオススメしない

ただ、このmailto機能は今では滅多な事がない限り使われる機会もそうありません。というよりも、正直なところを言えば、使う事自体をあまりオススメしません。

ユーザー視点で見たときに良いと言えない

というのも、実際に見てもらえるとわかるのですが、クリックするまでリンクなのかメーラーが起動するのかがパッと見でわからないというものになります。

ある程度ネットリテラシが高い方ならば、リンクテキストにマウスカーソルを当てればブラウザのステータスバーなどに、リンク先URLが出てくるのを知っているので、そこでmailtoの記載があれば、あ、メール送信のリンクかと事前に察知する事はできるのですが、そうでなければ見た目は通常のリンクと同じです。

お問い合わせフォームが今では主流なので、その流れに沿ってお問い合わせフォームのページにいくのかな。と思ってリンクをクリックしたら、パソコンにインストールされているメーラーや、スマホにインストールされてるメールアプリが勝手に自動的に開かれてしまうという仕様になっています。

また、今では割とクラウド系が主体でもあり、メーラー自体、そもそも使われる事が減ってきてもいます。そのためユーザー環境によっては、クリックしても何も起こらないという事にもなりかねません。

メールアドレスを記載するためスパムが大量にくる恐れ

10年以上前ならいざ知らず、今ではWebサイト上にメールアドレスを記載する事はほとんどなくなりました。というのも、メールアドレスをページ上に記載してしまうと、それをきっかけにそのアドレスにスパムや迷惑メールがどんどん届くようになってしまったからです。

そのため、昔であれば、メールアドレスを記載する際に、少し文字を変化したりして、contact★sampleドットコム（★をアットマークに変更して、ドメインは.com宛におくってください）みたいなことで、対処したりしていました。

しかしながら、mailtoの場合はメールアドレスを正しいアドレスで書かなければなりませんし、そのアドレスは割としっかりと本業でも使うアドレスという事になり、大量に迷惑メールが来たりすると大変な事になってしまったりもします。

文字化けリスクや意図しない動作をすることも

昔はお問い合わせフォームを使えるサーバーというのも実は少なかった時代などもありました。HTML以外を使う事は禁止とされていたり、今のように簡単にフォームをサイトに付けるというのが非常に難しい時代もありました。

mailtoコマンドはそういった時には、サイトのお問い合わせのために使う事があったのですが、いかんせん、旧仕様という感じで、ユーザーの環境に依存しやすいものがあり、場合によっては文字化けをしたり、先ほど書いたようにクリックしてもメーラーが起動しないという可能性も多々あります。

そのため、まず基本としてはお問い合わせフォームを使うということを前提として、それでも色々な条件など的にmailtoなどでないとという場合の最後の手段として使うというスタンスが良いのではないかと思います。

まとめ

昔は使われていた機能の1つですが、今の技術が進歩した時代ではほとんど使われる機会がなくなってきたようにも思います。

とはいえ、使っているサーバーの仕様であったりクライアントの条件などによってはフォーム類を使う事ができないので、お問い合わせをmailtoで対応するというケースは稀にですが存在したりもしています。

そういう時のためにも使い方自体は知っておいて損はないですし、逆にこれだけデメリットが多いからお問い合わせフォームの導入提案など理由を付けて説明できるようにもなります。

あまり使う機会もそこまでないかもしれませんが、もし使う機会がきた時のためにも、基本と注意点は把握しておくようにすると良いのではないでしょうか。