为你的网站添加 WebClips 图标

最新的 iPhone 软件更新 1.1.3 中加入了将网页作为 WebClip 添加至 Home Screen 的功能。不知细心的你在观看 Macworld 2008 上 Steve Jobs 的演讲视频时是否发现 Google 搜索被添加至 Home Screen 时图标并不是像 纽约时报 那样的网页截图,而是一个精心设计的图标。

想知道如何为你的网站设置一个 WebClip 图标吗?本文将教会你。

官方文档见:Create a WebClip Bookmark Icon

要为你的网站的所有页面设置 WebClip 图标,将你制作好的 PNG 格式的图标命名为 “apple-touch-icon.png” ,并将它放至网站的根目录。这一点类似于传统的 “favicon.ico”。

如果想为某一页面设置不同于网站其它页面的 WebClip 图标,你还需在页面的 “head” 元素内添加一个类似于

[code lang="html"] [/code]

的 “link” 元素。

WebClip 图标的尺寸至少应该为 57×57 像素。如果图标尺寸不同于此,图标将被缩放并裁剪至合适尺寸。

Safari 将会自动合成”玻璃材质”效果以使其看起来像内置 iPhone 或 iPod 程序。所以这个特殊效果可不要在设计图标时多加了噢!^o^

就到这里!Resting.

Posted in Apple, Design, Tip at January 22nd, 2008. Trackback URI: trackback
Tags: , , , , ,

No Responses to “为你的网站添加 WebClips 图标”

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>