FC2ブログ

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

iOSアイコンをホーム画面に登録しよう!

iOSアイコン登録方法
前回作成した「iOS風アイコン」を実際にiPhoneなどの画面に登録!
使用アプリケーションはPhotoshopのみ。
前回作成したファイルで簡単に登録設定ができます。



iOSアイコン登録方法1
前回作成のPhotoshopレイヤーファイルを用意します。
デザイン制作した「角丸」の枠を不可視にします。
新たに「STUDIO HERMIT」とお好きな書体で記述します。
あまり細い文字でないほうがよいでしょう。


iOSアイコン登録方法2
次に画像をアイコン用のサイズに調整します。
画像解像度、サイズは114pix正方形に調整します。
できたら「WEB用に保存…」で保存します。
現在のiOSデバイスは表示解像度がよいので、
JPEGやGIFではなく「PNG」ファイル形式で保存します。


iOSアイコン登録方法3
自分のWEBサイトのトップページのソースを開きます。
<TITLE>の直前にアイコンを呼び出すタグを記述します。
記述するタグは、
<link rel="apple-touch-icon-precomposed" href="アイコン画像ファイルを置いたルートパス" />

「アイコン画像ファイルを置いたルートパス」の記述参考例。
トップ階層/以下に「img」フォルダを作り、その中に「icon.png」というファイルを置いた場合、
<link rel="apple-touch-icon-precomposed" href="img/icon.png" />
となります。


iOSアイコン登録方法4
iPhoneなどで、自分のWEBサイトを開きます。


iOSアイコン登録方法5
トップページを開いたらブックマーク記録ボタンをタップします。
「ホーム画面に追加」をタップします。
この時にアイコン下のアイコン名を短いコピーに調整します。
ホーム画面の各アイコンに表示できる文字数に限りがあるからです。


iOSアイコン登録方法6
ホーム画面のお好きな位置に設定して、完成っ!
アイコンの「角丸」加工はiOSデバイスが自動で作成します。

Apple製品のカスタマイズ性は、今なお健在ですね!

I'll be in touch.
スポンサーサイト

テーマ : Photoshopを楽しもう!
ジャンル : ブログ

tag : iOS iPhone ipad アイコン タップ フォトショップ Photoshop apple macintosh アップル

コメント

Secret

スタジオハーミットRSS
プロフィール

STUDIOHERMIT

Author:STUDIOHERMIT
スタジオハーミットのオフィシャルブログです。Adobe Photoshop,Illustratorのスキル、Apple Macintosh関連の情報を配信しています。

最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
Mail form.

名前:
メール:
件名:
本文:

検索フォーム
リンク
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。