ホーム >  WEB全般 >  PCでスマートフォンサイトをブラウザチェックする


Posted:2014/11/28 9:00:23 AM|Category : WEB全般

PCでスマートフォンサイトをブラウザチェックする

 レスポンシブなWebサイトを作る場合、スマートフォンやタブレットでも正しく表示できるかテストします。
テスト環境を作るだけでも大変な作業量です。
しかし、安心してリリースするために必ずチェックしましょう。

ブラウザチェック

 実機に近い状態でチェックできるブラウザがあります。
ただし、PCブラウザでのチェックは簡単な表示テストのためであり、まったく同じ表示ではありません。
※当然ながらタッチ操作はできません。
safari for windows
Chrome

safari

①右上の歯車のマークをクリックして、「設定」を選びます。
less0005
②「詳細」をクリックして、「メニューバーに”開発”メニューを表示」にチェックします。
less0004
③右上のプリントマークをクリックして、「開発」→「ユーザーエージェント」を選択し、ブラウザのバージョンを選択します。
less0006

Chrome

①「その他ツール」→「デベロッパーツール」を開きます。
less0002
②スマートフォンのマークをクリックします。
less0001
③Consoleウィンドウ(下のウィンドウ)にある「Emulation」タブをクリックします。
すると、「Model:」ドロップダウンがりますのでスマートフォンのバージョンを選択します。
less0003
これらはiphoneやAndroidに搭載されているブラウザで、PC版と同じWebkitエンジンを利用しています。


トラックバック用のURL
プロフィール

名前:イワサキ ユウタ 職業:システムエンジニア、ウェブマスター 誕生:1986年生まれ 出身:静岡県 特技:ウッドベース 略歴 2008年04月 金融機関系I

最近の投稿
人気記事
カテゴリー
広告