Webサイトといえば、
やはりPCでの大画面での見え方、デザインに醍醐味があります。
しかしながら、
今やそのアクセス端末のほとんどがスマートフォンとなり、
当然縦型ですし、
レイアウトも変わってくるわけですが、
場面によってはタブレットで見ることもあるでしょうし、
スマートフォンを横で見る人もいるかもしれない。
Web制作をするにあたり、
ここをクリアしないといけないわけですが、
全ての端末で確認することもできませんし、
これがなかなか難しかしくて、
チョクチョク現実逃避をしに行っていたわけですが、
今はこれで快適にサクサクになりました。
まずはこちらの動画。es,Groupのサイト編集画面ですが、
このようにPCとスマホの見え方は画面切り替えで確認する仕様となっていて、
尚且つ、編集モードではその両方のブロックが存在しているので
直感的にはわかりにくくなています。
慣れましたが。
縮小されても問題のないブロックはそのままでレスポンシティブとして生かせるのですが、
やはり端末によって自動識別により表示ブロックが変わるようにするブロックも出てきます。
しかし、
メインモニターの横のもう一つのモニターに
こちらの画面を表示しておけば
リアルタイムで各端末の見え方がわかっちゃうので、
かなり重宝しています。
それがこちらの開発者用のブラウザ
Blisk(ブリスク)
https://blisk.io
無料版だと使える時間が短いので、
実際使える状態にするには有料とはなりますが、
効率を考えるとコスパは良いと思います。
あと、英語版しかないのが少々ネックですが、
なんとかなります。
iosもAndroidも、
タブレットもPCも網羅しているので、
レイアウト崩れを最小限に抑えることができます。
ローカル環境で表示できればさらにいいんですが、
wi-fi6も使えるようになってきてますし、
お勧めです