私は現在、クライアントのサイトで作業しており（まだ作業中です）、サイトのモバイルの問題のいくつかを修正しようとしています。
私が抱えている主な問題は、モバイルブラウザ（android + iphone）がサイトの左上部分に完全にズームインしてサイトをロードすることです。ビューポートの幅に関係なく、サイト全体の幅がビューポートに収まるようにズームアウトしたいのですが。
このサイトはここで見ることができます： http ：//www.graceprep.com
これに対する簡単な修正はありますか？私はHTML/CSSの経験がありますが、モバイルブラウザに関しては少し初心者です。
関連する可能性のある私のheader.phpファイルのHTMLを次に示します。widthプロパティを無駄に変更してみました。初期スケールのプロパティは効果的ですが、広すぎます。向きや画面サイズに関係なく、すべてのモバイルブラウザでサイトを完全にズームアウトしたいと思います。
これを行う方法はありますか？
なぜそのメタタグを持っているのですか？完全に削除すると、デバイスがズームレベルを自動的に決定します。
私はほとんどポジティブです
<meta name="viewport" content="width=device-width, initial-scale=1">
その問題を解決する必要があります。「幅」は任意の値に設定できますが、デバイス幅に設定すると、任意のデバイスのピクセル幅の値に調整されます。「初期スケール」は、指定された幅でズームレベルを制御します。
ほとんどのモバイルブラウザは、モバイルの幅よりもかなり広いデフォルトのビューポート幅を通信する傾向があるようです。たとえば、iOS Safariは、Webページの幅が980ピクセルであると想定し、利用可能なiPhone 4 320ピクセル（https://webdesign.tutsplus.com/articles/quick-tip-dont-forget-the- viewport-meta-tag--webdesign-5972）。Androidブラウザーは、800〜1024 CSSピクセルの幅に適応する傾向があります（https://developers.google.com/speed/docs/insights/ConfigureViewport）。
メタタグが実装される前に、予想される幅が何らかの形で伝達されているように見えるため、状況によっては、幅をデバイスの幅に設定すると、ズームインとして扱われるように見えます。ページのcssがメディアクエリを使用して適応しない限り、デバイスの実際の幅については、値の「width = device-width」の部分を見逃さないようにし、必要な他の制約を設定する方がよいと思います。