iPhoneのSafariで縦画面から横画面にすると文字が大きくなるのを防ぐ設定

最近全然お休みがなくて、旅行にも行けない四条せつな（@nuconeco_）です！

みなさんはどんなスマホを使っていますか？日本では、大半の人が「iPhone」という統計が出ているようです。私は、iPhone2台とAndroid1台という構成です（持ちすぎ）。

ところで、iPhoneの標準ブラウザ「Safari」では、画面を縦表示と横表示で、文字の大きさを変更する機能が標準でついています。・・・つまり、勝手に横画面表示にすると、文字が大きくなるんです。めんどい（笑）

ということで、今回はiPhoneのSafariで縦画面から横画面表示にしても、文字の大きさが変わらないようにする方法をお教えします！

横画面表示にすると文字が大きくなるのは、iPhone特有の機能

先程から話しているこの「文字の大きさが勝手に変わる」現象は、iPhone特有の機能の問題なんです。問題というか、わざと読みやすいように機能として備わっているようですが、作り手や読み手のどちらにしても、必ずしもこの機能が良いとは思わないようです。

コピペでOK！これでSafariで勝手に文字が変わらない！

上のコードを適用したいCSSに書いてしまえば、この問題は解決！めっちゃ簡単です！！

これで、縦画面表示も横画面表示も、文字の大きさが変わることはありません！！！

-webkit-text-size-adjust: noneはダメ！！

先程のコードで、「-webkit-text-size-adjust: 100%」としていますが、これを「-webkit-text-size-adjust: none」にしてはダメなんです！

こうしてしまうと、文字の拡大ができなくなってしまい、ユーザビリティが低下してしまいます。なので必ず、「-webkit-text-size-adjust: 100%」と表記するようにしましょう！

まとめ

ということで、iPhoneのSafariで、横画面表示にすると勝手に文字が大きくなる現象を解決する方法を紹介しました！

この機能は、便利機能だと思うのですが、うーん、ありがた迷惑ですよね（笑）