Google Chromeブラウザでスマートフォンサイトをチェックする:Google Chrome完全ガイド - @IT

56コメント 2014-03-21 17:59 @IT

Webサイトのスマートフォン表示の確認は結構面倒な作業です。でもGoogle Chromeのデベロッパーツールでエミュレートすれば、デストップ版ブラウザでスマートフォンサイトを簡単に表示できます。

ツイッターのコメント(56)

実機がないとなかなか難しいですが、Chromeのエミュレートモードで、見るのと実機で見るのは案外違っていたりするので、実機確認はレスポンシブデザインにおいてマストです(私も実務では色んな端末で確認します) 特にandroidが結構違っている気がします...😇
知ってるようで知らなかった。便利。
もしかしてこの方法でスマホでしか取れないe+のチケットをネカフェの回線で取れます?いやでもスクロールの速さ等の人為的要因でスマホには劣るか?
PC版Chromeブラウザでスマホサイトをチェックする:Google Chrome完全ガイド (アットマーク IT 2020年9月9日 5時00分 JST 公開)

この技を覚えておくと便利ですね。パソコン画面上で、iPhone・iPadやAndroid端末上での画面表示がエミュレート表示出来るのが良いです。
PC版Chromeブラウザでスマホサイトをチェックする:Google Chrome完全ガイド - @IT
これで確認したらやっぱHPのタブ一部表示されない設定になってるっぽい。
CSSの設定でそうなってるんだから仕方ないとはいえ、やはりレスポンシブデザインからは大きくかけ離れているような気がするなぁ~(-ω-;)
スマホテスト環境いいのないかなって探したら、Chrome Developer Tool で出来ちゃうのか、、、もうスマホいらんな(違
PC版のChromeではスマホの検証も可能です。

ただし、実機と100%同じ動作をする保証は無いので、必ず実機での確認を推奨します。

できればiPhoneのChrome、Safari、Firefox、AndroidのChrome、Firefoxはチェックしよ!

PC版Chromeブラウザでスマホサイトをチェックする
PC版Chromeブラウザでスマホサイトをチェックする
@komazawa_ko なるほど。わからんw 図示系は Skitch 使ってるけど、それも違うかな?スマホ画面なら Chrome のディベロッパーモードでサイズ設定があるね。違うかーw
 
PR
PR