Make 24 monthly payments Pay 0% interest Start using the domain today. See details
iPhone4 がついに届いて興奮気味のgunjiです。 2週間待ちでした! 待ってる間に、iPhone4も対象としたWEBアプリ(ネイティブアプリのweb view を含む) のコーディングで気をつけることについておさらいしていたところ、 Retinaディスプレイに画像を最適化させるのって意外とめんどいよね! という現実に打ちのめされたので、まとめてみます。 そもそもRetinaディスプレイってなんでしたっけ? はいはい、iPhone4の目玉のひとつで、今までの2倍の解像度で 画面がとってもキレイに見えるんですよね! 拡大しなくても小さな文字が読めるなんてサイコー! ところが、今までiPhone向けに作ったサイトをこのiPhone4で見るとちょっと 不思議な状態になってることがあるのです。 iPhone4で見たらなんか画像がにじんでるように見える・・・?! こういうイメージです。 そう、
iPhone用のサイト制作の仕事が来そうなので、前もって情報をさっくりと集めておいたのですが、せっかくなので公開してしまおうと。特に目新しい情報という訳ではなくて、いろいろと散らばっていた物をまとめた物です。 iPhone対応と最適化(提案ベース) iPhoneの仕様的な部分 実相時のiPhoneの判別方法 html実装まわり viewport設定 ホーム画面にアイコンを表示 manifestファイルの設定 iPhone対応と最適化(提案ベース) ・iPhone対応 → iPhone搭載のSafari4対応 ・iPhone最適化 → ・3G通信、Wifi通信を考慮 ・UIのカスタマイズ ・ブラウザキャッシュの最適化もしくは調整等々 ・manifestファイルの設定 ・ローカルストレージによるデータの保存 iPhoneの仕様的な部分 ディスプレイサイズ 320px * 480
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" /> /* 好ましくない例 */ これを使うことで横幅1024px以下のデバイスでアクセスされた場合に、ipad.cssを読み込むということはできるんですが、PCの場合でもこの程度の解像度のものはありますし、なおかつ利用しているブラウザが最近のものであれば、このコードを理解してしまいます。 つまり、「iPadだけ」に適用させるということは実質できないということになります。 この点はご注意ください。 デバイスの幅に左右されないリキッドレイアウトにする 前述のユーザーエージェントの話に次いで、レイアウトの話です。 iPadのデバイスとしての画面サイズはポートレート(縦向き)であれば 横
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く