<meta name="viewport">
このタグはブラウザがページを新しく開いた時に初期 viewport をどう設定するべきか指定する．viewport とはコンテンツをレイアウトするときに使用される想定表示サイズである．
単純に考えると，ブラウザのウィンドウサイズ=viewport サイズであり，実際，歴史的に両者は区別されていなかった．しかし近年はブラウザの実表示サイズとは別の viewport を設定することが可能である．両者にギャップがある時，コンテンツは拡大縮小表示される．
viewport が導入された動機は，デスクトップ用にデザインされたコンテンツを，モバイルの小さな画面に収めるためである．
表示幅 800px 程度を想定したデスクトップ用コンテンツを直接幅 400px 程度のモバイル機で表示するとレイアウトが崩れる．そこでモバイル版ブラウザは画面サイズと独立な viewport サイズを導入し，一旦コンテンツを viewport サイズに対してレンダリングしてから，画面サイズに合わせて拡大縮小するようにした．例えば safari は横幅 980px がビューポートのデフォルトサイズで，特に指定がなければコンテンツは一旦横幅 980 px でレンダリングされ，その後画面サイズに合わせて縮小される．
実際の表示サイズとビューポートサイズが違う，というのは余計な複雑さである．デスクトップ用コンテンツをモバイルの画面に収めるための工夫であり，コンテンツがはじめからモバイル用にデザインされているのであれば viewport サイズをわける必要はない．モバイルデバイス上でブラウザの画面サイズをそのままビューポートにしたければ，明示的にデフォルトの設定を上書きする必要がある．その指定が以下である．
<meta name="viewport" content="width=device-width, initial-scale=1.0">
参考
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
https://drafts.csswg.org/css-device-adapt/#viewport-meta