iPod + iTunes ネタ / 2008.01.20 Sunday / comments(0) / trackbacks(4)
iPod Touch - Webclip のボタンの作り方

「iPod touch」のファームウェアアップデートで追加されたウェブクリップ(WebClip)機能はとっても便利・・・何たって、お気に入りのサイトを登録しておけば、iPhone や iPod touch のホーム画面からワンタップでアクセス出来ちゃいます:)

でも、大概の場合、味も素っ気もない「ボタン」になっちゃいます^^;・・・ま、(欲しい絵柄を拡大したりして)コツを掴めば意外とそれなりな「ボタン」にすることは可能デス。

しかしソレとて格好いいボタンにはほど遠いワケですT-T

せめて、自分のブログだけでもカックイイ「ボタン」にできないものかと思っていたら・・・有りました有りました、Modern Syntax さんがウェブクリップ用のアイコンの作り方を紹介されていました。

作り方は意外に簡単で以下の通り.....

1.57 x 57ピクセルのPNG画像を用意する。
2.その画像をapple-touch-icon.pngという名前で保存
3.apple-touch-icon.pngをWebサーバーのルート(DocumentRootというかhtdocsの下というか要はindex.htmlがあるところ)に配置。

違うファイル名や保存場所を利用したい場合にはHTMLのheadタグ内に以下のように指定すればOKのようです。

<link rel="apple-touch-icon" href="/ファイル名"/>

【例】
<link rel="apple-touch-icon" href="http://img-cdn.jg.jugem.jp/fe6/1490670/20091024_694958.png"/>

ちなみに、iPhone や iPod touch のボタン特有のテカリはシステムが自動でつけてくれるとのこと。
また、57ピクセル以上の画像に関しては自動で縮小してくれるらしい。


早速、Blog!NOBON 用と Touch!NOBON 用の画像を作成してみました。


Blog!NOBON


Touch!NOBON

で、HTMLのheadタグ内で指定する方法でチャレンジしてみました。

結果はこんな感じ

大成功!!

iPod touch を持ってる方はぜひ試してみてチョ:)....NOBON


Apple Store(Japan)

@Modern Syntax - iPhoneとiPod TouchのWebclipのアイコンの作り方





コメント
コメントする
どうぞお気軽にコメントください:)また、公序良俗に反する内容、個人や団体を誹謗中傷する内容、その他不適切と判断させていただいた内容については、削除させていただく場合もございます。ご了承ください。[NOBON]











この記事のトラックバックURL
スパム対策のため記事へのリンクがないトラックバック、ひらがな・カタカナを含まないのトラックバックを拒否させていただきます。予めご了承ください。[NOBON]
トラックバック機能は終了しました。
トラックバック
iPod Touch - Webclip のボタンの作り方
| Blog N-two | 2008/01/21 9:27 AM |
iPod Touch - Webclip のボタンの作り方を参考に作ってみました。 もしiPod touchを持ってる人は試してみてくださいね。 HTMLのheadタグ内に以下のように指定すればOK だそうです。
WebClip
| everything-everything | 2008/01/27 3:43 PM |
iPod touchがお気に入りのWebサイトやWebアプリケーションのWebクリップを自動的に作成して、ホーム画面に追加してくれます。 Webクリップをタップするだけで、いつも利用するWebサイトに直接アクセスできます。 いやー、久々の豪雪ですね。 あわてて雪掻き
[Mac]iPod touch用WebClipアイコンの作り方
| 伊藤浩一のW-ZERO3応援団 | 2008/02/13 1:46 PM |
せめて、自分のブログだけでもカックイイ「ボタン」にできないものかと思っていたら・・・有りました有りました、Modern Syntax さんがウェブクリップ用のアイコンの作り方を紹介されていました。 :: Blog!NOBON | iPod Touch - Webclip のボタンの作り方 ::
iPod touch/iPhone Webclip用のアイコンを作りました
| aerial nekton | 2008/02/22 12:16 PM |
Blog!NOBONさんの記事を参考にして、このブログのiPod touch/iPhoneのWebclip用のアイコンを作成しました。


カテゴリ:
月別アーカイブ:

厳選iPhone / iPod touch壁紙リンク集

厳選iPad / iPad mini壁紙リンク集

厳選 Mac用壁紙