Webサイトをスマホ対応させたい

スマホ対応しなくても、スマートフォンで閲覧は可能!?

実際に、スマホ対応を行っていないサイトでもスマートフォンで閲覧することは可能です。

しかし、PCでは見やすくてもスマートフォンで表示すると、文字が小さかったり、コンテンツが画面からはみ出していたりするサイトを見たことはありませんか？

PCはPCの表示デザイン、スマホはスマホの表示デザインを

一昔前のWebサイトでは、PC用のページとスマホ用のページを別々に用意し、「スマホサイトはこちら」などといったボタンで誘導する形が主流でした。

現在では、PCもスマホも同じページで表示し、ユーザーのデバイス毎に最適な表示になるように調整を行っており、そのような調整を一般的にスマホ(レスポンシブ)対応と呼んでいます。

様々なサイトを閲覧していて、一番多いケースは調整(スマホ対応)も行わず、PC用とスマホ用で別々にページを用意することもしていないサイトです。

そのようなサイトではどのようなことが起こっているかというと、PCの表示がスマホでもそのまま縮小されて表示されてしまっており、スマホではまともに閲覧することが出来ず、せっかく訪問したにも関わらずなにも情報も得られないまま離脱してしまっているのです。

スマホの普及率が90%を超えている現状がございますので、スマホ対応されていないサイトであれば早急に行うことを推奨いたします。

レスポンシブデザイン

先述の通り、スマホ(レスポンシブ)対応とは、「PCもスマホも同じページで表示する」ということなのですが、実際にはどのような作業が必要になるのか説明させていただきます。

どちらかと言うとWeb制作者側に必要な知識なのですが、Webデザインの基本的な知識ですのでWebサイト制作を検討している方や、既にWebサイトを所有している方も知っておいて損はありません。

まず前提として、一般的にWebサイトはHTML,CSSで構成されており、アニメーションなどの動的な部分はJS(JavaScript)や、PHPといった言語で構成されています。

スマホ対応されていない「PC用のページとスマホ用のページを別々に用意しているサイト」は、それぞれにHTMLファイルが存在し、それぞれにCSSのコードを記述している

ということになります。

それに対して、スマホ対応を行ったサイトは「1つのHTMLに対して、PC表示とスマホ表示を切り分けて指示するようにCSSのコードを記述」しています。

ですので、スマホ対応に含まれる作業は、「HTMLを1つにまとめる作業」と「PC表示とスマホ表示を切り分けを指示するCSSを記述する」といった内容になります。

それに加えて、PC表示しか存在していない場合、まずはスマホ表示のデザインを作成する作業も必要となります。

SEO評価への影響

SEO評価の基準として、ユーザーにとって有益な情報が掲載されていること、より使いやすく、必要な情報へ辿り着けること、などユーザーにとって価値があるサイトが上位に上がりやすいとされています。

そうした中で、近年のWeb業界ではレスポンシブデザインを標準対応としている制作会社が大半となってきており、スマホ対応をしていないことはSEOに対してマイナスな要素であり、プラスに働くことは無いと考えても良いでしょう。

新規制作・リニューアル時のレスポンシブデザインの考え方

新規制作・リニューアルの際、必ずお客様に確認させていただくことがございます。

リニューアルであれば、既存のサイトのデバイスごとの訪問率を教えていただければと思いますが、
新規制作の場合、ターゲットを絞って、ペルソナを設定する際、閲覧している「デバイスは何を使用していますか？」という質問をさせていただきます。

WEBデザインにおいて、PCとスマホでは見せ方や表現の自由度が大きく異なります。一番大きな違いは画面幅の違いですが、操作方法や閲覧のシチュエーションなど、どちらにとっても最適な見せ方をすることが重要です。

その中でも、訪問の割合が高いデバイスに最も最適な見せ方をご提案させていただきます。

レスポンシブデザインで作成されたテンプレート

WordPressなどのCMSでは、様々なテンプレートが用意されており、ほとんどのテンプレートがスマホ対応されております。

時間や予算が限られている方、ご自身で作業が可能な方などはテンプレートを活用されても良いかと思います。

レスポンシブ対応可能な制作業者

Vanilla Bearでは、新規制作・リニューアル共にレスポンシブデザインを標準で対応させていただいております。

制作・リニューアル、もちろん更新作業もスマホ対応を標準対応とさせていただいておりますので、お気軽にご相談頂ければと思います。

白熊の更新屋（更新代行サービス）

こんな人におススメ

パッケージングサイト制作

こんな人におススメ

完全オーダーメイドサイト制作

こんな人におススメ