メールアドレスにハイパーリンクを設定できます。それがどのように機能するかを示す前に、その点についていくつかのヒントがあります。個人的にはこれらのメールリンクが好きではありません。むしろフォームの方が適しています。なぜなら、メールクライアントがインストールされていないか、現在のユーザーに構成されていない場合、メールリンクが正しく機能しないことがあるからです。最終的には、メールリンクを使用するかフォームを使用するかはご自身で決定する必要があります。フォームに関する詳細情報は、このシリーズの後続記事で引き続き提供されます。
メールリンクがクリックされると、通常、訪問者にメールウィンドウが表示されます。
しかし、これが保証されるわけではありません。こちらでは、ユーザーが実際に対応する設定を行う必要があります。再度言いますが、メールリンクの解決策は理想的ではありません。それでも、このようなリンクを時々必要とすることもできます。以下はその構文です:
<a href="mailto:kontakt@psd-tutorials.de">kontakt@psd-tutorials.de</a>
お分かりの通り、まず最初に古典的なハイパーリンクです。
ここで重要なのは、href
属性に割り当てられる値です。参照先は常にmailto
で始まり、それに続いて希望する電子メールアドレスが続きます。
電子メールリンクを設定するときに、参考テキストに何を記入するかに注意する必要があります。そこには常に電子メールアドレスを再度記入するほうが良いです。そのため、ハイパーリンクをクリックしても何も起こらないユーザーでも、アドレスをコピーしてメールを送信できます。
電子メールリンクを定義する際には、宛先アドレスだけでなく、使用可能な他のオプションがあります。ここで説明されている内容がHTMLの標準ではないことに留意してくださいが、殆どのブラウザがサポートしています。
まず、Cc受信者を直接指定できます。
<a href="mailto:kontakt@psd-tutorials.de?cc=info@psd-tutorials.de">kontakt@psd-tutorials.de</a>
メインの受信者アドレスの後ろには質問符を記入します。そして、それに続くのがcc
、その後に、表示用のメールコピーを送信するアドレスです。この代わりにcc
の代わりにbcc
を使用することもできます。この場合、指定されたアドレスはBccフィールドに配置され、そのアドレスには目に見えないコピーが送信されます。
定義済みの件名を指定する場合も可能です。
<a href="mailto:kontakt@psd-tutorials.de?subject=Post%20an%20PSD-Tutorials.de">kontakt@psd-tutorials.de</a>
希望する件名はsubject
の後に記入します。これが機能するには、件名にスペースを使用せず、代わりに%20
でマスキングする必要があります。
必要に応じて、メールの本文やその一部を指定することもできます。そのために使用されるパラメータはbody
です。
<a href="mailto:kontakt@psd-tutorials.de?body=Hallo%20PSD-Tutorials.de">kontakt@psd-tutorials.de</a>
ここでも、subject
に関する説明と同様の注意事項が適用されます。
ダウンロードファイルを提供する
ウェブサイト上でファイルをダウンロードできるようにしたい場合は、もちろん可能です(法的な側面はこの時点では考慮しません)。これは非常に簡単に実現できます。ハイパーリンクを定義し、その対応するファイルを参照先として指定します。
<a href="buch.zip">Die Downloads zum Buch</a>
この場合、参照先はZipファイルです。ハイパーリンクをクリックすると、通常、ブラウザがダウンロードダイアログを提供するか、ファイルが直接ダウンロードされます。
そのダイアログを介してファイルをダウンロードできます。ただし、最終的にはブラウザが指定されたファイルをどのように処理するかを決定します。
PDFファイルは通常、対応するリンクをクリックするとブラウザが直接表示します。これはほとんどの場合、全く問題ありません。ただし、PDFファイルをダウンロードできることもあります。(もちろん、訪問者は右クリックしてファイルをダウンロードできますが、すべてのウェブサイト訪問者がこの機能を知っているとは限りません)。
HTML5では、ハイパーリンクをダウンロードリンクとして指定することが可能です。そのためにdownload
属性を使用します。
<a href="ebook.pdf" download>Download</a>
この属性を使用して指定されたリンクは、ブラウザがその属性をサポートしている場合、ファイルをダウンロードします。
通常、ファイルはオリジナルの名前で保存されます。これもほとんどの場合は問題ありません。ただし、ダウンロードされたファイルに別の名前を付けたい場合もあります。これも問題ありません。その際に再度download
属性を使用します。この属性に、希望する名前を値として指定します。
<a href="ebook.pdf" download="dk.pdf">ダウンロード</a>
ブラウザがこの機能をサポートしている場合、ダウンロード時にはdownload
属性に指定された名前が使用されます。
論理関係を示す
リンクの定義に関連する属性の一つに興味深いものとしてrel
があります。この属性を使って、ハイパーリンクが参照先とどのような論理関係にあるかを示すことができます。ブラウザはマウスでリンクをホバーした際に適切なアイコンを表示するためにこの情報を使用する可能性がありますが、現時点ではそのような機能はまだありません。したがって、rel
属性には直接的な影響はありません。
<a href="zwei.htm" rel="next">次へ</a>
rel
属性には以下の値が利用可能です:
• alternate
– ドキュメントの代替バージョンへのリンク。
• author
– ドキュメントの著者へのリンク。
• bookmark
– ドキュメントのパーマネントなブックマークリンク。
• help
– ヘルプファイルへのリンク。
• license
– 著作権情報へのリンク。
• next
– 次のドキュメントへのリンク。
• nofollow
– 検索エンジンがリンクをたどらないことを示す。
• noreferrer
– ブラウザがHTTP-Referrerヘッダを送信しない。
• prefetch
– ドキュメントをキャッシュにロードする。
• prev
– 前のドキュメントへのリンク。
• search
– ドキュメントの検索ツールへのリンク。
• tag
– ドキュメントを説明するキーワード。
このように、参照先とハイパーリンクの関係を詳細に説明することができます。