駅情報検索をiPhone / iPad / Facebookページ / PCに最適化
駅情報検索は必ずしもPCだけで使いたいものではないので、デバイスの表示の最適化はやりたかったのです。今まではPC用とiPhone用に振り分けてたのですが、一つのCSSファイルにまとめました。
【レビュー】自由に使えるiPhone/iPad/Android/PC向け切り分けCSSテンプレート | エンタープライズ | マイコミジャーナル
CSSファイルはこんな感じ。
@charset "utf-8"; /* CSS Document */ 共通のCSSとFacebookページを想定したCSS /* Smartphones (portrait and landscape) ----------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { iPhoneを想定したCSS } /* iPads (portrait and landscape) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { iPadを想定したCSS } /* Desktops and laptops ----------- */ @media only screen and (min-width : 1200px) { 大きな画面のPCを想定したCSS }
これを追加。
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;" />
これで大分行けますね。ただガラケーの最適化ノウハウが無いのと端末も持ってない。どう表示されているのか、ちと不安。

加藤 康祐 / 企画・設計
プランナー、デザイナー。加藤康祐企画設計代表。Webデザインを入り口に、2005年よりフリーランスとしてのキャリアスタート。主な仕事としてベンチャー企業でのサービスのUXデザイン、独法との防災メディアの運営、社会的養護の子どもたちの自立を支援するNPOのサポート。ラグビーと料理、最近イラスト。
是非、フォローしてください!
Twitter / Instagram
『ひとり仕事: フリーランスという働き方』 加藤 康祐
posted with amazlet at 15.09.10
(2012-10-5)
売り上げランキング: 14,705
100円
売り上げランキング: 14,705
100円
Amazon.co.jpで詳細を見る
フリーランスとして働き始めるってどういうことだったのか?フリーランスとして働くってどういうことなのか?フリーランスが目指すことってなんなのか?5年間の自分の経験から書きました。(2010年執筆)
フリーランスとして働き始めるってどういうことだったのか?フリーランスとして働くってどういうことなのか?フリーランスが目指すことってなんなのか?5年間の自分の経験から書きました。(2010年執筆)