今まで気の向くままに書き散らしていたものの、ここらで一旦基礎を抑えておかなければ、と思い立ったので、今日はいろんなタグを試してみたいと思います。
まずはデカい声を出します。出ましたね。これはstrongタグ。こうして目立たせることもできる。こっちはemタグですが、使い所がいまいち分からない。SEO対策をする際には違いがあるらしいが、場末のサイトにはあんまり関係ないので覚えられる気がしない。今のはdelタグです。emタグは上手く作動しませんでした。
こちらはblockquoteタグ。引用文を表現するタグだ。長い文章を引用するときに使う。
リスト表示
- ulは
- 箇条書きに
- なりますね
- こちらはol
- ulはUnordered List
- olはOrdered Listです
季節 | 気温 |
---|---|
夏 | あつい |
冬 | さむい |
春・秋 | 丁度いい |
次はdiv,section,articleの使い分け。
とりあえずdivで囲っとけ!と雑にやっていたが、どうやらちゃんと違いがあるらしい。そりゃそうだ。
MDNにはこう記載されている。
div要素は、他に適切な意味的要素(articleやnavなど)がない場合に限り使用してください。
HTMLのコンテンツ分割要素 (div) は、フローコンテンツの汎用コンテナーです。 CSS を用いてスタイル付けがされるまでは、コンテンツやレイアウトには影響を与えません。
div要素は「純粋」なコンテナーとして、本質的には何も表しません。その代わり、classやidを使用してスタイル付けしやすくしたり、文書内で異なる言語で書かれた部分を (lang属性を使用して) 示したりするために使用します。
次にarticle
HTML のarticle要素は文書、ページ、アプリケーション、サイトなどの中で自己完結しており、 (集合したものの中で) 個別に配信や再利用を行うことを意図した構成物を表します。例えば、フォーラムの投稿、雑誌や新聞の記事、ブログの記事などが含まれます。
ある文書に複数の記事を含めることができます。たとえば、読者がスクロールするたびに各記事のテキストを次々と表示するブログでは、各記事はarticle要素に含まれ、おそらくその中に1つ以上のsectionがあります。
そしてsection
HTML のsection要素は、 HTML 文書の中で単独のセクション (区間) を表します。セクションを表現するより意味的に具体的な要素がない場合に使用します。必ずではありませんが、通常はセクションには見出しがあります。
例えば、ナビゲーションメニューはnav要素で表しますが、検索結果の一覧や地図の表示やコントロールには具体的な要素がないので、sectionの中に入れることができます。
はい。分かりませんね。
>article要素はarticle要素をネスト(入れ子)することができます。内側のarticle要素が、外側のarticle要素の内容と関係がある時のみです。
>たとえば、ユーザーの投稿コメントを受け付けるサイトのブログのエントリーは、ブログのエントリーのarticle要素内にネストされたarticle要素としてコメントを表すことができる。
いろいろなサイトを参照して、どうやらこの日記に適切なのはarticleで囲うことらしい、と理解しました。今回からそうします。
大タイトルがあって、そのなかに小タイトルがいくつか並ぶような記事の場合は、小タイトルごとにsectionで区切ると良さげ。まあ使わないな。
imgやscriptは普段から使っているので省略。分かりやすいしね。
フォーム系は受け取り設定がむずかしいけど何もしないのは癪なので、代わりにグーグルフォームへのリンクボタンを作りました。おたより待ってます!