公開日:2012年2月2日

ipad2で画像がぼやける場合の対処法

WEBサイトのデザイン案のプレゼンに、
ipad2を使おうとして、ちょっとハマった時の話。

オリジナルの画像をjpgやpng化してipadに入れてを見ると、どうしても画像がぼやける。
拡大した時に文字や画像が引き伸ばされるのです。
試しに解像度を高くしても、何も変わらず。

色々やってみたら、縦長や横長といった画像比率が合ってない場合に起こるようだ。
ipad2の画像解像度の比率は、1:1.33 (768×1024px)。
凄く中途半端なのだが、これにオリジナルの画像比率を合わせないと駄目らしい。
たとえば、オリジナル画像のサイズが1024×2048px(1:2)だった場合、
そのままipadで表示しようとすると、
表示サイズが2048pxの比率に自動的に合わされてしまい、
1539px×2048pxの画像として認識され、
1024×768pxに縮小された画像として表示されてしまう。

つまり、どんなに解像度を上げても、サイズを大きくしても、
1024px×768pxとしての画像としか表示できないのです。

しかし、打開する方法が一つあります。
それは、PDFで出力すること。
jpgやpngじゃ駄目なんです、PDFじゃないと、
解像度が下がって、ぼやけた画像になってしまいます。

◆単ページの場合

新しいキャンバスを下記のサイズで開き、
そこに一枚絵を貼り付けます。
それをPDFで保存すればOK!

————————————————-
【画像解像度】 132
【幅】 1091px
【高さ】 1544px
————————————————-

◆ページ数が複数になる、縦長サイズの場合

情報量の多いWEBサイトになると、縦の長さが1091pxを超えてしまいますが、
その時は、ページを分割する必要があります。
また、ページ数が複数ある場合は以下の手順で結合してください。

まず、一枚絵を以下の解像度のキャンバスに貼り付けて、
それぞれ、PNGで保存します。

————————————————-
【画像解像度】 150
【幅】 1240px
【高さ】 1754px
————————————————-

Adobe Bridgeを開き、先ほどのPNG画像を全て選択、
以下の設定でPDFを作成すると、ページが結合されたPDFが出来ます。

Adobe Bridgeは解像度の設定を「132ppi」とは出来ないので、
複数のPDFをまとめたPDFを作るには、この手順が要になります。

関連情報