iPod touch用Webclipアイコンの作り方
大野晋一(編集部)
2008/01/17 18:00
iPod touchの新機能のひとつにWebclipがある。ホームスクリーンにWebサイトのショートカットをおけるというものだ。ここではそのアイコンの作り方を紹介しよう。
MacworldでアップグレードされたiPhone/iPod touchの新機能のひとつにWebclipがある。ホームスクリーンにWebサイトのショートカットをおけるというものだ。
画面上にWebショートカットを置くなんて日本の携帯電話なら普通に出来ますが? などということなかれ。このWebclip、専用のアイコンを用意すれば、ユーザーのホームスクリーンをハデに彩ることも出来るのだ。ブラウザで長らく使われてきたfaviconのサイズを大きくしたものと考えればよい。
builderでは既にiPod touchに最適化されたWebサイトの作り方を解説しているが、今後はアイコンも忘れずに作っておきたい。
Webサイトの提供者には次の2つの方法が用意されている
- 「apple-touch-icon.png」というファイル名のアイコンをWebサイトのルートフォルダ(サーバのではない!)に置いておく
- HTMLの<head>タグ内に
<link rel="apple-touch-icon" href="/pathToCustomIcon.png"/>
という記述を行う。/pathToCustomIcon.pngはアイコンを置いたパスを記述しよう
アイコンはサイズ57ピクセル四方のPNGファイルが望ましい。サイズが異なると端末側でリサイズされる。また、ホームスクリーンに置かれる際に、自動的につやつやな見た目に加工される。また、アイコンがない場合は自動的にWebページの縮小版がアイコンとなる。
Appleからの公式な情報はiPhone Dev Centerで入手できる。サイトにアクセスし、「Create a WebClip Bookmark Icon」の項を参照されたい。
- 3人の推薦記事
- 1人がクリップ
-
ソーシャルブックマーク(-)
- トラックバック(0)
- 今日のトップ記事
- 昨日
- 2日前
- 4日前
- 5日前
- 6日前
- 7日前
- ホワイトペーパー
- 話題のタグ
Apple
Leopard
SOA
Ruby
入門
Ruby on Rails
ブラウザ
Off Topic
Microsoft
Webデザイン
MySQL
Google
Mozilla
C/C++
Firefox 3
XHTML
まとめ
server
Adobe
PHP
Eclipse
IDE
小技
Firefox
iPod touch
Mac OS X
Flash
Apache
JavaScript
Safari
Webアプリケーション開発
Tips
開発環境
ライブラリ
Python
オープンソース
CSS
フレームワーク
仮想化
iPhone
Windows
Database
Java
HTML
Ajax
PostgreSQL
RIA
イロハ
Linux
リファレンス
話題のタグを見る »
現場の知見から得られるノウハウを共有しましょう
MSもアドビも学生さんに開発ソフトを無償提供
「Economist」のトップページがリニューアル
あなたがプログラムを理解できない10の理由:第2回
新APIまもなく登場--Google Developer Day 2008の見所とは?
仮想化によるコスト削減を見える化:オンラインTCOカリキュレータ
Firefox 3が対応したdisplayプロパティの値(2)
Ruby・Python・JavaScript・PHPについてどう思いますか?:Tim Brayに聞いてみた
来日したゲイツ氏が経団連で行ったスピーチ全文
グリーンITと「幼年期の終わり」
Web開発者向けツール Opera Dragonflyのアルファ版が登場
Rubyでどう書く?:RubyでPDF履歴書を作成する
Neil YoungがJavaOneにやってきた
内部統制対策を実現するIT運用管理ツール
リスティング広告における競争優位性の維持
-Simplify IT- ITをシンプルに 連載第2回