見出しタグについて

質問

こんばんは。
教えていただきたく、書き込みいたしました。

ホームページの作成なんですが。

たとえば…。
<H1>おいしい料理</H1>
<P>説明</P>
<H2>食べ方</H2>
<P>説明<P>
<H2>場所</H2>
<P>説明</P>
<H3>おすすめ料理</H3>
・お好み焼き
・うどんそば
・卵焼き…

のようにしたい場合。

１．まず、見出しタグの使い方について間違っていますか？
２．<H3>おすすめ料理</H3>
のあとのお好み焼きなどを、一つ一つ<P></P>で囲むのがいいのか、
なにか他にSEO的にいいものはあるのか？

の2点を教えてください。

回答No.6

ICHI-yan · ベストアンサー

４です。
<H1>料理</H1>
<H2>和</H2>
　　　<H3>食べ方</H3>
　　　　<p>箸で</p>
　　　<H3>おすすめ料理</H3>
　　　　<ul><li>お好み焼き</li>
　　　　　　<li>うどんそば</li>
　　　　　　<li>卵焼き</li>
　　　　</ul>
<H2>洋</H2>
　　　<H3>食べ方</H3>
　　　　<p>フォーク、ナイフ、スプーンで</p>
　　　<H3>おすすめ料理</H3>
　　　　<ul><li>ピザ</li>
　　　　　　<li>スパゲティ</li>
　　　　　　<li>オムレツ</li>
　　　　</ul>
<H2>中</H2>
　　　<H3>食べ方</H3>
　　　　<p>箸で</p>
　　　<H3>おすすめ料理</H3>
　　　　　<ul>
　　　　　　<li>ラーメン</li>
　　　　　　<li>フーヨンハイ</li>
　　　　　</ul>
見出しの構造的ってこういう事です。
こんなに単調なパターンを繰り返す必要はありません。
>飛び越えないこと、とは、<h2>がないのに、<h3>を持ってくる、とかですよね。
Yes
>では、<h3>のあとに、再度、<h2>を持ってくるのはおかしいのでしょうか？
No、但し、構造化は心がけて下さい。意識すると自分の中で整理が付くという、副産物もあります。

お礼

再度回答を頂き、ありがとうございました。
助かります。
今、手直し中なのですが、<H2</H2>で囲む言葉は、
リンクされてるものでもいいのでしょうか？

回答No.5

MAN_MA_RUI

ha-mu-taさん、こんばんは。MAN_MA_RUIと申します^^

> <h2>は中見出し、<h3>は小見出しと考えて下さい。
<h2>の中で<h3>という見出しを作ることにより内容を分岐させてるとお考えください。

構造的にも正しい文章を書くことはアクセシビリティの面からお勧めできます。
理屈としてはいろいろなリファラーのサイト利用に絶えうると思います。
参考リンクなんかを使って正しいHTMLを書けるよう試みてください。

他にも、ある程度回りくどい表現を避けるとSEO的にも効果があると思います。
以下の２つの文章を例に挙げると、1はある程度凝った表現ですが、「トマト」と言っていないため検索で「トマト」と引っかからない可能性があります。
2は普通にトマトと言っているから検索で「トマト」のキーワードが引っかかるかもしれません。
1.そう、それは赤い。そう、それは食べられるものである。上から読んでも下から読んでも同じ、と言えば分かるであろう。私はそれを―（略）
2.私はトマトを―（略）

METAだの検索登録だのと言ったことをすることは問題ありませんが、そちらに重点を置いてはいけません。
小細工を一生懸命がんばるよりもちょっとした気遣いがプラスに転じるのではないかと思います。
ユーザーにとって利用しやすいようにする、これぞ気遣い^^
（つーか小細工ばかりに重点を置きすぎるのは本末転倒。サイトは中身で勝負だ！・笑）

参考URL：

http://openlab.ring.gr.jp/k16/htmllint/htmllintl.html

お礼

ありがとうございます。
気遣い…本当に大切だと思います。
参考にさせていただきます。

回答No.4

ICHI-yan

<h1>は１ページに１つが望ましい。
<h2><h3>は幾つでもいい。が飛び越えないこと。論理的・構造的に記述することが望ましい。その構造がseoにも効果ありです。

<h2>は中見出し、<h3>は小見出しと考えて下さい。意味的に考えると
<h2>場所　　　　　の中見出しの中の小見出しが
<h3>おすすめ料理　ではおかしいとなります。

意味を理解しないプログラムにも文章の関係を教えてあげるという意味で、論理的・構造的に<hn>をつけることはseo的に効果ありになります。人間にも機械にも理解できる文章になります。

補足

ありがとうございます。
飛び越えないこと、とは、<h2>がないのに、<h3>を持ってくる、とかですよね。
では、<h3>のあとに、再度、<h2>を持ってくるのはおかしいのでしょうか？

回答No.3

神崎 渉瑠（@taloo）

他人の意見に口出しするなと言う規約に反しますが、
> ANo.2
> 残念ながら間違いです。h2が２つありますよね？
> h1～6は基本的には、各一つだけなのです。
問題ありません。

たとえばこちらのページのソースなどが参考になると思います。
http://www.w3.org/TR/xhtml1/
このような内容の解説ページでは、ページを分割しなければならなくなってしまいます。

> ANo.1補足
スタイルシートで調整出来ます。

補足

ありがとうございます。
幸いなことに、スタイルシートを使っています。
もしよろしければ、入力方法を教えていただけますでしょうか？

回答No.2

naokita

残念ながら間違いです。h2が２つありますよね？
h1～6は基本的には、各一つだけなのです。
（何個使っても表示には一切不都合ありませんが・・・）

補足のリスト件は、CSSで可能です。
下記例はstyle属性を使ってますので、比較・試用しながら
style要素で応用させて下さい。

<h3>おすすめ料理</h3>
<ul style="list-style: square; margin-top: -0.8em;">
<li style="margin: 0 0 0 -1em;">お好み焼き</li>
<li>うどんそば</li>
<li style="margin-left: 12px;">卵焼き</li>
<li style="margin: 10px;">味噌ラーメン</li>
</ul>

画像の場合は、squareの部分に　url(ここに画像ＵＲＬ)

補足

回答ありがとうございます。
お返事おそくなり申し訳ございません。
＞<ul style="list-style: square; margin-top: -0.8em;">
<li style="margin: 0 0 0 -1em;">お好み焼き</li>
<li>うどんそば</li>
<li style="margin-left: 12px;">卵焼き</li>
<li style="margin: 10px;">味噌ラーメン</li>
</ul>
とありますが、スタイルシートの場合はどのように入力したらいいのでしょうか？

回答No.1

dezimac

間違っていませんんよ。

・お好み焼き
・うどんそば
・卵焼き…
こういうのはリストにするといいです。
<ul>
<li>お好み焼き</li>
<li>うどんそば</li>
</ul>

補足

とても早い回答を頂き、ありがとうございます。
今、やってみたのですが、
<ul>
<li>お好み焼き</li>
<li>うどんそば</li>
</ul>
にすると、おすすめ料理のあとが、1段あいてしまい、
さらに、お好み焼き・うどんそば…
の前がかなり空白になってしまいます。
<ul><li>のタグを今まで使ったことがなく、分かりません。
よろしければ、教えていただけないでしょうか？
いろいろなサイトを見ていると、<ul><li>のタグを使っていながらも、
項目の前が・ではなく、■とか以外の画像のサイトがありました。
これは、可能なのでしょうか？