Web制作の打ち合わせでは、初めて聞く専門用語が次々と出てきます。「ワイヤーフレームを確認してください」「レスポンシブ対応は含んでいます」「SEOを意識した構成にします」——意味がなんとなく分かっても、自信を持って理解できているかというと、曖昧なまま進んでいることも多いのではないでしょうか。
用語の意味を把握しておくと、打ち合わせでのやり取りがスムーズになるだけでなく、制作会社からの提案内容の是非を判断しやすくなります。「このスコープには含まれていますか?」「この工程はどの段階で行いますか?」という確認ができるようになると、認識のズレや仕様の行き違いを防げます。
ここでは、デザイン・開発・運用の各分野でよく使われる用語を、定義だけでなく「なぜ重要か」「どんな場面で使うか」の文脈とともに整理します。
デザイン・画面設計の用語
ワイヤーフレーム
ページの骨組みとなる設計図です。テキストと四角で構成した簡易な図で、各ページにどんな要素をどの順番で配置するかを示します。色や画像は使わず、情報の構造と流れだけに集中して確認できるのが特徴です。
ワイヤーフレームの段階で「このページにはお問い合わせボタンが必要」「よくある質問のセクションを追加したい」という修正をすることで、デザインが完成してからの大規模な変更を防げます。デザインよりワイヤーフレームの修正のほうがコストが低いため、ここで認識を合わせることが後工程の効率に直結します。
デザインカンプ
実際のサイトに近い外観で作られた完成形のデザインです。色・フォント・画像・余白・ボタンの形状など、視覚的な要素がすべて決まった状態で提示されます。コーダーはこのデザインカンプを指示書として、HTMLとCSSでページを実装します。
「カンプを見て初めてイメージと違うと気づく」という場面はよくあります。事前にイメージのすり合わせができていれば、大幅な修正は避けられます。参考にしたいサイトのURLや「この雰囲気は避けたい」という例を最初に共有しておくと、方向性がぶれにくくなります。
UI(ユーザーインターフェース)
ユーザーが画面上で実際に触れる部分の総称です。ボタン、フォーム、メニュー、テキストリンク、ナビゲーションバーなど、操作や入力のために使うすべての要素が含まれます。
UIの品質は操作のしやすさに直結します。ボタンのサイズが小さすぎてスマートフォンで押しにくい、フォームの入力欄がどこからどこまでか分かりにくい、メニューを開く方法が直感的でないといった問題は、UIの設計に起因します。
UX(ユーザーエクスペリエンス)
ユーザーがサイトを使う過程全体から得る体験の質です。見た目の美しさだけでなく、「目的の情報にたどり着けたか」「操作していてストレスがなかったか」「期待していた結果が得られたか」という主観的な満足度まで含みます。
UIとUXはよく混同されます。UIは「操作のしやすさ」というより「操作に使う部品の設計」に近く、UXはそれを含む体験全体です。優れたUIパーツを揃えてもページ構成が悪ければUXは損なわれますし、逆に情報の流れが正しく設計されていれば、シンプルなUIでもUXは高くなります。
レスポンシブデザイン
一つのHTMLファイルで、PC・タブレット・スマートフォンの各画面サイズに合わせてレイアウトが変わる設計手法です。画面幅を検知し、CSSのメディアクエリを使って表示を切り替えます。
現在のWebサイトはモバイルからのアクセスが過半数を占めるケースが多く、スマートフォンで見づらいサイトはユーザーの離脱を招きます。GoogleもスマートフォンでのページをPCより優先してインデックスする「モバイルファーストインデックス」を採用しているため、レスポンシブ対応はSEOにも影響します。
ファーストビュー
ページを開いたときに、スクロールなしで最初に見える画面の範囲です。訪問者がサイトに来て最初に目にする領域であり、「このサイトは自分に関係があるか」という判断が数秒で行われます。
ファーストビューに何を配置するかは、サイトの成果に大きく影響します。キャッチコピー、メインビジュアル、主要なCTAボタンが適切に配置されていれば、スクロールして読み進める動機が生まれます。伝えたいことが多すぎて要素が詰め込まれた状態では、何が主役か分からず離脱につながります。
技術・開発の用語
HTML
Webページの構造を定義するマークアップ言語です。タグと呼ばれる記号を使って、どの部分が見出しで、どの部分が段落で、どこにリンクや画像があるかをブラウザに伝えます。テキストエディタで書かれたHTMLファイルをブラウザが読み込み、画面に表示します。
HTMLはページの「骨格」を担います。見た目ではなく構造を定義するため、同じHTMLでも適用するCSSが違えば見た目は大きく変わります。HTMLの書き方がSEOに影響することもあり、特に見出しタグの使い方や画像のalt属性の記載は、検索エンジンへの情報伝達に関わります。
CSS
HTMLに適用する見た目(スタイル)を定義する言語です。色、フォント、サイズ、余白、配置、アニメーションなど、デザインに関わるすべての指定をCSSで行います。
HTMLとCSSは常にセットで機能します。HTMLが「ここは見出しです」と宣言し、CSSが「見出しはこのフォント・このサイズ・この色で表示する」と指示します。CSSを変えれば同じHTMLでもまったく違う見た目になります。サイト全体で一貫したデザインを保つために、共通のCSSを定義して管理する手法が取られています。
JavaScript
ブラウザ上で動くプログラム言語です。ユーザーの操作に応じた動的な表示変更(メニューの開閉、画像のスライド、フォームのバリデーションなど)を担当します。Webサイトの「動き」の多くはJavaScriptで実装されています。
「このボタンを押したら詳細情報が展開される」「スクロールに合わせてアニメーションが動く」「フォームの入力ミスをリアルタイムで指摘する」といった機能はJavaScriptの領域です。ReactやVue.jsなどのフレームワークを使うと、複雑なインタラクションを効率よく実装できます。
CMS(コンテンツ管理システム)
ブラウザ上の管理画面から、プログラムの知識なしにWebページのコンテンツを追加・編集・削除できるシステムです。WordPressが最もよく知られており、ブログ記事の更新、お知らせの投稿、商品ページの編集をHTMLを書かずに行えます。
CMSを導入すると、公開後の運用が自社でできるようになります。ページの追加や記事の更新を制作会社に都度依頼する必要がなくなるため、運用コストを下げられます。一方で、CMSの管理画面の操作方法を覚える必要があり、更新担当者が変わったときの引き継ぎも必要です。
SSL/HTTPS
通信を暗号化する仕組みです。URLが「https://」で始まるサイトはSSL対応済みを意味し、ブラウザのアドレスバーに鍵マークが表示されます。SSL対応していないサイトでは、フォームへの入力内容が第三者に傍受されるリスクがあります。
現在のWebではSSL対応はほぼ必須です。Googleは非SSL対応サイトを「安全でない」と警告表示するようになっており、訪問者への不信感を与えます。SEOの評価においても、HTTPS化は重視される要素のひとつです。制作会社に確認する際は「SSL対応はスコープに含まれていますか?」と聞いておきましょう。
運用・分析の用語
PV(ページビュー)
ページが表示された回数です。1人のユーザーが同じページを3回見れば3PVとカウントされます。サイト全体の閲覧頻度を測る基本的な指標のひとつで、Google Analyticsなどのアクセス解析ツールで確認できます。
PVが多ければよいとは限りません。目標は問い合わせ数や売上の増加であることが多く、PVが多くても成約に至らないなら、コンテンツの方向性やCTAの設計を見直す必要があります。PVはあくまで「どれだけ読まれているか」の目安として、他の指標と組み合わせて解釈します。
セッション数(旧:UU)
一定期間内にサイトを訪れた人数の近似値です。同じ人が1日に複数回訪問すると複数のセッションとしてカウントされることがありますが、実際の訪問者数の概算として使われます。PVと組み合わせて「1訪問あたりのページ閲覧数」を算出するのに使います。
離脱率(直帰率)
サイトを訪れたユーザーが1ページだけを見て離脱したセッションの割合です。直帰率が高い場合、訪問者が「期待していた内容と違った」「次に読むべきページが分からなかった」と判断して戻ってしまったケースが多いと考えられます。
ただし、直帰率が高いことが必ずしも問題ではありません。1ページで情報が完結する記事や、電話番号を確認して離脱するケースは目的が達成されています。コンテンツの性質と組み合わせて判断する必要があります。
CVR(コンバージョン率)
サイトを訪問したユーザーのうち、目標とした行動(問い合わせ、購入、資料請求など)を完了した割合です。「コンバージョン」は達成してほしい具体的な行動を指し、そのサイトの目的によって定義が変わります。
100人が訪問して3人が問い合わせをすればCVRは3%です。CVRを高めるためには、ユーザーの動線を最適化し、CTAを分かりやすく配置し、フォームの入力ハードルを下げることが有効です。アクセス数を増やすSEOと、CVRを高めるUI・UX設計の両方が揃ったとき、成果が最大化されます。
KPI(重要業績評価指標)
目標を達成しているかを測るための具体的な指標です。Webサイトの文脈では、「月間オーガニック流入数1,000件」「月間問い合わせ数30件」「CVR2%以上」などがKPIの例です。
KPIを設定しないまま制作を進めると、公開後に「成功したかどうか」が判断できなくなります。目指す状態を数値で定義しておくことで、施策の優先度が決まり、改善のPDCAを回しやすくなります。
よく混同される用語の違い
いくつかの用語は意味が似ていて混同しやすいです。整理しておくと打ち合わせで役立ちます。
- UIとUX
- UIは操作に使う部品の設計(ボタン、フォーム、メニューなど)。UXはそれを含むサイト体験全体。「UIが使いやすい」と「UXが良い」は必ずしも同義ではなく、UIが整っていてもページ構成が悪ければUXは低くなる
- SEOとSEM
- SEOは検索エンジンからの自然な流入(オーガニック)を増やす施策。SEMは検索エンジンを活用したマーケティング全般を指し、SEOとリスティング広告(Google広告など)の両方を含む
- ドメインとサーバー
- ドメインはサイトのアドレス(例:example.com)。サーバーはサイトのデータを保管して公開するためのコンピューター。ドメインはサーバーとは別に取得・契約するもので、両方が揃ってサイトが表示される
- CMSとWordPress
- CMSはコンテンツ管理システムの総称。WordPressはCMSのひとつ。ほかにMovable Type、Shopify(EC向け)、HeadlessCMSなどがある
まとめ
Web制作の用語は、設計・デザイン・開発・運用という流れをイメージしながら読むと、それぞれがどの工程で登場するかが整理しやすくなります。全部を完璧に覚えることが目的ではなく、打ち合わせで「それはどういう意味ですか」と聞ける雰囲気を作り、「つまりこういうことですか」と確認する習慣が認識のズレを防ぎます。分からない用語が出てきたときは制作会社に遠慮なく聞いてみてください。丁寧に説明してくれる会社かどうかも、パートナー選びの判断材料になります。
無料相談のご案内
Web制作の用語や進め方に疑問がありましたら、合同会社ギャラクタスにご相談ください。専門用語を使わず、分かりやすい説明でのご案内を心がけています。用語の説明から、ご予算・目的に合った制作プランの提案まで対応しています。無料相談でご要望をお聞かせいただければ、貴社の状況に合わせて具体的にご説明します。