Ubuntu でさまざまなデバイス上の Web サイトをエミュレートするにはどうすればよいですか?

Ubuntu でさまざまなデバイス上の Web サイトをエミュレートするにはどうすればよいですか?

私はウェブサイトのフロントエンドに取り組んでおり、さまざまなシステム/ブラウザでコードがどのように動作するかを確認する必要があります。Firefox と Chromium には、ディスプレイをさまざまなサイズに設定できる開発ツールがありますが、Apple のアップスケーリング メカニズムを完全にエミュレートすることはできず、サイトの外観は依然として若干異なります。また、さまざまなブラウザを考慮していません。

自分のサイトがさまざまなデバイスやブラウザでどのように表示されるかを確認するために、Ubuntu で使用できるツールやソフトウェアはありますか?

答え1

次のようなサービスがあります:

  1. ブラウザスタック
  2. モバイルテスト
  3. レスポンシミュレーター
  4. 食欲をそそる- おそらく最高ですが、私にとっては痛々しいほど遅いです。

さらに良い方法は、実際に物理デバイスでサイトをテストすることです。これらの方法はすべて遅いことがわかりました。

答え2

レスポンシブpx

ローカルまたはオンラインのサイトの URL を入力し、コントロールを使用してビューポートの幅と高さを調整し、ピクセル単位で正確なブレークポイントの幅を見つけます。次に、その情報をメディア クエリで使用して、レスポンシブ デザインを作成します。

レスポンシブpx GitHub

responsivepx で最高の結果を得るには、既成概念にとらわれずに考える必要があります。何らかの理由で、responsivepx では、Bing や複雑なニュース Web サイトは問題なく表示されるのに、Google や Twitter では空白の白い画面しか表示されません。

関連情報