/favicon.icoやapple-touch-icon.pngを作りたい時のベストな方法2014.02.02favicon.icoやapple-touch-icon.pngを作りたい時のベストな方法ウェブサイトを作ったら必ずやっておきたのが、ファビコンの作成。スマートフォンでホームに保存する際に使われるapple-touch-icon。解像度に合わせて複数のサイズの画像をアップするのがベストだが、Photoshopで作るにしても手間がかかることは確か。Generatorのサービスを利用するといい。Googleで検索すると様々なサービスが存在するが、お薦めはこのサイト。Generatorなら、1枚のアイコン画像からfaviconはもちろんiPhone&Android向けの各種apple-touch-iconも一気に生成してくれる。512ピクセル×512ピクセルの画像を用意したら、サイトにアクセスしてアップ。各種画像データが含まれる圧縮ファイルのが作成されるので、自分のPCにダウンロード。圧縮ファイルを解凍すると以下のファイルがある。apple-touch-icon-57×57.pngtouch-icon-iphone-retina.pngapple-touch-icon-72×72.pngapple-touch-icon-114×114.pngapple-touch-icon-144×144.pngfavicon_sample.txtfavicon.icotouch-icon-ipad-retina.pngtouch-icon-ipad.pngfavicon_sample.txt以外のファイルをサイトのルート(index.htmlやindex.phpがある階層)にアップ。faviconやapple-touch-iconの設定は、inex.html等をエディタで開きfavicon_sample.txtの中身を追加。type="image/x-icon">を追加する。関連記事iPhoneサイトで上下に表示されるパネルを非表示にする方法。iPhoneをコメント対応にカスタマイズする方法デジタルゲートがお手伝いホームページをリニューアルしたい、スマホ対応にしたい、デザインそのままで機能だけ追加したい、更新だけ代行して欲しい。サイトを運営したいけど誰に相談したらいいか分からない。そんな時はお気軽にお問い合わせください。フリーランスで活動している人のためのマッチングサイトです。無料で自由に登録、ポートフォリオや自己PR・お仕事PRに活用してください。なりたい人と、写真家、モデル募集、被写体を探しているカメラマンのためのマッチングサイトです。無料で自由に登録、写真をアップして自己PRできます。ホームページ制作やリニューアル、ちょっと変わったサイトの企画・制作・運営をしています。