iPad向けサイトの注意点1 - 画像を組み合わせるとき

iPadのSafariは、ページの拡大縮小が簡単にできます。
普通に使っている限りにおいて、現在何%の拡大縮小率で表示しているのかすらよく分かりません。
パソコン用のブラウザでも拡大縮小はできますが、実際に使われる頻度はiPadでは段違いに高い、というか、100%で表示されることは想定しづらいという状況ですね。

で、例えば背景画像の上にメニュー画像を乗せたときなんかに、100%表示だと問題無くなじむものが、iPadでみると背景画像とメニュー画像の拡大時の処理が若干違って、つながって見えるべき線などが1ピクセルずれてしまったりということが起こります。

実機で確認すればすぐ気づきますが、後から直すのは面倒なこともありますのであらかじめずれにくい画像の乗せ方を考えながら作る必要が有りますね。
メニューの場合は、文字など固有の部分以外は透明にした透過GIFにして、連続する模様は背景画像を活かすようにするとずれずに表示されます。

細かいですが、細かいところの処理こそ、プロの仕事としての仕上げの丁寧さが要求ますから、きちっとやりたいところです。

コメント