[レベル: 初級]
head
セクションに iframe
タグを埋め込んではいけません。iframe
タグ以降の要素は Google にすべて無視されます。
つまり、head
セクション内の iframe
はSEO に実害を与えます。
iframe を body タグの開始とみなす
そもそも、head
セクションの中 に iframe
を配置することは HMTL の仕様として正しくありません。
しかし、もし head
内に iframe
が存在していた場合、ブラウザは通常、ページ全体が提供されなくなってしまうことを防ぐために、iframe
を見つけるとそこから body
セクションが始まったと認識します。
そして読み取りを継続します。
結果として、iframe
よりも後ろにある(head セクション内の要素として認識されるべき)要素を無視してしまうのです。
この振る舞いは検索エンジンにも共通します。
たとえば、次のような順番で iframe
タグが head
セクションに配置されていたとしましょう。
<html>
<head>
......
<title>head セクションに iframe を埋め込んではいけない</title>
<meta name="description" content="head セクションに iframe を埋め込むと Google はそこで body セクションが始まったとみなし、以降の要素を無視する。" />
<iframe>...</iframe>
<link rel="canonical" href="https://example.com/do-not-insert-iframe-in-head.html" />
<link rel="alternate" hreflang="ja" href="https://example.com/do-not-insert-iframe-in-head.html" />
<link rel="alternate" hreflang="en" href="https://example.com/en/do-not-insert-iframe-in-head.html" />
<link rel="alternate" hreflang="de" href="https://example.com/de/do-not-insert-iframe-in-head.html" />
......
title
タグと meta description
タグは正常に認識されます。iframe
タグの上にあるので何も影響を受けません。
一方、rel="canonical"
タグ と hreflang
要素は iframe
の下にあります。
したがって、これらのタグ・要素は Google に無視されます。
つまり、機能しません。
初めにも書いたように、仕様上 iframe
は head
セクションに記述すべきものではありません。
自分で意図して埋め込むことはまかり間違ってもやってはいけないことです。
ところが外的要因によって、たとえば、サードパーティ製の JavaScript が気付かないところで iframe
を head
セクションに挿入してしまうことがありえます。
この記事で紹介した iframe のトラブルは、Google の Martin Splitt(マーティン・スプリット)氏が、DeepCrawl 主催の JavaScript SEO 動画チャットで触れたものです。
ちなみにこの YouTube 動画も iframe
で埋め込まれています。
スプリット氏は実際に、サードパーティ製 JavaScript が head
セクションに iframe
を埋め込むという悪さをした事例を見たことがあるのでしょう。
head
セクション内の要素が想定どおりに機能していないときは、head
セクションに iframe
が紛れ込んでいないかどうかを疑うこともトラブルシューティングの 1 つに含めておくとよさそうです。