今回わからなったワード
- マークアップ…HTMLタグを使って、文章を構造化する作業のことをいいます。ブラウザがこれを認識することで、見出し・リスト・リンクなどが画面上にわかりやすく表示されます
- ファビコン…ファビコンとは、ブラウザのタブやブックマーク一覧などに表示される小さなアイコンのこと
- パス…
＜要素名 ＝ 属性 ” 属性値 ”＞ これが文法
文書情報
title要素…ページタイトル
- ページの内容が伝わりやすい、シンプルなタイトルにする。
- タイトルとページの内容にずれが生じないようにする。
- タイトルの前方にターゲットキーワードを含め、検索クエリとの関連性を強調する。
- 適切な長さ、文字数にする。
meta要素…検索エンジンやブラウザにWebページの情報を伝えるHTMLタグの1つ
- meta charset…文字コードの設定。Webページの文字をどのように表示するのかを設定すること（utf-8）
- meta description…ディスクリプションはWebページの概要を検索エンジンに知らせるタグ
- meta keywords…ページの内容をKWで表現して検索エンジンに認識させる役。割かつて（検索エンジンの精度がまだ低かった時代、Webページの情報がどのようなキーワードと関連したものなのかを検索エンジンに伝える役割を果たしていた）
- meta author…HTMLファイルに書く「このページは誰々さんが作りました」な情報のこと
- meta viewport…スマホやタブレットなどのモバイル端末でもWebページを適切なサイズで表示させるための設定
詳しいコードのやり方はこちら （参考URL）https://html-css.hamaya2020.com/lesson-2.html#L2-3-2
・link要素
そのページのHTML文書と、外部のファイルやページ（CSSファイルとか）を関連付けるための要素
・link要素
ファビコン…オリジナルのファビコン（Favicon）を指定することができる
ファビコンの拡張子は「.ico」
文書本文に記載するタグ
ブロックレベル要素とインライン要素がある
ブロックレベル要素…縦に積まれる（pタグ（ブロック要素）は何個並べても、横には並ばずに、縦に並んでいく）
- ブロックレベル要素一覧
<address>,<blockquote>,<center>,<dir>,<div>,<dl>,<fieldset>,<form>,<h1>~<h6>,<hr>,<isindex>,<menu>,<noscript>,<noframes>,<ol>,<p>,<pre>,<table>,<ul>見出し、段落、リスト、テーブルなどが該当します。
インライン要素…横に並ぶ
- インライン要素一覧
<a>,<abbr>,<acronym>,<applet>,<b>,<basefont>,<big>,<br>,<button>,<cite>,<code>,<dfn>,<em>,<font>,<i>, <iframe>,<img>,<input>,<kbd>,<label>,<object>,<q>,<s>,<samp>,<select>,<small>,<span>,<strike>,<strong>,<sub>,<sup>,<textarea>,<tt>,<u>,<var>
ブロックレベル要素内の文章の一部となる要素で、リンク、強調、略語などで使うタグが該当します。
- ブロックレベル要素の中にはブロックレベル要素・インライン要素を入れてもOK
- インライン要素の中にブロックレベル要素を入れる事はできない
セクション分類タグ
HTMLファイルに書かれている見出しとその内容が書かれている文章をまとめる役割
- h1~h6要素…見出し
数字が大きくなるとサイズは小さくなる。またh1はページにひとつだけ指定する - article 要素（アーティクル）
文書、ページ、アプリケーション、サイトなどの中で自己完結しており、（集合したものの中で）個別に配信や再利用を行うことを意図した構成物を表す。例えば、フォーラムの投稿、雑誌や新聞の記事、ブログの記事、商品カード、ユーザーが投稿したコメント、対話型のウィジェットやガジェット、その他の独立したコンテンツの項目が含まれる。 - section 要素（セクション）
ページの中のコンテンツを区分する用途で使われる。
例えば記事ページであれば、記事本文の他に関連コンテンツ（オススメ、リコメンド）の紹介やランキングなどを掲載することがあると思いますが、このようなコンテンツをマークアップする際に使われる。 - header 要素（ヘッダー）
ページ上部のヘッダーブロックを定義します。セクション要素やアーティクル要素内のヘッダー情報としても使用可能。 - footer 要素（フッター）
ページ下部のフッターブロックを定義する。セクション要素やアーティクル要素内のフッター情報としても使用可能 - nav 要素（ナビ）
現在の文書内の他の部分や他の文書へのナビゲーションリンクを提供するためのセクションを表す - aside 要素（アサイド）
補足や脚注、用語の説明など、本筋とは別に触れておきたい内容、または本筋から分離して問題のない内容を含んだセクションを表す。 広告もこれに含まれる。
↓画面上で見るとこんな感じ （参考URL：https://html-css.hamaya2020.com/lesson-2.html#L2-5）
表示サンプル（参考URL：）
・コンテンツ分類タグ
- P要素（段落 パラグラフ）
段落を表す。 - hr 要素（区切り）
テーマや話題の区切りを指定する - ul/li 要素（順序のないリスト アンポーターリスト）
買い物のメモみたいなもの。順番が関係なく箇条書きスタイル（中黒がつく）
例：
・りんご
・バナナ - ol/li 要素（順序のあるリスト オーダーリスト）
料理でいうところのレシピの順番の様に、順番があるもの（ナンバリングがつく）
例：
1.りんごの皮をむく
2.りんごを切る - dl/dt/dd 要素（定義（説明すること）・説明リスト）
説明する言葉と、その説明分
例：りんご
赤くて甘い - div 要素（ひとつのかたまりの範囲）
ブロック要素ですが、同じように単体では意味を持たないタグのひとつにspanタグもあります。 使い方の例として、<p>タグで囲ったテキストの一部の色を変えたい時など、CSSでスタイルを指定する時に使います。
