昔の自分の疑問:HTMLにはh1からh6までのタグしかないの?h7が必要ならどうするの?
※ このシリーズを通じて、初めて問題に直面した時の自分を振り返り、現在の自分がどのように成長し、心境がどのように変わったかを見てみたいです。また、1年後の自分がこれらの問題に対してより良い理解を持てるように願っています。`
HTMLにはh1からh6までのタグしかないの?h7が必要ならどうするの?
これはHTMLに触れたばかりの頃の私の疑問です。今の私はこれについて疑問を持つことはありません。
その一つの理由は、CSSやタグを使って構造をさらに細分化できることを知っているからです。また、ここ数年で私が作成したウェブページでは、h6を使うことはほとんどありません。実際、私はh1からh6は少し不必要だと感じており、すべてpで統一し、タグを使って種類を定義する方がいいと思っています。もちろん、SEO、つまりウェブクローラー向けの読み取りには、h1からh6の方がpを使うより良いのかもしれません。この点についてSEOを理解している方がこの記事を読んでいれば、ぜひ教えていただきたいです。
疑問を持たないもう一つの理由は、HTMLが設計された当初の時代背景を理解できるようになったからです。SCSSなど、さまざまな言語に触れるにつれて、多くの異なる文法が似ているようでいて異なり、同じ問題を解決するために存在することを知りました。言い換えれば、2024年現在の私が目指す「速やかに仕事に就くこと」を目標にするなら、このような小さな疑問に時間を費やす必要はないのです。それでも、ウェブプログラミングに初めて触れた頃の自分をうらやましく思います。好奇心が豊かで、仕事の目標だけでなく純粋な興味からも、より多くの発想を持てたからです。
今日の初心者は、私が初めてプログラミングを学んだ頃よりも優れています。AIがすぐに疑問に答えることができるからです。例えば、この質問に対するAIの答えは次のようになります。
HTML(HyperText Markup Language)では、h1からh6までの見出しタグがあります。これらのタグは、それぞれ6つのレベルの見出しを表しており、h1が最上位の見出し、h6が最下位の見出しです。
h7のような、これら6つの標準見出しレベルを超えるタグが必要な場合、HTML標準ではこのようなタグはサポートされていません。しかし、類似の効果を実現するために他の方法を使用することができます。
- CSSを使用してカスタムスタイルを定義する:h6タグや他のタグ(divやspanなど)を選択し、CSSを使用して外観をカスタマイズすることができます。たとえば、フォントのサイズ、太さ、色などを設定して、h7タグのように見せることができます。
- セマンティック構造:h6を超えるタグの使用を検討する際、ウェブページのセマンティック構造を考えることが重要です。通常、h1からh6が提供するレベルは、ほとんどのコンテンツの階層構造を表現するのに十分です。より多くのレベルが必要だと感じた場合は、コンテンツの構造を再考する必要があるかもしれません。
- 追加のHTMLタグ:より詳細なコンテンツ分類には、strong、em、pなどの他のHTMLタグを使用し、CSSでスタイルを設計することを検討してください。
ウェブページのセマンティック構造を明確かつ整理された状態に保つことは非常に重要です。これにより、検索エンジン最適化(SEO)が促進され、ウェブサイトのアクセシビリティが向上します。`
とにかく、この問題を振り返ると、初めてこの質問をした私が考えた可能性の一つは、プログラミング言語が非常に合理的で構造的であると期待していたことです。しかし、これら数年間で深く学ぶにつれ、JavaScriptを含む言語は必ずしも整然としているわけではなく、各開発者がより良い構文構造を提案し、各大企業も標準に影響を与えようとしていることを知りました。
さらに、今の私はそうした詳細に時間をかける余裕がなく、できるだけ短時間で仕事に就くためのスキルを磨くことに焦点を当てています。それでも、時間があれば、就職を目的とせずに、各言語の設計理由について先輩たちと気軽に話すのも面白いでしょう。