「Web用語が難しくてわからない…」と悩んでいませんか？この記事では、初心者向けに基本的なWeb用語をわかりやすく解説します。ホームページ作成を自分で始めるために必要な知識を、シンプルにまとめました。これを読めば、専門用語に迷うことなくスムーズに作業を進められます！
1. Webってどういう意味？
1-1. インターネットとWebの違い
1-2 ホームページとWebサイトはどう違う？
2. よく使うWeb用語をまとめてチェック
2-1. Web用語 一覧
2-2. Web制作によく出てくる言葉
2-3. ホームページで見かける用語の意味
3. 初心者でも安心！よく使う用語をかんたん解説
3-1. HTML・CSSってなに？
3-2. 「サーバー」「ドメイン」のちがいは？
3-3. スマホでも見やすい「レスポンシブ」って？
4. Webデザインでよく出てくることば
4-1. ワイヤーフレームってなに？
4-2. デザインカンプってどんなもの？
5. Webサイトを作るときの基本の用語
5-1. ナビゲーションって何のこと？
5-2. ヘッダーとフッターってどこ？
5-3. ページの「タイトル」や「説明文」の役割
6. 自分でホームページを作るときに知っておくと便利なこと
6-1. 無料で作れるサービスはある？
6-2. 難しくない方法はどれ？
6-3. 作ったページをインターネットに出すには？
「Web」という言葉は、毎日のように見たり聞いたりするのに、意味がよくわからないという方も多いかもしれません。ここでは、Webが何を指しているのかを、インターネットとのちがいや、よく使うことばと一緒にわかりやすく説明します。
インターネットは、世界中のコンピューター同士がつながっている「道」のようなものです。一方、Webはその道を通って見ることができる「ページ」や「サイト」のことを言います。たとえば、ネットで天気予報を見るとき、ページが表示されます。それがWebです。インターネットがなければWebは見られませんし、逆にインターネットがあればWeb以外の使い方（メールやゲームなど）も可能です。
「ホームページ」と「Webサイト」は、よくまちがえて使われます。ホームページは、サイトの「入り口」や「最初のページ」のことです。一方でWebサイトは、会社やお店が作ったページの「集まり」のことを言います。たとえば、スーパーのチラシページや店舗案内のページも、すべてまとめてWebサイトです。ホームページ＝すべてのページではないので、ちがいを知っておくと安心です。
ホームページを見たり作ったりするとき、知らない言葉が出てくると不安になりますよね。ここでは、初心者の方でも安心して読めるように、よく使われるWeb用語をわかりやすくまとめました。
Webには、よく使われる基本用語がたくさんあります。これらの言葉はWebに関連する会社・事業でなくても聞くことがあるので、覚えておくと良いでしょう。
| 用語 | 意味 |
|---|---|
| Web | インターネットで見られるページやサイトのこと |
| HTML | ページの中身（文字や画像など）を作るための言語 |
| CSS | ページの見た目（色や大きさなど）を決めるルール |
| リンク | クリックすると別のページに移動できる文字やボタン |
| ブラウザ | Webページを見るためのアプリ（例：Chrome、Safari） |
| サーバー | Webページのデータを保存しておく場所 |
| ドメイン | Webサイトの住所のような名前（例：www.example.com） |
| ナビゲーション | ページの中を移動するためのメニュー部分（例：「会社案内」「お問い合わせ」など） |
| バナー | ページ内にある画像の広告やお知らせ。クリックで別ページに移動できることが多い |
| メニュー | ページの上や横にある、内容ごとに分かれた選択ボタンのこと |
ホームページを作るときによく聞く言葉には、少しむずかしそうなものもありますが、意味がわかれば心配いりません。たとえば、「コーディング」とは、ページの見た目や動きを決める作業のことです。また、「CMS（シーエムエス）」は、文章や画像をかんたんに管理できる仕組みのことを指します。
| 用語 | 意味 |
|---|---|
| コーディング | ページの内容や見た目をつくるための作業。HTMLやCSSなどのコードを書くこと。 |
| テンプレート | あらかじめ用意されたデザインの型。文字や画像を入れかえるだけでページができる。 |
| ワイヤーフレーム | ページの設計図。どこに何を置くかをざっくりと決めるためのかんたんな図。 |
| デザインカンプ | 完成後の見た目を伝えるためのデザイン見本。色や文字の大きさ、写真の配置などを決める。 |
| レイアウト | ページ内の文字や画像の配置のこと。見やすさやバランスに関係する。 |
| プレビュー | 作ったページがどのように見えるかを公開前に確認すること。 |
| アップロード | 作ったページをインターネット上にのせる作業。サーバーにデータを送ること。 |
| CMS | 専門知識がなくてもページを作って更新できるしくみ（例：WordPress、Wixなど）。 |
| レスポンシブ | パソコンでもスマホでも見やすくなるページのつくりかた。 |
| フォント | 文字のデザイン。見た目の印象に関わる（例：丸い文字、細い文字など）。 |
用語をおぼえることで、自分でページを作るときにも役立ちます。
ホームページを見ていると、「ログイン」や「お問い合わせ」など、よく見る言葉があります。でも、正しい意味や使い方がわからないと不安になります。たとえば、「ログイン」は会員としてページに入ることで、「お問い合わせ」は質問や相談を送るためのページです。
| 用語 | 意味（初心者向けの説明） |
|---|---|
| トップページ | サイトの最初に表示されるページ。いわば「玄関」のような場所。 |
| お問い合わせ | 質問や相談、連絡をするためのページ。フォームがついていることが多い。 |
| ログイン | 会員ページなどに入るときに、IDとパスワードを入力して入ること。 |
| サイトマップ | サイト内のページ一覧をまとめたもの。全体の構成がひと目でわかる。 |
| ボタン | クリックすることで、ページが変わったり情報が送信されたりする部分。 |
| メールフォーム | 名前やメールアドレス、内容を入力して送るしくみ。お問い合わせページによくある。 |
| バナー | ページ内にある画像の広告や案内。クリックすると別のページに飛ぶことが多い。 |
| スライド | 写真や画像が自動で切り替わる表示。トップページなどでよく使われる。 |
| フッター | ページの一番下の部分。会社情報やリンク、コピーライトなどがまとめてある。 |
| ヘッダー | ページの一番上の部分。ロゴやメニュー、サイト名などが入っていることが多い。 |
ホームページ作成には、聞きなれない言葉が出てくることがあります。言葉の意味がわかれば、作業はぐんと楽になります。ここでは、特に大切でよく出てくる用語を、やさしい言葉で説明しています。どれもホームページに関わる基本なので、知っておくと安心です。
HTML（エイチティーエムエル）とCSS（シーエスエス）は、ホームページの見た目を作るために使う基本の言語です。
HTMLは、ページに「見出し」「文章」「画像」など、なにを表示するかを決めます。
CSSは、その表示を「どんな色」「どの大きさ」で見せるかを決めます。
たとえば、HTMLで「こんにちは」と書き、CSSで「文字を赤く」「大きく」するように命令すると、その通りに表示されます。コードにふれるのが初めての人でも、無料のツールを使えば見た目を確認しながら作れます。まずは1つ、文章を表示させてみるとイメージがつかみやすいでしょう。
「サーバー」と「ドメイン」は、ホームページをネットに公開するときに必要になるものです。
サーバーは、ページのデータ（文章や画像）を保存しておく場所です。イメージとしては大きなロッカーのようなものです。
ドメインは、そのロッカーの場所を示すもの。たとえば「example.com」のような名前です。
ふだん見るページにも、どこかにドメインが書かれています。サーバーとドメインの両方がそろうと、ホームページを見られるようになります。無料で使えるサービスもあるので、まずはおためしで登録してみるのもおすすめです。
レスポンシブとは、パソコンでもスマホでもページが見やすく表示されるしくみのことです。最近はスマホでホームページを見る人が多いため、この対応がとても大切になります。たとえば、画面がせまいときは文字を大きくしたり、メニューをたたんだりして見やすくします。
レスポンシブにすることで、次のようなメリットがあります：
スマホでもストレスなく見てもらえる
Googleなどの検索にも有利になる
ひとつのページでいろいろな機器に対応できる
無料のホームページ作成ツールには、はじめからレスポンシブに対応しているものもあります。まずは、いくつかの端末で自分のページがどう見えるか、試してみるとよいでしょう。
ホームページを作るときに、デザインに関する言葉もよく出てきます。最初は少しむずかしく感じるかもしれませんが、意味を知ればイメージしやすくなります。ここでは、見た目や使いやすさに関係する大切な言葉をわかりやすく紹介します。
ワイヤーフレームとは、ホームページの「設計図」のようなものです。どこにタイトルを置くか、どの順番で内容を見せるかなどを、かんたんな図で決めていきます。色や写真は使わず、「ここに見出し」「ここは画像」というように、内容の位置だけを考えます。
これを作ることで、あとからデザインを考えるときにブレずにすみます。紙とえんぴつでも、無料のアプリでも作れます。初心者の方は、まず手書きでページの流れを考えるところから始めてみましょう。
デザインカンプとは、「完成イメージを見せるための見た目の見本」です。実際に公開する前に、色や文字の大きさ、写真の位置などを決めて、画面に近いかたちで見せます。お店のチラシのように、デザイン全体を確認できるのがポイントです。
たとえば、カンプを見ることで「この色は見えにくいかも」「文字が小さすぎる」など、事前に気づけます。無料で使えるデザインツールもあるので、はじめてでも安心です。自分で作る場合は、まず好きなサイトをまねして、カンプを作ってみるのもよい練習になります。
ホームページを作るときには、よく出てくる場所や名前があります。どれも、ページの見やすさや使いやすさに関係している大切な部分です。ここでは「ナビゲーション」「ヘッダー」「フッター」など、基本の用語を詳しく紹介します。
SEO（エス・イー・オー）とは、「検索エンジン最適化」を意味し、GoogleやYahoo!の検索結果で上位に表示されるようにする工夫のことです。たとえば、「カフェ 東京」で検索したときに、あなたのカフェのホームページが1ページ目に表示されれば、多くの人が訪れてくれる可能性が高まります。
SEOの基本的なポイントは次のとおりです。
SEOを意識して記事を書くことで、検索エンジンからの訪問者を増やせるので、初心者でも意識しておくことが大切です。
ヘッダーはページのいちばん上にある部分で、ロゴやメニュー、サイトの名前などがよく入っています。フッターはページのいちばん下で、会社の情報や問い合わせ先、SNSのリンクなどがまとめてある場所です。
たとえばネットショップでは、ヘッダーに「カートを見る」ボタン、フッターに「利用規約」や「特定商取引法に基づく表示」があります。どちらもページ全体に関わる大事な場所なので、何を入れるかを考えておくと、見る人にとって親切なページになります。実際のサイトを見ながら、自分なら何を入れるか考えてみてください。
ホームページには、それぞれのページに「タイトル（表題）」と「説明文（ディスクリプション）」があります。これはページの内容をひとことで伝えるためのものです。たとえば「おすすめ商品のご紹介｜ABCショップ」のように、どんなページかがすぐにわかると安心です。
また、検索したときに出てくる文字もここに関係しています。
タイトル：検索画面で青く出てくる見出し
説明文：その下にあるくわしい説明の部分
タイトルや説明文をしっかり書くことで、見つけてもらいやすくなります。
ページを作るときは「このページで伝えたいことは何か？」を一度考えて、わかりやすい言葉で書いてみましょう。
はじめてホームページを作ろうと思ったとき、「お金はかかるの？」「どこから始めればいいの？」と不安に感じることが多いです。今はかんたんで無料ではじめられる方法がたくさんあります。初心者にぴったりな便利な情報をわかりやすく紹介します。
無料でホームページを作れるサービスはたくさんあります。たとえば、「ペライチ」「Wix（ウィックス）」「canva（キャンバ）」などが有名です。
デザインが用意されていて選ぶだけ
ドラッグ＆ドロップでらくらく編集
スマホでも見やすく作られている
お金をかけずに気軽に始めたい方には、とても便利です。ただし、無料プランだと広告が出たり、自分だけのアドレスが使えなかったりします。まずは無料で試して、必要になったら有料プランを検討するのがおすすめです。
パソコンが苦手な方でも安心なのが、「テンプレート」と呼ばれるデザインを使う方法です。テンプレートとは、あらかじめ用意されたデザインのこと。文字や写真を入れかえるだけで、見ばえのよいページが作れます。
ペライチ：文字を入れるだけで完成
Canva：チラシ感覚でページが作れる
Wix：見たまま編集できて直感的
これらのツールは、コードやむずかしい設定は一切いりません。操作画面も日本語でわかりやすいので、まずは無料で試してみるのがよいスタートになります。
ページを作っただけでは、まだだれも見られません。インターネットに公開するには「公開ボタン」を押すか、「サーバー」にアップする必要があります。無料サービスを使っている場合は、公開までがとてもかんたんです。
ペライチ：作ったら「公開」ボタンを押すだけ
Wix：アカウント作成後に自動でURLが発行される
一方、自分でHTMLファイルを作った場合は、「サーバー」と「ドメイン」を用意して、アップロードという作業が必要です。最初のうちは無料サービスで感覚をつかみ、なれてきたら本格的な公開方法に挑戦するとよいでしょう。
Web用語の基本を理解すれば、ホームページ作成がぐっと簡単になります。まずは、この記事で学んだ知識を活かして、自分でホームページを作る準備を始めましょう。無料のツールを試したり、サーバーを選んだり、できることから一歩ずつ進めてみてください！
平日9:00〜18:00（土日・祝を除く）
