不一致：見出しジャンプ機能の見出しとNotion見出しの整合性について

[herohoro]

デモページの「Supported blocks」によると
Heading1~3をh4からh6で作成されていますが、

Notionの見出しはh3までしか残念ながらありません。。。。

念の為Notionの方で「####」でh4を呼び出せるか確認しましたができませんでしたm(_ _)m

[otoyo]

easy-notion-blog では Notion の見出しレベルに +3 した h タグを使用しています。

easy-notion-blog/src/components/notion-block.tsx

Line 43 in f1b02d3

const tag = `h${level + 3}`

そのため Notion の Heading と h タグの関係は下記のようになります。

Notion	easy-notion-blog h tags
Heading 1	h4
Heading 2	h5
Heading 3	h6

この理由は h タグの意味を考慮してのことです。
h1 はページのトップレベルの見出しで、通常はページのタイトルに相当します。

Notion では Heading 1 であっても、Notion Blog ではページ内の1コンテンツ（個別記事ページの本文内の見出しの1つ）に過ぎません。
Heading 1 を都度 h1 としてしまうと、ページのタイトル相当の見出しが複数存在することになってしまいます。

h1 タグの使用については MDN に下記の記載があります。

<h1> はページまたはビューにつき1つだけ使用してください。内容の全体的な目的を簡潔に記載しなければなりません。
複数の <h1> を使用してもエラーにはなりませんが、これは最善の方法とは見なされていません。これは読み上げソフトや SEO で有利です。

• <h1>–<h6>: HTML の見出し要素

ただし考え方によっては色々な捉え方ができると思いますので、お好みでカスタマイズしていただければと思います。

[herohoro]

ありがとうございますm(_ _)m

見出し装飾をカスタマイズする際、他のブログの検証画面を拝見したことがありました。
本文の見出しはh2から始めている方が多いことを知り、
h2・h3を本文見出しに。h1は本文タイトルの装飾としてカスタム後、
実際使用してみると「h2とh3だけでは収まらない・・・」といった悩みが続いていました。

notion-blockの記述に+3して調整してくださっていることを知れて、
これからはNotion上でh1からh3まで使用できる = 使いやすい！見やすい！
ということになったんだなということを理解できました⭐

ありがとうございます〜