ナビゲーションをスキップする

コンテンツナビ
  • H2O Space. Co.,Ltd.
  • aquanotes Shop.
  • ちゃんとWeb
  • H2O Space. BLOG
  • aquanotesβ place
  • Recently Ajax

Home > 05.喜ばれるサイト制作 > PDFにリンクを張る時は、「Get ADOBE READER」ロゴを貼りましょう

PDFにリンクを張る時は、「Get ADOBE READER」ロゴを貼りましょう

Webページ上から印刷物などを利用者に提供する際、PDFファイルを利用することがよくあります。

しかし、PDFファイルへのリンクをクリックすると、Webブラウザによってはダウンロードが始まってしまったり、プラグインソフトが起動して表示されたりなど、いつもとは違った動作をしてしまい、利用者を混乱させてしまいます。

また、PDFファイルを表示するための「Adobe Reader」というソフトウェアは、インストールされていないパソコンも多く、ダウンロードしても見られない利用者もいます。

そこで、PDFにリンクをする場合には正しくリンクするようにしましょう。

Get ADOBE READERロゴを貼る

まずは、PDFファイルの閲覧にはAdobe Readerが必要であることを、それを無料でダウンロードできることを示すために、「Get ADOBE READER」のロゴを貼り付けます。これは、Adobe社が無償で配布していて、誰でも利用することができます。

ただし、使用許諾条件に同意して利用しなければなりませんし、バージョンによってロゴのイメージが変わることが多々あるため、きちんとした正規配布元から取得して利用しましょう。

Adobe PDFファイルアイコンを貼る

同じ場所から入手できる「Adobe PDFファイルアイコン」を、PDFファイルへのリンクになっている部分に貼り付けましょう。
こうすることで、利用者は「単なるリンクではない」と言うことを認識することができます。さらに親切にするには「(PDFファイル)」などと補足を入れたり、ファイルサイズを「150KB」などと入れてあげると、さらに分かりやすくなります。

少しの手間で、ユーザーがストレスなく利用できるWebサイトを作ることができます。ぜひ実践しましょう。

この記事に対するコメント: 2

TSUB 08-11-12 (水) 23:55

ユーザビリティーを考える上でのキホンですね!
ユーザーが実際にクリックをする前にその後の挙動を推測できるということが
リンクテキストやリンクボタンには大切な要素となってきます。
ファイル容量を記載することにより、読み込みにかかる時間の判断基準ともできるわけで。

Adobe PDFファイルアイコンの表示方法については
要素もしくは、cssのbackgroundプロパティのいずれかを使うことに
なると思いますが、私個人としてはcssを使用し、XHTML上のリンクテキストに
「(PDFファイル)」と補足をするのが良いかなと思います。
音声ブラウザの対応も考えてこれが良いのかなと。いかがでしょう??

ちゃんとWeb 編集部 08-11-15 (土) 14:06

コメントありがとうございます!

そうですね、視覚効果としてのアイコンは背景として処理して、音声ブラウザや画像を利用していないユーザのために、テキストでも補足してあげるのが親切だと思います。

コメントフォーム

トラックバック: 0

この記事へのトラックバック
http://chanto-web.net/archives/256/trackback

Home > 05.喜ばれるサイト制作 > PDFにリンクを張る時は、「Get ADOBE READER」ロゴを貼りましょう

page top