今日はバレンタインデエなんですが、歯を悪くしているので気持ちだけ頂きますsexykentです(･_･) コラコラ、押すな押すなッ並んで並んでッ

iPod touch／iPhoneの色んな環境が出てきている。そのうち、俺の関係するWeb関連のものは、きちんと直していかなきゃならん。

iPhone向けWebアプリケーションとコンテンツの最適化

さて、1月のiPod touchソフトウエアアップデートで追加された機能に、Safariのブックマークをホームにアイコンとして貼り付けておけるようになったことが挙げられる。で、このアイコンを自作できるというので、Mac系ブログの情報を元に作成してみた♪

手順は簡単だ。60*60ピクセルのpng画像を作って、サーバーにアップし、headタグ内にソイツを指定すればいい。

60*60の画像は、IllustratorであればRBGモードで60*60のステージの新規ファイルを作って、画像やらを配置していくのがいいだろう。小さい文字は読み辛いので、ソレと見て分かる大柄なワンポイントがお勧め。また、正方形に作ってアップするが、自動的に四隅にアールが取られ、クリスタルなアイコンに処理されるため、ソレを想定して作り…まぁ、案外単純な方がいいな。

そして、Adobeソフトであれば「ファイル」メニューから「Web用に保存」を選んで、PNG形式、ステージサイズで画像を切り取る設定で書き出せばいい。ファイル名は必ず、

「apple-touch-icon.png」

にする。自分のブログやホムペのサーバーに上記ファイルをアップロードする。そして、HEADタグ内に以下を追加。

<link rel="apple-touch-icon" href="画像のパス/apple-touch-icon.png"/>

ブログで画像のパスが分からないケースであれば、一度画像をブログに貼ってソースを見るか、貼った画像を右クリックしてコンテキストメニューから「アドレスをコピー（リンクをコピー）」すれば分かるだろう。