よもやまチョモランマ

ホームページにPDFを掲載したい場合

「PDFはこちら」をクリックすると、別窓でキレイな書類が表示されて、ダウンロードとかプリントができる。あれ、便利ですよね。

PDFファイルは画像としては表示できないので、サムネイルが欲しい場合は別途 jpg などの画像を用意しなければならないのが、制作側としては若干厄介なんですが。
ユーザーからすれば、欲しい書類が欲しいときにウェブサイトから入手できるのは、本当に便利です。

今回は、イラレデータを(しかも複数まとめて)サイトに掲載する手順をおさらい。
たまにしかやらないから忘れちゃうのよ。

 1. イラレでPDFを書き出す
 2. フォルダにまとめて圧縮する
 3. HTML上でリンクを貼る

それぞれの注意点は以下の通り。

1.イラレでPDFを書き出すときに軽量化する
【参考】Illustratorで書き出すPDFは保存時の設定でめちゃくちゃ軽くなる
これに関しては、自分でも以前に書いてました。
【前記事】イラレPDFを軽くする★

2.フォルダにまとめて圧縮するときは、きちんとフォルダ名をつけて、ファイルをすべてコピペしてから
これ、手を抜くと思わぬ落とし穴がありまして。
複数ファイルをぐわーっと選択して「Lhaplus」に放り込んだら、できあがった圧縮フォルダの名称と、それを展開したときのフォルダ名が違ってしまったんだよね。
今回は、これを伝えたくて記事書いてるようなもんです。

3.HTMLでPDFへリンクを貼るときは <a>タグ
なんとなく、画像な気がしてしまうのだけど、あくまでリンクなのよね。

<a href="file.pdf" target="_blank">PDFファイルはこちら</a>

サムネイル画像がある場合はこんな感じ

<a href="file.pdf" target="_blank"><img src="images/file.jpg" alt="PDFファイルはこちら"></a>

サムネイルも必要となると、元ファイルに修正が入るたびに、「サムネイル用の画像ファイル」と「画面表示用のPDFファイル」と「ダウンロード用の圧縮フォルダ」を作らなければならなくなるので、けっこう大変です。