Webデザイン用語集一覧/ホームページの各パーツ名称やバナーについても解説

Webサイトのデザインを考える際、さまざまな専門用語が使われます。特に、中小企業や個人事業主が自社のホームページを作成・運用する際には、基本的な用語を理解しておくことが大切です。

今回の記事では、Webデザインに関する基本的な用語を詳しく解説します。これらを理解することで、中小企業経営者が制作会社とのやりとりがスムーズになり、より効果的なWebサイトを作ることができるでしょう。

Webサイトの構成

トップページ・ホームページ

Webサイトの中で最も重要なページであり、訪問者が最初に目にするページです。多くの場合、サイトの概要や主要コンテンツへのリンクが配置されます。

「ホームページ」とは基本的にトップページを指しますが、Webサイト全体のことを指す言葉として広く普及しています。

下層ページ

トップページからリンクされている、詳細な情報を提供するページのことです。企業サイトであれば「会社概要」「サービス内容」「お問い合わせ」などが該当します。

ヘッダー

Webサイトの最上部に位置し、ロゴやナビゲーションメニュー、検索バーなどが配置されるエリアです。サイト全体で共通のデザインが使われることが一般的です。

カラム

Webページのレイアウトを構成する「列」のことを指します。1カラム(シングルカラム)、2カラム、3カラムといったレイアウトがあり、サイトのデザインや情報の見せ方に影響を与えます。

PCサイトのみの時代ではオンラインショップなどコンテンツが多いサイトは3カラムが採用されていましたが、最近ではスマホメインのため、1カラムのサイトが多い状況です。

コンテンツ

Webページの主な情報部分を指します。記事・画像・動画・製品情報など、訪問者に価値を提供する内容が含まれます。

サイドバー

ページの左右どちらかに配置されるエリアで、メニュー・バナー広告・SNSリンク・関連情報などが表示されます。特にブログやニュースサイトで多く見られます

フッター

Webページの最下部に位置し、著作権表記・プライバシーポリシー・利用規約・SNSリンク・サイトマップなどが含まれるエリアです。

坂井

上記はWebサイトを制作する上で基本的な用語ですので、サイトを作成する前に理解しておきましょう。制作会社との共通認識を深めることで、各パーツの構想や修正連絡のやりとりがしやすくなります。

Webデザイン

サイトマップ

Webサイト全体のページ構成を一覧化したものです。Webサイト内にページを作成してリンクを設置することで、ユーザーがスムーズに目的のページへ移動できるようになり、SEO対策にも役立ちます。

ワイヤーフレーム

Webページの設計図のようなもので、コンテンツの配置や構成を視覚化したものです。デザインを作る前に、情報設計を考える際に使用されます。

ファーストビュー

Webサイトを訪れた際に、スクロールせずに見える範囲のことです。ここに魅力的なコンテンツを配置することで、ユーザーの興味を惹きつけることができます。

閲覧者を惹きつけるため、企業サイトであれば、商品・サービスの魅力、会社の特徴などを掲載します。

具体的には、動画、スライドショー、成約に繋がるバナーなどを設置します。

ハンバーガーメニュー

スマートフォンやタブレット向けのWebデザインでよく使われる、三本線のアイコンをタップするとメニューが表示される仕組みです。

レスポンシブ

デバイスの画面サイズに応じて、自動的にレイアウトを調整するデザイン手法です。PC、タブレット、スマートフォンなど、異なる端末でも最適な表示ができます。

ユーザビリティ

Webサイトの使いやすさを指します。直感的に操作できるか、情報が適切に整理されているかなどがポイントになります。

UI(ユーザーインターフェース)

Webサイトやアプリのデザインのことを指します。視覚的なデザインだけでなく、使い勝手の良さも含めて設計されます。

UX(ユーザーエクスペリエンス)

UIと密接に関連する概念で、ユーザーがサイトを利用する際の体験全般を指します。直感的な操作感やストレスの少ないナビゲーションが求められます。

バナー

広告やプロモーション用の画像・ボタンのことを指します。Webページ内に配置され、クリックすると特定のページに誘導されることが多いです。

パンくずリスト

現在閲覧しているページの階層を示すナビゲーションです。例:「ホーム > サービス > Webデザイン」などと表示され、ユーザーが簡単に上位ページへ戻れるようになります。

検索エンジンがサイト構造を正しく認識できるようにし、SEOへの効果を高めるため、構造化データの設定をオススメします。

ページネーション

記事や製品一覧など、複数ページに分かれたコンテンツに適用されるナビゲーション機能です。「1 2 3 … 次へ」といった形でページ送りが可能になります。

ファビコン

Webブラウザのタブやブックマークに表示される小さなアイコンのことです。ブランドの識別性を高める役割があります。

Webサイトを作成したら、最初に設定します。

CTA(Call to Action)

「購入する」「お問い合わせする」など、ユーザーに行動を促すボタンやリンクのことを指します。Webサイトのコンバージョン率を高めるために重要な要素です。

アクセシビリティ

すべてのユーザーがWebサイトを利用できるようにするための設計のことです。視覚障害者向けのスクリーンリーダー対応や、色覚異常の方にも見やすいデザインなどが含まれます。

iPhoneにアクセシビリティ機能が備わっており、誰でも簡単に操作できる機能が充実しています。

モバイルファースト

近年のスマートフォンユーザーの増加に伴い、PCサイトよりもモバイルサイトを優先的に設計する考え方です。Googleの検索アルゴリズムでも重視されています。

坂井

上記もWebサイトを制作・更新する際に頻繁に出てくる用語ですので、中小企業経営者やWeb担当者は必ず知っておきたい用語です。

カタカナ語、短縮語の用語自体は暗記していなくても、それぞれの意味は知っておきましょう。

例えば、ファーストビューという用語は記憶していなくても、『Webサイトを開いたときにスクロールせず見える範囲に重要な要素を配置する』など。

まとめ

Webデザインの基本用語を理解することで、Web制作会社とのやりとりがスムーズになり、意図に沿ったWebサイトを作ることができます。また、これらの用語を知っておくことで、Webサイトの改善点を見つけやすくなり、集客力を高めることにもつながります。

企業や個人事業主にとって、Webサイトは重要な営業ツールです。Webデザインの基礎を押さえて、効果的なサイト運用を目指しましょう。

さらに、最新のデザインのトレンドや技術にも目を向け、継続的にサイトを改善していくことが成功の鍵となります。

坂井

広告代理店の方や制作会社など同じ業界の人同士であれば、カタカナ語や略語を使って会話が成り立つことが多く、頻繁に専門用語が飛び交うかもしれません

ですが、自分自身はできるだけ専門用語を使わずにわかりやすく伝えることを意識しているので、あまり専門用語は使わない方ではあります。

打ち合わせする相手が専門用語をたくさん使う場合に会話を合わせられる、ネットで情報収集をした時に専門用語を知っていると素早く理解できるので、今回ご紹介した用語はぜひ知っておいてください。

この記事を書いた人

坂井 和広

石川県金沢市出身、京都在住のWEBディレクター&マーケター。
Webサイト制作、集客・売上アップの実績をまとめたノウハウ本、著書『Webサイトのつくり方・運営のしかた 売上・集客が1.5倍UPする プロの技101』をソーテック社より出版。

19年以上に渡り、中小企業のWEBサイト制作・集客・解析・売上アップまで総合的に支援。

ネット集客・売上アップに困ったら

書籍 『Webサイトのつくり方・運営のしかた 売上・集客が1.5倍UPする プロの技101』を読んで実践すれば、結果が出ます。『セルフWEB集客&広告設定マスター講座』へ参加いただくとサポートも!