Googleは、モバイル端末(スマートフォンなどポケットサイズの端末)でのウェブサイトの可読性を評価するようになっています。
つまり、モバイル端末で閲覧する人が見難い、と感じるサイトは、モバイル端末での検索順位を下げる可能性がある、という意味です。
https://developers.google.com/webmasters/mobile-sites/mobile-seo/?hl=ja
で、その評価は、Googleが提供するモバイルフレンドリーテストでチェックすることが出来ます。
https://www.google.com/webmasters/tools/mobile-friendly/
とあるサイトをチェックすると、こんなことを言われてしまいました。
ページがモバイル フレンドリーではないと判断される可能性のある理由
×テキストが小さすぎて読めません
×モバイル用 viewport が設定されていません
×リンク同士が近すぎます
でも、そのサイトはCSSで画面サイズに併せて2カラムから1カラムに表示を変えるようになっていて、実際にiPhoneでチェックしても問題ありません。
なのに、Googleのモバイルフレンドリーテストでは合格できません。
で、いろいろ調べてみたら、headタグ内にmetaタグでviewportを追加すれば解決するとわかりました。
具体的には、
をheadタグ内に追加する。