マルチデバイス対応

01マルチデバイス対応のメリット

BtoBのWebサイトの場合、BtoCのWebサイトよりもスマートフォンでのアクセスの割合が低いことが多いですが、それでも無視できる数字ではありません。
さらに検索エンジンはマルチデバイスに対応したWebサイトを高く評価しています。その評価は検索結果の順位にも反映されてきています。
このような理由から現在マルチデバイスに対応していないWebサイトはリスクがあると言えます。少なくとも今後新たに制作するWebサイト、リニューアルするWebサイトは、より多くのターゲットユーザーにリーチするという意味で、マルチデバイス対応であるべきです。

02レスポンシブデザイン

マルチデバイス対応のWebサイトは大きく分けると2種類あります。
ひとつはPCサイトと、スマートフォンサイトが全く別々なWebサイト。
もうひとつは、ブラウザの横幅のサイズによってレイアウトが変化する、ワンソース、ワンデザインを使用したレスポンシブデザインのWebサイト。

PCサイトと、スマートフォンサイトを別々に作成する場合、2つWebサイトを作成しなければならないため、ワンソース、ワンデザインのレスポンシブデザインのWebサイトよりもイニシャルコストがかかります。
さらにHTML5 + CSS3の時代に入り、Webサイトのレイアウトはより柔軟にできるようになってきました。レスポンシブデザインにより特化してきている、レスポンシブデザインに合わせて進化してきているとも言えます。
従って特別な理由がない限り、弊社ではレスポンシブデザインを提唱しています。

03HTML5 + CSS3

HTML5は、前時代のHTMLに比べてよりマークアップが重要になってきました。マークアップとは、コンテンツの内容を理解しながらレイアウト、文章をHTML上で構造化していくことです。
検索エンジンのアルゴリズムの進化により、Webサイトが適切に構造化されているか、ページが適切に構造化されているかは、検索結果に違いをもたらします。
HTML5は適切なマークアップを行い、極力シンプルにして、CSS3でレイアウト、装飾というのが最近のトレンドです。

そのCSS3ですが、やはり前時代のCSSに比べてより柔軟になり、できることが増え、表現力も増しました。
レイアウトに関しては、インターネットが普及し始めた当初は、Tableレイアウトでしたが、その後Floatレイアウトへ進化し、さらより柔軟なFlexレイアウト、そして最新のGridレイアウトまで進化してきました。
ただし、今現在（2021年8月）導入できるのはFlexレイアウトまでです。理由は、GridレイアウトはInternet Explorer 11 Webブラウザ、Androidの一部のWebブラウザがフル対応していないためです。

04バランスの重要性

Webの基本言語、HTML5 + CSS3の進化は日進月歩です。新しいテクノロジーが次々と輩出されています。しかしながら、新しいテクノロジーを使用することは、表現やレイアウトがより柔軟になりますが、一方でリスクも伴います。
Webサイトをより多くのデバイスへ対応させるためには最低限、以下のブラウザに対応させる必要があります。

各ブラウザは必ずしも仕様が一致していないため、Webサイトを制作する上で大事なことはどのテクノロジーを使用するかの見極めです。
弊社では、上記すべてのブラウザの仕様を把握した上で、その時その時で最適な選択、提案をしています。
ひいてはそれが、より多くのターゲットユーザーへリーチし、より多くのコンバージョンの実現に繋がります。