神戸 大阪 宝塚 ホームぺージ制作会社

設定の違いで同じhtmlサイトがスマホ対応サイトに!

2019/07/22

この記事の投稿者

みのるくん

スマホでWebページを閲覧していると、パソコン専用ページが表示されることはありませんか?パソコン画面が表示されると、開くのが重かったり、文字のサイズが小さくて読みづらかったりなどの弊害が出てストレスが溜まることもあります。そこで、パソコンサイトとスマホサイトの作り方の種類などをご紹介します。

スマホ対応ではないhtmlサイトで困ることは?

表示画面への影響大

パソコン用サイトがスマホに表示されたときに最初に戸惑うのは、文字サイズが小さいことでしょう。文字が小さいまま読み続けると目が疲れたり、リンクボタンを押しづらかったり、間違って違うリンク先に飛んでしまったりします。

それらを避けるために行う拡大にも、問題が生じてくるのです。例えば、スクロール回数が増える、全体像が分からない、希望の位置まで移動しにくいなどが起き、ストレスの原因となることが挙げられるでしょう。

パソコンに合わせたサイトは文字や画像、動画などの情報量が多いため、重くなります。それによってページを呼び出すのに時間が掛かり、イライラして見るのを諦める人も出てくるでしょう。

文字サイズ、情報量の兼ね合いなど、パソコンサイトそのままではスマホでの閲覧に問題があるといえます。

スマホ対応にしていないとアクセス数に影響

スマホの保有率は年々増加しています。パソコンは持っていないけれどスマホを持っている人も多く、若い人たちの情報収集はスマホからが一般的です。

スマホに対応していないサイトは、読みづらい、操作性が悪いということで閲覧者にストレスを与えます。その結果、そのサイトから逃げられることになってしまうのです。

ビジネスに関係のないサイトなら、アクセスが伸びなくても自分が落胆するだけですむかもしれません。しかし、これが企業やアフィリエイトなど宣伝や利益のために運営しているものなら、収益に直結してくるでしょう。

また、閲覧者の意識だけでなくgoogleの検索順位にも影響があります。なぜなら、スマホに対応しているか、否かで検索順位を変動させるプログラムが採用されているからです。

そのため、できるだけ多くの人に閲覧してもらうには、スマホに対応したサイトが必要ということになります。

スマホ対応のhtmlってどんなもの?

広く使われているのは「レスポンシブWebデザイン」

スマホに対応したサイトにするための方法として有名なのが、「レスポンシブWebデザイン」です。この設定を使うと、サイトにアクセスしてきた端末に反応して適切なものを表示させることができます。

一番正しく表示されるのは、その端末やブラウザのバージョンなどに配慮して別々のサイトを作り上げることです。しかし、そのようなことをしていては、労力やコストが大きくなってしまいます。

そこで、利用されるのがレスポンシブWebデザインです。この設定の利点は、パソコンとスマホ兼用のhtmlサイトを作るだけでよいため、一度に両方の更新が可能なことでしょう。

ただし、端末により表示画面が切り替わるようにCSS(スタイルシート)で各対応端末のサイト幅や文字サイズなどを指定する必要があります。

難点は、パソコンとタブレット・スマホに対応するため、デザインが限定されてしまうところです。

デザインを気にするなら別々のhtmlサイト作り

一つのサイトを作ってアクセス時に自動的に切り替えられるシステムは、管理や更新のことを考えると楽です。しかし、デザイン性を重んじる人や画像が多い場合は、パソコンとスマホのサイトを切り分けた方がよいでしょう。

この場合、URLは同じなのにアクセスした端末の違いで誘導されるサイトが変わる「.htaccess」ファイルを使う方法があります。レスポンシブWebデザインとの違いは、パソコン用とスマホ用の二つのhtmlサイトが必要になることです。

二つのサイトの管理は大変になりますが、それぞれに合わせて作ることができるため、デザインにこだわる人にはよいでしょう。

まとめ

スマホサイトを作るための特別なhtml言語があるわけではなく、設定の仕方でパソコンサイトとスマホサイトに分けることができます。一つのサイトを作りCSSで見え方を適正化するやり方と、最初から専用サイトを別に作る方法です。

どちらにもメリットとデメリットがあります。どちらを選ぶかは、求めるものや負担と相談して選びましょう。

お気軽にお問い合わせください。

ラフデザインのサービス一覧

  • ホームページ制作新規サイト・リニューアル・Wordpressを利用したホームぺージ制作に関する業務を行います
  • ホームページ制作採用サイトや採用動画の制作などの、採用サポートは当社の強みの一つでです。
  • ホームページ制作ドメイン・サーバーの管理や、サイトの運用・更新方法などを幅広くサポートします。
  • ホームページ制作採用向けや会社のご紹介向けのなどの動画制作も承っております。
  • ホームページ制作検索結果で上位に表示するための的確なアドバイスとサポートを行います。
  • ホームページ制作GoogleやYahoo!などの広告やSNS運用支援など幅広くWebプロモーションを行っています。
  • ホームページ制作パンフレットやチラシなどの印刷物のデザインからご納品まで当社にお任せください。

アーカイブ

CONTACT
お問い合わせ

Webサイト制作・採用ツール制作・Webサイト運用サポート・動画制作

move_top