スマホ / タブレット / PCWEBページの見え方

[admin]

スマホ / タブレット / PCWEBページの見え方
http://pasopia.velvet.jp/nota2/nota/?20180413121054

最近は自分でホームページを制作する人も少なくなってきましたが、ホームペ
ージを制作する上でブラウザでどう見えるかというのは重要な問題です。以前
はIEとFirefoxの違い等に気をつければ良かったのですが、最近ではスマホ・
タブレット端末（ios、アンドロイド）も増えてきている。そこで完成したホ
ームページの見え方をブラウザ別にチェックする必要が出てきました。そんな
時便利なサイト・ツールの紹介です。実際には本当の端末でチェックする必要
はありますが、大雑把にチェックできます。

１．Viewport Resizer
Responsive design testing tool – Viewport Resizer
http://lab.maltewassermann.com/viewport-resizer/
レスポンシブの確認にVIEWPORT RESIZERが今更ながら便利すぎるというお話
http://okaoka.net/2013/02/10/viewport-resizer-responsive-tester.html

Webブラウザのブックマークメニューバーに貼り付ける。チェックしたいホー
ムページを表示しておいて「Resizer」を押すとスマホ/タブレット（ios）が
表示されるので、それを選んでどう見えるかをチェックすることが出来る。ま
た自分で画面の大きさをカスタマイズすることも可能。

２．Responsinator
http://www.responsinator.com/

ここにアクセスしてチェックしたいホームページのURLを入力するとスマホ/タ
ブレットでどう見えるか一気に表示される。このサイトではAndroid端末も表
示される。（実際のスマホ等は自動的に縮小されるがこのサイトは縮小はされ
ない）