HTMLの基本構造
- Webページを作成する際には、開発用フォルダを作成してそのフォルダ内にファイルを作成や配置を行う。画像ファイルはファイル数が多くなるので、サブフォルダを作成して格納する。
| <!DOCTYPE html> <html long=”ja”> <head> <meta charset=”UTF-8″> <meta name=”description” content=”サイトの説明文”> <meta name=”keywords” content=”キーワード”> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <title>Webページのタイトル</title> <link href=”スタイルシートファイルのパス名” rel=”stylesheet” type=”text/css”> <link href=”ファビコンファイルのパス名” rel=”icon”> </head> <body> Webページの内容を記述 </body> </html> |
metaタグ
- metaタグとは、Webサイトに関する情報を検索エンジンに伝えるためのHTMLタグのこと。
- 文字コードの指定や、検索エンジンへのインデックス（検索結果に表示される）の可否など、メタデータと呼ばれる情報を伝えるのがメインの役割となる。
- metaタグはheadタグ内に記述していく。
| <html> <head> <!– ここにmetaタグを記述 –> <meta…> </head> <body> </body> </html> |
sectionタグとarticleタグの違い
- sectionタグは文章やコンテンツなどひとまとまりになるものに使用する。sectionタグで囲んだ要素が「章・節・項」などであることを示し、sectionタグはhタグを含むことが推奨されている。
- articleタグはサイト内で自己完結した、独立しているコンテンツの要素に対して使用する。articleには「記事・論説」という意味がある。
| <article> <section> <h1>ブログ記事タイトル</h1> <p>テキストが入ります。</p> <section> <h2>h2見出し</h2> <p>テキストが入ります。</p> </section> <section> <h2>h2見出し</h2> <p>テキストが入ります。</p> </section> </section> </article> |
