「Webサイトの制作を依頼したいけど、Webって専門用語とか多いし、なんか不安だなぁ」という方に向けて、Web制作でよく使われる用語をわかりやすく解説するシリーズです。
用語を知っておくことで、制作時のコミュニケーションがスムーズになり、自分たちの希望を伝えやすくなります。ぜひ一緒に学んでいきましょう！

今回はレイアウト編です。

レイアウトを一言で表すと「要素の配置」です。
Webページのレイアウトは「使いやすさ・操作しやすさ」を意識して設計されています。
いくつかのサイトを見てみてください。多くのサイトで、おおまかにこのようなレイアウトになっていることがお分かりになるでしょう。

このように共通の要素が同様の位置に配置されていることによって、使い勝手のよいサイトにデザインされているのです。
これらの要素にはそれぞれ名前がついており、Web制作の現場では頻繁に使われる用語となっています 。

■ヘッダー

Webページの上部に配置されるパーツです。タイトルやナビゲーションといった重要な情報が集まっており、ユーザーが目的のページにたどりつけるようにサイトの案内板の役割を果たします。

通常以下のような要素が入ります。

• ロゴ
• お問い合わせボタンや電話番号などのアクションを促すもの
• SNSへのリンク
• ナビゲーション（主要なページへのリンク）

■ナビゲーション

主要ページへアクセスできるリンクのことを指します。
呼び方は様々で

• • グローバルナビゲーション
  • メニュー
  • グローバルメニュー

などなど

ページ上部にあることが多いですが、デザインによっては設置場所が異なります。
サイトを訪れたユーザーにサイトの構成をひと目でわかりやすくするという役割を持っています。

■メインビジュアル

ユーザーがサイトにアクセスして最初に目にする画面（topページ）に配置された、大きな画像領域のことを指します。Webサイトの印象を決定づけるため、非常に重要な要素となります。

■コンテンツ

サイトのメインとなる要素で、掲載される情報（テキスト、画像、動画）を指します。

■フッター

ページの最下部に配置されます。ユーザーがひととおりページを見終わったあとに目に入るエリアのため、お問い合わせボタンや他のページヘと遷移させるためのサイトマップが置かれます。
デザイン面でもサイト全体のバランスを整えるといった役割を持っています。

■シングルカラムレイアウト

上記で説明したレイアウトをシングルカラムレイアウトと呼びます。カラム（Column）は英語で「列、段組み」を意味し、シングルカラムレイアウトはすべての要素が1列で構成されたレイアウトという意味になります。
どの画面幅のデバイスで見てもレイアウトが崩れる心配が少ないため、スマートフォンの普及により、このレイアウトを採用するWebサイトが増えています。ユーザーがコンテンツに集中できるといったメリットがある一方、ユーザーが直帰してしまい、他のコンテンツを見てもらいにくくなるというデメリットがあります。

■マルチカラムレイアウト

2カラム以上のレイアウトをマルチカラムレイアウトと呼びます。主にはメインコンテンツとサイドバーで構成されています。サイドバーにはサイトの回遊性を高める役割があり、ECサイトやニュースメディア、ポータルサイトなどの大規模なサイトで使用されることが多いです。
デメリットとしては、情報を載せすぎるとメインコンテンツへの集中が分散されてしまうという点があげられます。また、スマートフォンでそのまま表示させると文字が小さくなり、可読性、操作性が悪くなってしまうため、別途レイアウトの工夫が必要になります。

他にもカード・タイル型レイアウトなどがあるのですが、病院やクリニックで採用されるレイアウトは主にこの２つです。

まとめ

いかがだったでしょうか？ヘッダー、フッターなどの用語はWordやPowerPointなどで目にする機会も多く、覚えやすいと思います。
レイアウトはまだちょっと難しい…という方も、民間医局クリエイティブではサイトにあわせて最適なレイアウトをご提案させていただきますので、ご安心ください。
まずはお気軽にご相談をいただければと思います。

→お問い合わせはこちら

→Webサイトの制作事例はこちら