HTML5でのSEO
2015年2月20日
近年html5でコーディングすることが多いですが、ふと細かな仕様を見ていないことに気が付きました。
いい機会なので、ちょっと復習したいと思います。
今回はhタグについて復習です。
よく聞くh1を複数使えるんだよ。ってことです。
上が従来通り、下がhtml5的書き方。
どちらもセマンティックWebでは同じ解釈らしいのです。
後者はh1タグを複数使っていますが、sectionタグで囲まれています。
|
1 2 3 4 5 6 7 8 |
<body> <h1>Let's call it a draw(ing surface)</h1> <h2>Diving in</h2> <h2>Simple shapes</h2> <h2>Canvas coordinates</h2> <h3>Canvas coordinates diagram</h3> <h2>Paths</h2> </body> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<body> <h1>Let's call it a draw(ing surface)</h1> <section> <h1>Diving in</h1> </section> <section> <h1>Simple shapes</h1> </section> <section> <h1>Canvas coordinates</h1> <section> <h1>Canvas coordinates diagram</h1> </section> </section> <section> <h1>Paths</h1> </section> </body> |
h2 = section h1
となるようです。
この考え方を覚えておくだけでSEOにも活用出来るのではないかと思います。
何も考えないで書くと下のようになってしまいます。
section h2 = h3
section section h2 = h4
そうなると、従来の意味でh1だと思っても、sectionタグなどで囲まれてしまうとランクが下がってしまう事になります。
今まで考えからすると気持ちの悪い感じですが、仕様を見ることでわかることが多々あります。
改めて仕様書を見て、みんなで勉強するのもいいですね。