回答編集履歴
3
見出しレベルの修正
answer
CHANGED
|
@@ -32,33 +32,33 @@
|
|
|
32
32
|
```HTML
|
|
33
33
|
<main>
|
|
34
34
|
<section>
|
|
35
|
-
<
|
|
35
|
+
<h2>ピックアップ記事</h1>
|
|
36
36
|
<article>
|
|
37
|
-
<
|
|
37
|
+
<h3>記事タイトル</h2>
|
|
38
38
|
<ul>
|
|
39
39
|
<li>投稿日時<li>
|
|
40
40
|
<li>カテゴリ<li>
|
|
41
41
|
<li>投稿者<li>
|
|
42
42
|
</ul>
|
|
43
|
-
<
|
|
43
|
+
<h4>記事内見出し1</h3>
|
|
44
44
|
<p>記事本文</p>
|
|
45
|
-
<
|
|
45
|
+
<h4>記事内見出し2</h3>
|
|
46
46
|
<p>記事本文</p>
|
|
47
47
|
</article>
|
|
48
48
|
</section>
|
|
49
49
|
|
|
50
50
|
<section>
|
|
51
|
-
<
|
|
51
|
+
<h2>最近の記事</h1>
|
|
52
52
|
<article>
|
|
53
|
-
<
|
|
53
|
+
<h3>記事タイトル</h2>
|
|
54
54
|
<ul>
|
|
55
55
|
<li>投稿日時<li>
|
|
56
56
|
<li>カテゴリ<li>
|
|
57
57
|
<li>投稿者<li>
|
|
58
58
|
</ul>
|
|
59
|
-
<
|
|
59
|
+
<h4>記事内見出し1</h3>
|
|
60
60
|
<p>記事本文</p>
|
|
61
|
-
<
|
|
61
|
+
<h4>記事内見出し2</h3>
|
|
62
62
|
<p>記事本文</p>
|
|
63
63
|
</article>
|
|
64
64
|
</section>
|
2
追記
answer
CHANGED
|
@@ -22,4 +22,48 @@
|
|
|
22
22
|
なので、`<fooer><p><small>コピーライト</small></p></footer>`もしくは`<footer><small>コピーライト</small></footer>`の方がいいかな、と思います。
|
|
23
23
|
|
|
24
24
|
私ならこの３点は最低限直すかな、と思います。
|
|
25
|
-
こだわろうと思えば他にもいろいろあるかもしれませんが、とりあえず。
|
|
25
|
+
こだわろうと思えば他にもいろいろあるかもしれませんが、とりあえず。
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
###追記
|
|
29
|
+
このページはブログのインデックス系ページであるという認識なので、
|
|
30
|
+
こっちのほうがいいかもです。
|
|
31
|
+
|
|
32
|
+
```HTML
|
|
33
|
+
<main>
|
|
34
|
+
<section>
|
|
35
|
+
<h1>ピックアップ記事</h1>
|
|
36
|
+
<article>
|
|
37
|
+
<h2>記事タイトル</h2>
|
|
38
|
+
<ul>
|
|
39
|
+
<li>投稿日時<li>
|
|
40
|
+
<li>カテゴリ<li>
|
|
41
|
+
<li>投稿者<li>
|
|
42
|
+
</ul>
|
|
43
|
+
<h3>記事内見出し1</h3>
|
|
44
|
+
<p>記事本文</p>
|
|
45
|
+
<h3>記事内見出し2</h3>
|
|
46
|
+
<p>記事本文</p>
|
|
47
|
+
</article>
|
|
48
|
+
</section>
|
|
49
|
+
|
|
50
|
+
<section>
|
|
51
|
+
<h1>最近の記事</h1>
|
|
52
|
+
<article>
|
|
53
|
+
<h2>記事タイトル</h2>
|
|
54
|
+
<ul>
|
|
55
|
+
<li>投稿日時<li>
|
|
56
|
+
<li>カテゴリ<li>
|
|
57
|
+
<li>投稿者<li>
|
|
58
|
+
</ul>
|
|
59
|
+
<h3>記事内見出し1</h3>
|
|
60
|
+
<p>記事本文</p>
|
|
61
|
+
<h3>記事内見出し2</h3>
|
|
62
|
+
<p>記事本文</p>
|
|
63
|
+
</article>
|
|
64
|
+
</section>
|
|
65
|
+
</main>
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
個別の記事セクションに該当する所を`article`で囲んでいます。
|
|
69
|
+
無くても意味は通りますが、このセクションが「独立した記事である」ことをより明確にすることができます。
|
1
用語の訂正と補足追加
answer
CHANGED
|
@@ -8,14 +8,14 @@
|
|
|
8
8
|
###【１】article要素の使い方
|
|
9
9
|
以下の理由により、現在「`article`」となっている領域は「`main`」にした方がより適切であると考えます。
|
|
10
10
|
|
|
11
|
-
・**理由１**：article要素・section要素はそのセクションに紐づく「見出し」が原則として必須であるが、このarticleには見出しが存在しない
|
|
11
|
+
・**理由１**：article要素・section要素はそのセクションに紐づく「見出し」が原則として必須であるが、このarticleには見出しが存在しない。
|
|
12
|
-
・**理由２**：現在article要素で囲まれている領域が、サイドバー領域に対する「メインコンテンツ領域」を示している。メインコンテンツ領域であることを表す要素は`main`と定められている。
|
|
12
|
+
・**理由２**：現在article要素で囲まれている領域が、サイドバー領域に対する「メインコンテンツ領域」を示している。メインコンテンツ領域であることを表す要素は`main`と定められている。articleはあくまでそのセクション自体が「独立した自己完結したセクションであること」を意味付けするためのものなので、「メインコンテンツ領域」を表すものではない。
|
|
13
13
|
|
|
14
|
-
###【２】
|
|
14
|
+
###【２】セクション要素内の見出し
|
|
15
15
|
現在、第二階層セクション以下の見出しが全てh1から始まっていますが、W3Cバリデートにかけると「警告」が出ます。
|
|
16
|
-
HTML5の仕様として、「
|
|
16
|
+
HTML5の仕様として、「セクション要素で正しく情報の階層構造が示されていればその中の見出しレベルは問わない」となっていますので、決して文法違反であるわけでありません。
|
|
17
|
-
しかしブラウザ側の実装状況が追いついておらず、
|
|
17
|
+
しかしブラウザ側の実装状況が追いついておらず、セクション構造による階層の判断が事実上できないことと、SEOの観点の2つの点から、現状では**「各文書は1つのh1を頂点とする見出しレベルの階層構造」**を作ることが推奨されています。
|
|
18
|
-
なので、
|
|
18
|
+
なので、第二階層セクション以下の見出しはh2からスタートすると良いと思います。
|
|
19
19
|
|
|
20
20
|
###【３】コピーライト表記
|
|
21
21
|
著作権表記の領域は`small`要素をつかって意味付けを補強してあげたほうがHTML5的な表現となります。
|