← 用語集一覧へ戻る

IT用語集|カテゴリ:Web・SEO

HTML、CSS、レスポンシブデザイン、canonical、OGP、SEOなど、Webサイト制作と検索表示に関わる用語を整理するカテゴリです。ページを作るだけでなく、見やすく、伝わりやすく、検索にも理解されやすい形にするための基礎になります。

Web・SEOカテゴリでは、Webページを作り、表示し、検索エンジンやSNSに正しく伝えるための用語をまとめています。HTMLとCSSのような制作の基本から、canonical、OGP、サイトマップのような公開後に効いてくる用語まで扱います。

AIにWebページを作ってもらうときも、見た目だけでなく、構造・レスポンシブ対応・検索向けの情報まで確認できると品質が上がります。このカテゴリは、Web制作の入口と運用の両方をつなぐ地図になります。

Web・SEOカテゴリの読み方

  • まずはHTMLとCSSを読み、Webページの骨組みと見た目の役割を押さえると理解しやすくなります。
  • レスポンシブデザインやメディアクエリは、スマホとPCの両方で見やすくするための実践的な用語として読むと役立ちます。
  • canonical、OGP、サイトマップなどは、ページを公開したあとに検索エンジンやSNSへ正しく伝えるための用語として確認するとよいです。

このカテゴリの用語をどれくらい覚えているか、クイズで確かめてみましょう!

このカテゴリのクイズに挑戦する

まずはここから!重要基本用語

HTML、CSS、レスポンシブデザイン、canonicalは、Webページを作り、見やすく整え、検索エンジンへ正しく伝えるための重要用語です。

  • HTML重要 HyperText Markup Language
    説明

    Webページの構造と内容を定義するマークアップ言語のこと。見出し・段落・リンク・画像などの要素をタグで記述する。

  • CSS重要 Cascading Style Sheets
    説明

    Webページの見た目(色・フォント・レイアウト・余白など)を指定するスタイルシート言語のこと。HTMLと組み合わせてデザインを表現する。

  • canonical重要 Canonical
    説明

    内容が重複または似ている複数のURLがあるときに、検索エンジンへ「正規の代表URLはこれです」と伝えるための仕組みのこと。

その他の用語一覧

  • 403エラー 403 Forbidden
    説明

    アクセスしようとしたウェブページやファイルに対して、表示権限(アクセス権限)がないことを示すエラー。

  • 404エラー 404 Not Found
    説明

    アクセスしたURLにページが存在しないとき、サーバーが返すエラーのこと。URLの打ち間違い、ページの削除、リダイレクト未設定などが主な原因となる。

  • アクセシビリティ Accessibility
    説明

    年齢、障害、利用環境などに関係なく、できるだけ多くの人がWebサイトやアプリを利用でき、情報にアクセスしやすくするための考え方や設計のこと。

  • アコーディオン Accordion
    説明

    Webデザインにおいて、見出しをクリックすると詳細内容が縦方向にスライド開閉する折りたたみ式のUIパーツ。

  • API Application Programming Interface
    説明

    ソフトウェアやサービス同士が、決められたルールに従って機能やデータをやり取りするための窓口のこと。

  • Basic認証 Basic Authentication
    説明

    Webサーバーの最も基本的な機能を利用して、ウェブページに簡易的なIDとパスワードの入力画面を表示する認証方式。

  • パンくずリスト Breadcrumbs
    説明

    Webサイト内でユーザーが現在どこの階層にいるかを階層順に示したリンクの一覧。

  • ブラウザ Browser
    説明

    WebサイトやWebアプリを取得し、HTML・CSS・JavaScriptなどを解釈して、画面に表示・操作できるようにするソフトウェアのこと。

  • カルーセル Carousel
    説明

    複数の画像やコンテンツを、左右にスライドさせて順番に切り替え表示するUIパーツ。

  • CDN Content Delivery Network
    説明

    世界中に配置されたキャッシュサーバーを使って、Webサイトの画像やデータをユーザーの近くから高速に配信する仕組み。

  • CMS Content Management System
    説明

    Webサイトの文章や画像などを、管理画面から作成・保存・公開できるシステム。

  • クローラー Web Crawler
    説明

    インターネット上のウェブサイトを巡回し、自動的に情報を収集するプログラム。

  • CSRF Cross-Site Request Forgery
    説明

    悪意のあるWebサイトを通じて、別のWebサイトでユーザーが意図しない操作(パスワード変更や購入など)を勝手に実行させる攻撃手法。

  • ダイアログ Dialog
    説明

    ユーザーに確認や選択を求めるため、一時的に画面の上に重ねて表示されるメッセージウィンドウの総称。

  • DOM Document Object Model
    説明

    ブラウザがHTMLを読み込んだとき、ページの構造をプログラムから操作できるようにするためのデータ構造のこと。

  • イベント / イベントリスナー Event / Event Listener
    説明

    クリックやキー入力などのユーザー操作(イベント)が起きたとき、指定した処理を実行するように登録する仕組みのこと。

  • フォールバック Fallback
    説明

    エラーやトラブルが発生した際、システムが完全に停止するのを防ぎ、機能制限付きの代替手段で処理を継続する仕組み。

  • ファビコン Favicon
    説明

    ブラウザのタブやブックマーク、検索結果などに表示される、Webサイトを識別するための小さなアイコン画像のこと。

  • feed Web Feed
    説明

    Webサイトの新着記事や更新情報を、他のアプリやサービスが読み取りやすい形式で自動配信するためのデータ構造。

  • Flexbox Flexbox
    説明

    CSSで要素の配置や整列、余白を簡単かつ柔軟に設計できるレイアウト手法。

  • GA4 Google Analytics 4
    説明

    Googleが提供するアクセス解析ツールで、Webサイトやアプリに訪れたユーザーの行動をイベント単位で計測・分析できる仕組みのこと。

  • GitHub Pages GitHub Pages
    説明

    GitHubのリポジトリに保存したファイルを直接読み込み、無料でWebサイトとしてインターネット上に公開できるサービス。

  • ハンバーガーメニュー Hamburger Menu
    説明

    スマホ版Webサイトなどでよく使われる、三本線のアイコンをクリックすると開閉するメニューの仕組み。

  • ヘッダー / フッター Header / Footer
    説明

    Webページの上部(ヘッダー)と下部(フッター)に配置されるレイアウト領域のこと。ヘッダーにはロゴやナビゲーション、フッターには著作権表示や補足リンクが置かれることが多い。

  • hreflang hreflang
    説明

    Webページがどの言語や地域向けに作成されているかを検索エンジンに伝えるためのHTMLタグ属性。

  • HTTPメソッド (GET / POST) HTTP Methods (GET / POST)
    説明

    Webサーバーに対して、どのような操作を要求しているかを示す通信の目的マーク。

  • JSON JavaScript Object Notation
    説明

    システム同士でデータをやり取りするときによく使われる、軽くて読みやすいデータ形式のこと。

  • ローディングスピナー Loading Spinner
    説明

    データの読み込みや通信を行っている間、処理中であることをユーザーに示すための回転するアニメーションUI。

  • LocalStorage LocalStorage
    説明

    Webブラウザにデータを保存するための仕組み。ブラウザを閉じてもデータが消えずに残り続けるのが特徴。

  • マークアップ言語 Markup Language
    説明

    テキストに意味や構造を付与するための記号(タグ)を使って記述する言語のこと。

  • メディアクエリ Media Query
    説明

    画面幅や端末の特性などの条件に応じて、適用するCSSを切り替える仕組み。

  • メタタグ Meta Tag
    説明

    HTMLのhead内に記述する、ページの情報(文字コード・説明文・キーワード・SNS表示設定など)をブラウザや検索エンジンに伝えるためのタグのこと。

  • MIME(マイムタイプ) MIME / MIME Type / Media Type
    説明

    Webやメールで送受信されるデータの種類を、受け取る側に伝えるための識別情報。

  • モーダルウィンドウ Modal Window
    説明

    操作中に画面の手前に重ねて表示され、閉じるまで元の画面の操作を受け付けないようにする子ウィンドウ。

  • Next.js Next.js
    説明

    Reactをベースにした、Webアプリケーションを構築するためのフレームワーク。

  • noindex / nofollow noindex / nofollow
    説明

    noindexは検索結果に表示しないよう検索エンジンへ伝える指定、nofollowはページ内リンクを評価・関連付け・巡回の対象にしないでほしいと伝える指定のこと。

  • OAuth OAuth
    説明

    IDやパスワードを相手に渡すことなく、特定のウェブサービス間で安全にアクセス権限を受け渡しする仕組み。

  • og:image og:image
    説明

    SNSやチャットアプリでページURLを共有したときに表示する画像URLを指定するためのOpen Graphのmetaタグのこと。画像そのものではなく、画像を指定するHTMLタグである。

  • フィッシングサイト Phishing Site
    説明

    本物の企業やサービスを装い、ユーザーの個人情報やパスワードを盗み取る偽のWebサイト。

  • プログレスバー Progress Bar
    説明

    ファイル転送や処理などの進み具合を、棒や数値で視覚的に伝えるUI部品。

  • プロバイダ Internet Service Provider
    説明

    自宅や会社などの回線をインターネットの世界へと接続してくれる接続仲介事業者。

  • クエリパラメータ / パスパラメータ Query Parameter / Path Parameter
    説明

    URLを通じてWebサーバーにデータを送るための2つの仕組み。

  • ラスター画像 Raster Image
    説明

    ピクセル(画素)の集まりで表現される画像形式。写真などの複雑な色の表現に向いている。

  • reCAPTCHA reCAPTCHA
    説明

    ウェブサイトの問い合わせフォームなどに対して、悪意のあるプログラム(ボット)による自動投稿やスパム行為を防ぐためのGoogleのセキュリティサービス。

  • リダイレクト Redirect
    説明

    あるURLにアクセスしたユーザーや検索エンジンを、別のURLへ自動的に転送する仕組みのこと。ページ移転やURL変更時によく使われる。

  • レンダリング Rendering
    説明

    HTMLやCSSなどのコードをブラウザが解釈し、画面に実際の見た目として表示する処理のこと。

  • 解像度 Resolution
    説明

    ディスプレイの表示領域や画像データを構成する「ドット(画素)」の細かさや密度のこと。

  • REST API REST API
    説明

    Web上のデータや機能を、リソースを表すURLとHTTPメソッドを使って分かりやすくやり取りするためのAPI設計スタイルのこと。

  • robots robots.txt
    説明

    検索エンジンのクローラーに対して、サイトのどのページを巡回してよいか(あるいは拒否するか)を伝えるテキストファイル。

  • RSS Really Simple Syndication
    説明

    Webサイトの更新情報を配信するために使われる、XMLベースの代表的なデータフォーマット。

  • サニタイズ Sanitize
    説明

    入力されたデータから有害な文字やコードを取り除いたり、無害な文字列に変換したりする処理。

  • 検索エンジン Search Engine
    説明

    インターネット上のWebページを収集・分類し、キーワードに対して関連性の高いページを一覧表示するシステムのこと。

  • セッション Session
    説明

    ユーザーがWebサイトにアクセスしてから離脱するまでの一連の接続状態を保持する仕組み。

  • サイトマップ Sitemap
    説明

    サイト内にどんなページがあるかを一覧化し、ユーザーや検索エンジンがページを見つけやすくするための案内情報のこと。

  • slug / パーマリンク Slug / Permalink
    説明

    Webページの固定URLのこと。またそのURLの末尾部分(例:/blog/my-article の「my-article」)をslugと呼ぶ。変更すると検索結果や既存リンクに影響が出ることがあるため慎重に扱う必要がある。

  • SPA Single Page Application
    説明

    ページ遷移時に画面全体をロードし直さず、JavaScriptを使って必要な部分だけを動的に書き換えるWebアプリの構築手法。

  • SSO Single Sign-On
    説明

    1回ログインするだけで、連携している複数の異なるWebサービスやアプリに自動ログインできる仕組み。

  • 静的サイト / 動的サイト Static / Dynamic Site
    説明

    静的サイトはあらかじめ作られたHTMLなどをそのまま配信するサイト、動的サイトはアクセス時の条件やデータベースの内容に応じてページを生成するサイトのこと。

  • SVG Scalable Vector Graphics
    説明

    図形や文字をXMLベースの記述で表し、さまざまな大きさで鮮明に表示できる画像形式。

  • タブメニュー Tab Menu
    説明

    画面内のタブ(見出し)をクリックすることで、ページ遷移をせずに表示コンテンツを瞬時に切り替えるUIパーツ。

  • Tailwind CSS Tailwind CSS
    説明

    HTMLのクラス名に「スタイルの指示」を直接書き込むことで、ユーティリティクラス中心にデザインを構築できるCSSフレームワーク。

  • サムネイル Thumbnail
    説明

    動画や画像・記事などの内容を一目で伝えるために使われる縮小版のプレビュー画像のこと。YouTubeの動画一覧やブログの記事一覧でよく見られる。

  • トラフィック Traffic
    説明

    ネットワーク上で送受信されるデータの量、または通信回線を流れる情報の量。

  • URL Uniform Resource Locator
    説明

    Webページやファイルなど、インターネット上のリソースの場所を示す住所のような文字列。

  • Vercel Vercel
    説明

    フロントエンドアプリや静的サイトを、GitHub連携で手軽に公開できるホスティングサービスのこと。

  • 仮想DOM Virtual DOM
    説明

    実際のDOM(Web画面の構造)をメモリ上に複製し、変更された部分だけを効率よく反映させる仕組み。

  • WAF Web Application Firewall
    説明

    Webアプリケーションの脆弱性を突いた攻撃(SQLインジェクションやXSSなど)を防ぐための専用のセキュリティ対策システム。

  • XML XML
    説明

    データの構造をタグを使って自由に定義できるマークアップ言語。