HTML「メールアドレスにリンクをつけよう」

HTML

<a>でリンクをつけよう

こんにちは、徳です。

デジタルDIYができるようコーディング・プログラミング・画像加工・動画編集などを本やYouTubeで勉強しています。

現在は初心者なので、とにかくゆっくり進んでいくと思います。

また、「間違っていること」や「こうした方が良いよ」などがあれば、コメントなどしていただけたら幸いです。

では、いきましょう!


HTML

今回は、

メールアドレスにリンクのつける方法

を紹介させていただきます。

メールアドレスをクリックしたときにメーラーを表示して簡単に返信をしたいことあります。

そんな時に使用するのがメールアドレスにリンクです。

それではよろしくお願いします。


メールアドレスにリンクをつける

説明

リンクとは、

クリックすることで他のページやアプリへ移動できる仕組み

のことです。

NoriBlog

徳

こちらを押してみてください。

トップページへ飛べます。

こちらはリンク先のURLを指定したため、そのページに飛べます。

しかし、飛ぶ先の表示を変えることでページを開くのではなく、メーラーを開いて簡単にそのメールアドレスへ返信をすることができます。

どんなときに使用する?

メールアドレスにリンクは、

問い合わせやコメントをメールで受け付けたいとき

などに使用します。

徳

メールに直接送ってもらうことができます。

使用するタグ

メールアドレスにリンクをつける場合に使用するタグは、

aタグ

を使用します。

徳

aタグの中に入った文字にリンクがつきます。

書き方

<a href = "mailto:メールアドレス">テキスト</a>
徳

<body>タグ内に書きましょう。

属性

<a>に使う属性

<a>タグには主に、

href属性

を入力します。

href属性

href属性には、

mailto: + メールアドレス

を指定します。

こちらに指定したアドレスが、送信先にしたいメールアドレスになります。

クリックすることで登録されたメーラーの送信先にメールアドレスが設定されます。

徳

こちらがないとクリックしてもどこにも飛べません。

OnePoint

hrefには必ず、

href = "mailto:アドレス"

のように書きましょう。

こちらを、

href = "mailto : アドレス"

のように空白を入れるとメールアドレスとして読み込まれません。

メールアドレスにリンク

<a href = "mailto : #">###@yahoo.co.jp</a>

まとめ

今回は、

メールアドレスにリンクをつける方法

について紹介しました。

今のWebページでは、リンクはほぼあります。

その中で、メールアドレスを押すことでメーラーが開いて簡単に送信できるようになるリンクの作り方になります。

使用するタグは<a>でhref属性の部分が普段のリンクとは変わります。

最後まで読んでいただき、ありがとうございました。

コメント

タイトルとURLをコピーしました