Web クリップ(Webclip)アイコンの最適サイズ [Updated]

先日取り上げた Web クリップ(Webclip)アイコンですが、いろいろ気になって調べていたら、やはり Apple 公式なサイズ(57×57 pixels)では「実際のアイコン画像よりも若干ぼやけたボタンになってしまう」ということが判りました。

最適なサイズは、 60×60 pixels です。

自分の作った tumblr. の Web クリップアイコンの場合、tumblr. 文字の部分が実際の画像よりも若干「にじみ」が出ていたのですが、上記サイズへ変更すると確かにくっきりハッキリ見えるようになりました。 この辺は、どこまでこだわるねん?って類の話なのですが、上記サイズで作った方が「美しい」ので、Apple 公式サイズは忘れた方がよさそうです:))


そうそう、それから上のアイコン画像を見てもらっても判るのですが、メインのイメージをキャンパスの中心より「1〜2 ピクセル」上に配置しています。 この方が、実際にボタンになったとき、中心が決まります。 あと、ボタンになるときに画像の周囲が若干削り取られるカンジですので、余白は多めに作っておいた方がいいですよ。
全ては結果オーライですね:)

更新 (2008/01/25):
なんと最近、Apple のオフィシャル サイトに設定された Webclip アイコンは 129×129 pixels でした。
どないやねんってカンジですが、実際にボタンになった印象は綺麗で、これも一つの答えのような気がします。 しかし、これで確実に公式サイズ(57×57 pixels)では美しくない事が明確になったと思います。

というわけで Webclip アイコン(apple-touch-icon.png)は、

60×60 pixels(標準クオリティ)
129×129 pixels(最高クオリティ)

で作ればキレイ!です:)

Related Post

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください