ホームページのパソコン用・スマホ用の違いとスマホ対応にする方法

総務省のデータによると、2016年には20代の94.2%がスマホを保有しており、20代から50代までの間で高い水準で1人1台はスマホを保有しているというデータがあります。 これほどまで多くの人がスマホを保有しているということは、情報をスマホから検索して得るという方が多いということにもなります。 さまざまな情報を提供するホームページは、スマホに対応しておいたほうがいいことがわかりますが、スマホ用ホームページとパソコン用ホームページの違いは何なのでしょうか? 今回は、ホームページでパソコン用とスマホ用の違いについて解説していきます。

ホームページのパソコン用・スマホ用の違いは?

ホームページのパソコン用とスマホ用の違いは、「ディスプレイサイズ」「フォントサイズ」「ナビゲーションメニュー」の3つの違いがあります。 ここからは、これら3つのパソコン用・スマホ用ホームページの違いについて解説していきます。

ディスプレイのサイズの違い

ホームページでパソコンとスマホの違いをあげると、まずはホームページを表示するディスプレイサイズの違いがあります。

パソコンではディスプレイ幅が1,000pxを超えるのに対して、スマホのディスプレイはその半分以下。小さいものでは320px程度しかありません。

そのため例えばパソコン用ホームページをスマホで閲覧した際、スマホ対応になっていない場合は異様に幅が狭かったり、コンテンツの一部が表示されないなどのトラブルが起こる場合が多いです。

フォントの違い

ホームページを表示するディスプレイサイズの違いがあるということは、文字の大きさであるフォントの大きさもパソコンとスマホで違います。

パソコンでは、フォントサイズは16px以上なのに対して、スマホでは12〜14pxが標準サイズと言われていますが、幅広い年代をターゲットにするホームページであれば、フォントサイズは16〜18pxが主流です。

また改行の有無も文字を見やすくするのに欠かせない要素になってきますが、あまりにも多い改行はユーザーのストレスにつながります。

改行のわずらわしさを減らすのであれば、フォントサイズは小さくすると良いでしょう。

ナビゲーションメニューの有無

パソコン用ホームページとスマホ用ホームページの最後の違いは、ナビゲーションメニューの有無です。

ナビゲーションメニューとは、ホームページ内の各コンテンツページへリンクされている「目次」のような役割をもつメニューのことで、有名なものであればハンバーガーの形に見える「ハンバーガーメニュー」は、多くのホームページやSNSで取り入れられています。

パソコン用ホームページはディスプレイ幅を大きく持たすことができるので、1ページに多くの情報を取り入れることができますが、ディスプレイが小さいスマホ用ホームページでは、簡略化できる情報はコンパクトにする必要があります。

そこでハンバーガーメニューのようなナビゲーションメニューを取り入れることで、情報を整理して格納することができるので、すっきりとしたホームページにすることができます。

簡単にパソコン・スマホどちらも見やすいホームページを作るなら「Komaca」

ここまでご紹介してきたように、それぞれのホームページの違いを意識して、スマホ用ホームページとパソコン用ホームページを別々に作るのはとても大変です。

そこで近年では、1つのホームページをスマホ用とパソコン用の両方に対応させることができる「レスポンシブデザイン」が主流となっています。

これからスマホ用とパソコン用ホームページを作ろうと考えている方は、レスポンシブデザインに対応したホームページにすることをおすすめしますが、簡単に作る方法はあるのでしょうか? 

ここからは、無料から簡単にパソコン用・スマホ用ホームページを作ることができる「Komaca」についてご紹介いたします。 

無料からスマホ用・パソコン用ホームページを作ることができる

Komacaは、無料から利用できるホームページビルダーです。

専用スマホ用アプリやKomacaホームページ上でホームページを作成・管理することができて、作成したホームページはパソコンとスマホどちらでも問題なく表示させることができます。

ホームページの管理に必要なアクセス解析も無料から利用することができますが、より本格的な機能は有料で利用することが可能です。

豊富なデザイン、もちろんオリジナルデザインにもできる

Komacaはこったデザインを最初から考えるのが難しいという方へ、豊富なデザインカスタマイズ機能を用意しています。

もちろん自分で用意した画像などを利用すれば、あなただけのオリジナルデザインのホームページを作ることが可能です。

各種カラーも変えることができるので、簡単におしゃれなパソコン用・スマホ用ホームページを作ることができます。

まとめ

パソコン用とスマホ用ホームページの違いは、「ディスプレイサイズ」「フォントサイズ」「ナビゲーションメニュー」の3つの違いがあります。

Komacaなら、簡単に無料からパソコン用・スマホ用のホームページを作成することができるので、専門的な知識や技術ゼロであなただけのホームページを持つことができます。

UnsplashのGiulia Squillaceが撮影した写真
unsplash.com