web-dev-qa-db-ja.com

レスポンシブサイトのデスクトップブラウザーとモバイルブラウザーに同じh1タグを繰り返すことは許容されますか?

私は、メインコンテンツとしてビデオを含むページを持つWebサイトを持っています。レスポンシブデザインレイアウトを使用し、デスクトップブラウザー用とモバイルブラウザー用の2つの異なる場所で<h1>タグ(同じテキスト)を使用する必要があります。

デスクトップブラウザーではモバイルバージョンの<h1>タグを非表示にし、モバイルバージョンではデスクトップ<h1>タグを非表示にする必要があります。

これにより、SEOやその他の問題が発生しますか?

または、2番目のヘッダーを<div>タグの代わりに単純な<p>または<h1>タグにし、それに応じてCSSを適用するとどうなりますか?

3
Sandesh Yadav

複数のH1タグの使用は、それぞれが<section>要素(ページの最初のH1を除く)内にある限り、HTML 5で有効です特定のラッパーは必要ありません)。

SEOの場合、 Googleが確認済み 複数のH1タグで問題ありません。

ただし、2つの異なる場所でH1を必要とするのは奇妙に思えるので、レスポンシブレイアウトをもう一度確認する必要があります。同じ場所で同じHTMLを使用して2つの異なるレイアウトを実現できる可能性はほぼ確実です。おそらく、特定のシナリオでStack Overflowに関する質問をすると、適切な答えが得られます。

2
DisgruntledGoat

HTML 5では、それぞれが要素内にある限り、複数のH1タグの使用が有効です(特定のラッパーを必要としないページ上の最初のH1を除く)。

0
Johnnies Tan