新規事業ご担当者様向けWEBサイト制作・運用ミニTIPSを各種SNSでお届けしています。

実機不要、Google クロームのデベロッパーツールを使ってスマホ表示の検証

2019/03/20 全て デザイン コンテンツ ディバイス対策

実機不要、Google クロームのデベロッパーツールを使ってスマホ表示の検証

seedポイント!

・各メーカーから発売されているスマートフォンの画面サイズは様々
・全ての実機検証は非現実的
・Google クロームのデベロッパーツールシミュレーションチェック

実機不要、Google クロームのデベロッパーツールを使ってスマホ表示の検証

各メーカーから発売されているスマートフォンの画面サイズは様々です。

制作したWEBサイトの検証は可能な限り各種スマートフォンでチェックしたいところ。

しかし全ての実機を用意することは現実的ではありません。

そこで、ブラウザ上でシミュレーションができるGoogle クロームのデベロッパーツールです。

このツールを利用すれば、サイズが統一されているiPhoneやiPadだけでなく、アンドロイド端末も数種類選択することが可能で、実装テストを行うことができてとても便利です。

利用方法は、クロームブラウザの上部右の「設定メニュー」から、「その他のツール」そして「デペロッパーツール」を選択します。

すると左側に、スマートフォン、シミュレーション表示、右側にソース表示の画面になります。

この画面では表示確認の他に、ソースコードのエラー調査など開発者向けに様々な作業が可能です。

シードでは、WEB担当者さま向けに作業効率可能なアドバイスなどもご提案しています。

興味がありましたらぜひお問い合わせください。

この記事を読んだあなたへのおすすめ

実機不要、Google クロームのデベロッパーツールを使ってスマホ表示の検証

このミニTIPSはお役に立ちましたか? 
シードでは・・・

(けど)ブランディングはしっかりしたい!