モバイルフレンドリーって？

2015年09月7日

前のトピックで「スマホ対応のウェブサイト」について書きましたが、どうすればモバイルフレンドリーなホームページが作成できるのでしょうか。そもそも「スマホ対応」の定義って何なのでしょう。

Googleのモバイルフレンドリーテストで「日本最古のホームページ」と言われているサイトをチェックしてみました。

予想通り「モバイルフレンドリーではありません」と判定結果が出ます。その理由も記載されています。
・テキストが小さすぎて読めません
・リンク同士が近すぎます
・モバイル用 viewport が設定されていません

上の二つは拡大すれば解決するじゃないか・・・と思われるかもしれませんが、それではもう不親切であるということなのかもしれません。スマートフォンで閲覧する時は、拡大縮小などを行わず、操作もパソコンと異なり指でタップするためボタン類を押しやすく配置する必要があるのです。
viewport というのは、どんな画面の大きさでサイトを構築しているかという設定になります。

どのくらい文字が大きければ良いのか、リンクが離れていれば良いのかという基準は、はっきりと公開されていませんが、スマートフォン用にホームページを作成するとこれらは満たされていきます。あとはスマートフォン用に作ったサイトの想定サイズを適切に記述すればモバイルフレンドリーテストはパスできるでしょう。

次回はスマホ対応のための２つの方法を解説いたします。