Studio：HTMLタグについて

公開日:2026年07月29日

Studio

Studioで指定する主なHTMLタグ

タグ	読み方・役割	Studioでの主な使用例	使用時のポイント
`<div>`	ディブ／まとまりを作る	レイアウト調整、装飾用ボックス、複数要素のグループ化	特別な意味を持たないため、構造上の役割がないボックスに使用します。
`<header>`	ヘッダー領域	ロゴ、サイト名、メニューをまとめる領域	ページ上部だけでなく、記事やセクションの冒頭にも使用できます。
`<nav>`	ナビゲーション領域	グローバルメニュー、ページ内メニュー	主要なリンクをまとめた領域に設定します。すべてのリンクに使う必要はありません。
`<main>`	メインコンテンツ	ページ中央の主要コンテンツ全体	原則として、1ページにつき1つだけ使用します。
`<section>`	内容ごとの区切り	サービス紹介、会社紹介、作品紹介、お問い合わせ	基本的に、見出しと関連する内容をまとめる領域に使用します。
`<article>`	独立したコンテンツ	ブログ記事、ニュース、制作実績、商品情報	その部分だけを取り出しても内容が成立する場合に使用します。
`<footer>`	フッター領域	著作権表示、会社情報、利用規約、補助メニュー	ページ下部の情報をまとめる場合に使用します。
`<h1>`	最も重要な見出し	ページタイトル、記事タイトル	ページの内容を代表する見出しです。基本的に1ページに1つを目安にします。
`<h2>`	大見出し	サービス紹介、会社概要などのセクション見出し	`<h1>`の次の階層として使用します。
`<h3>`	中見出し	各サービス名、各作品名	`<h2>`の内容をさらに分ける場合に使用します。
`<h4>`～`<h6>`	小見出し	詳細項目の見出し	見出し階層が深い場合に使用します。数字を飛ばさないようにします。
`<p>`	段落	説明文、紹介文、本文	通常の文章に使用します。テキストボックスの初期設定です。
`<span>`	文章の一部分	文章内の強調部分、装飾する文字	特別な意味を持たず、文章の一部分をまとめる場合に使用します。
`<ul>`	順番のないリスト	特徴一覧、サービス一覧、注意事項	順番に意味がない項目をまとめます。
`<li>`	リストの項目	メニューの各リンク、一覧の各項目	基本的に`<ul>`などのリストを構成する項目として使用します。
`<label>`	フォーム項目の説明	名前、メールアドレス、問い合わせ内容の項目名	入力欄が何のためのものかを示します。