iframeとは 埋め込みの書き方と非推奨の噂の真偽 title属性とスマホ対応

自社サイトの地図や動画のところで、ソースを開くと iframe と書かれたタグが見つかった。制作会社に任せたままで、これが何なのか、安全なのか、誰にも聞いたことがない。

そういう経営者やWeb担当者に向けて、この記事を書いています。

結論から言います。iframeは、ほかのページを、いま見ているページの中に枠として表示するためのタグです。地図や動画を貼るときに、サービス側が渡してくれる「埋め込みコード」の中身が、このタグです。

「非推奨」という噂は、仕様書で確かめると半分だけ当たっていました。枠でページを分割する古いタグは廃止されていますが、iframe自体は現行の仕様に残っています。古い見た目の属性だけが、使ってはいけないものとして並んでいます。

この記事の軸は、「埋め込みのタグ1つの判断」です。埋め込むか、リンクと文字で書くか。その決め方を、仕様と計測で示します。

結論を先に言うと、お客様に必ず伝えたい情報は、枠の外の文字で書きます。枠の中の表示は、あくまで補助です。

先に答え：iframeについて、確かめられたこと

先に、この記事の結論を表にまとめます。右端の列は、答えの根拠にした資料です。

疑問	答え	根拠にした資料
iframeとは何か	ほかのページを、枠として表示するタグ	HTMLの仕様（WHATWG）のiframe要素の章
非推奨か	iframeは現行の仕様にある。frameとframesetは廃止	HTMLの仕様（WHATWG）の廃止された機能の章
title属性は要るか	付ける。枠の内容を伝える名前になる	WCAG（W3C）の技法H64
スマホではみ出すときは	幅に上限を付ける。枠線の分も考える	Chromium 145での計測
遅延読み込みはできるか	loading="lazy" で、画面の外の枠の読み込みを後回しにできる	HTMLの仕様（WHATWG）とChromium 145での計測
検索エンジンは中身を見るか	親ページの一部として扱おうとするが、保証はない	Google SEO office hours（2023年12月）
AIとの関係	公式に記載なし	Google・OpenAI・Anthropicの公式文書

この記事の読み方

表の「根拠にした資料」は、2026年11月10日に開いたものです。仕様書や公式ページは更新され続けるため、日付を添えています。

ブラウザでの計測は、同じ日にChromium 145で行いました。ほかのブラウザでの結果は、この記事では確かめていません。

仕様書にない話は、「弊社の整理」と書いて区別します。

この記事では、このタグが開ける表示の入れ物を、分かりやすく「窓」と呼びます。

この記事の根拠にした資料

使った資料の一覧です。どれも標準化団体か、検索エンジンやサービスの運営元が出している文書です。

資料	確かめたこと	開いた日
HTMLの仕様（WHATWG）の「iframe要素」「廃止された機能」「遅延読み込みの属性」	定義、内容、属性、廃止の一覧	2026年11月10日
WCAG 2.2（W3C）の技法H64	title属性で枠に名前を付ける理由	2026年11月10日
Google 検索セントラルの「Google SEO office hours（2023年12月）」と「robots メタタグ」	枠の中身を親ページとして扱うか、制御の方法	2026年11月10日
Google 検索セントラルの「動画のSEO」	動画の枠をGoogleが見つけられるか	2026年11月10日
Google 検索セントラル「AI 機能とウェブサイト」、OpenAIとAnthropicの公式文書	AIとの関係についての記述の有無	2026年11月10日
YouTubeヘルプ、Googleマップのヘルプ	埋め込みコードの取り方と、埋め込めない動画	2026年11月10日
弊社サイトの計測（WordPressの埋め込み出力、公開記事50本）	実際に出るHTMLと、枠の使用数	2026年11月10日

Q&Aサイトで見かけた「別のサーバーを枠で呼び出してよいのか」という質問

先日、Q&Aサイトでこのような悩みを拝見しました。

質問者は、無料のレンタルサーバーでサイトを運営していました。途中で、PHPの機能を使いたくなったそうです。

ただ、いまのサーバーでは使えません。移転は考えておらず、PHPが使える別のサーバーを借りて、本サイトの枠の中に呼び出すことができるか、それは普通のことなのか、と尋ねていました。

見た目は自分のサイトの一部に見せたい、という希望も添えられていました。

回答に書かれていたこと

回答は2件ありました。

1件目は、できるし問題はないが、一般には移転する、という内容です。枠で呼び出す方法には制約があるため、別のサーバーを使うなら、そちらをデータを返す窓口にして、本サイトの側のプログラムで結果を受け取るほうがよい、とも書かれていました。

2件目は、どちらも質問者さん自身が管理するサイトなら、技術的な問題はない、という内容です。ただし、2つのサイトが同じドメインを共有していないと、枠の間でクッキーを共有できないなどの制限がある、と続いていました。

さらに、検索の面では、アクセスが複数のサイトに分かれるぶん、1つのサイトで完結させるより不利になるかもしれない、という指摘もありました。

回答のどこまでが確かめられるか

「できる」という点は、仕様書で確かめられます。枠に入れるページのアドレスは、自分のサイトの中のものでも、別のサーバーのものでも書けるためです。

「別のサーバーのページを、いつでも呼び出せる」とは言えません。相手のページが、枠の中に表示されることを断る設定を返してくることがあります。この動きは、後の節でブラウザで測りました。

クッキーの制限と、検索で不利になるという指摘は、この記事では確かめていません。検索については、Googleが公式に書いている範囲を後の節で示します。

質問から読み取れる3つの疑問

この質問の底には、3つの疑問があります。

1つ目は、枠で別のページを見せるやり方が、いまも通用するのかという疑問です。古い方法という印象を持っている方が、少なくありません。

2つ目は、枠の中の表示が、自分のサイトの内容として扱われるのかという疑問です。見た目は自分のページでも、中身の持ち主は別のサーバーです。

3つ目は、そもそも枠で埋め込むべき場面なのかという疑問です。手軽さだけで選んでよいのか、迷う方が多い点です。

先に短く答える

枠は、いまも仕様にあるタグで、地図や動画の埋め込みに広く使われています。ただし、枠の中は別のページです。自分のページに必ず書きたい情報は、枠の外に文字で書きます。

次の節以降で、タグの中身、噂の真偽、崩れたときの直し方、検索やAIとの関係の順に確かめていきます。

iframeとは何か：仕様に書かれた定義

HTMLの仕様（WHATWG）は、この要素を「入れ子になった移動先を表す」と定めています。かみ砕くと、ページの中に、もう1枚のページを表示する窓を開けるタグです。

名前は「インラインフレーム」の略で、日本語の解説では「インラインフレーム」と呼ばれることもあります。

窓の中は、別のページ

窓の中に表示されるのは、src 属性で指定したアドレスのページです。そのページは、親ページとは別の文書として動きます。

親ページの文字や色の指定は、窓の中には届きません。窓の中の文字や色は、窓の中のページが自分で決めます。

別のサーバーのページを指定すれば、その持ち主が更新するたびに、自分のサイトの表示も変わります。地図や動画の貼り付けが便利なのは、この性質のためです。

タグの書き方で決まっていること

仕様書には、書き方の決まりが3つ書かれています。

決まり	仕様書の内容	実務での意味
内容	中に入れてよいものは「なし」	タグの間に文字を書いても、画面には出ない
終了タグ	開始タグも終了タグも省略できない	必ず閉じる
src の値	空ではない有効なアドレス	空のままにしない

タグの間に書いた文字が出ないことは、ブラウザで確かめました。窓のタグの間に文章を入れて、ページ全体の文字を読み取ったところ、その文章は含まれませんでした（Chromium 145）。

仕様書には、窓の中身を表示できない古いブラウザのために、昔はタグの間に代わりの文章を書いていた、という説明があります。いまの仕様では、その部分は何も表さないものとして扱われます（英語の原文を和訳）。

窓にならない書き方：srcdoc

src の代わりに、srcdoc 属性へページの中身そのものを書く方法もあります。仕様書は、この書き方を、コメント欄などの利用者が書いた文章を安全に表示するときの例として挙げています。

自社サイトの運用で使う場面は、ほとんどありません。名前を覚えておく程度で足ります。

主な属性：何を書くとどう変わるか

仕様書の「内容の属性」の一覧には、src・srcdoc・name・sandbox・allow・allowfullscreen・width・height・referrerpolicy・loading が並んでいます。

実務で目にする属性を、表にまとめます。

属性	役目	仕様書での説明
src	窓に表示するページのアドレス	空ではない有効なアドレス
title	窓の名前（利用者向け）	全てのタグに付けられる共通の属性。WCAGの技法H64が窓への付与を示す
width height	窓の幅と高さ	横方向と縦方向の大きさ
loading	画面の外の窓の読み込みの方針	lazy と eager の2つ。書かなければ eager
allow	窓の中のページに許す機能	権限の方針の指定。位置情報の例が載っている
allowfullscreen	全画面表示を許す	動画の埋め込みの例が載っている
sandbox	窓の中のページへの制限	値を書くと制限が付く。許す機能を値で選ぶ
referrerpolicy	参照元の情報の送り方	取得時に送る参照元の方針
name	窓の名前（プログラム向け）	移動先として指定するときの名前

titleとnameは別のもの

名前が2つあって混乱しやすい点です。WCAGの技法H64は、title が利用者に見せる名前で、name はプログラムや移動先の指定に使う名前だと区別しています。

name は、利用者には示されません。窓に名前を付けたいときは、title を使います。

古い属性は書かない

「廃止された機能」の章を開くと、窓のタグに付けてはいけない属性が並んでいます。frameborder・marginheight・marginwidth・scrolling・allowtransparency・framespacing・align・hspace・vspace の9つです。

地図や動画のサービスが渡す埋め込みコードには、いまも frameborder="0" が入っていることがあります。古いコードをそのまま貼ると、ページの検査ツールで「廃止された属性」と指摘されることがあります。

枠線を消したいときは、CSSの border: 0 を使います。表示は変わりません。

基本の書き方

これまでの属性を踏まえた、基本の書き方の例です。サービスから渡されたコードを貼るときも、確かめる場所は同じです。

“`html

“`

src に行き先、title に枠の名前、width と height に大きさ、loading に読み込みの方針を書いています。最後の終了タグを忘れないことが、最初の注意点です。

何に使われているか：よくある場面

窓のタグは、自社で作るものよりも、ほかのサービスが渡してくるコードの中で出会うことが多いタグです。

場面ごとの整理

よく見かける使われ方を、表にまとめます。サービスの名前は、プラットフォームとして説明に必要な範囲に限ります。

場面	窓に入れるもの	弊社の整理
地図	Googleマップの地図	所在地の補助。住所は文字でも書く
動画	YouTubeの動画	動画の補助。要点は文字でも書く
予約や問い合わせの受付	別のサーバーが出す受付ページ	受付の入口。電話番号やメールの案内も文字で書く
PDFの資料	ブラウザの閲覧画面	要点は本文に書き、PDFは詳細として置く
自社の別のページ	同じサイトのほかのページ	本文として読ませたいなら、窓を使わず直接書く
広告やアクセス解析の部品	提供元が出す小さなページ	提供元の指示に従う

YouTubeのヘルプには、埋め込みの手順として「共有」から「埋め込む」を選び、表示されたHTMLをコピーして貼る、と書かれています。年齢制限が設定された動画は、YouTube以外の一般的なサイトでは視聴できず、視聴者はYouTubeに移される、という注記もありました。

Googleマップのヘルプにも、地図を共有する手段として「地図を埋め込む」から「HTMLをコピー」を選ぶ手順が載っています。

仕様書に載っている使用例

仕様書は、窓の使い方の例を2つ載せています。

1つは、オンラインの地図サービスを埋め込み、位置情報の機能を許す例です。もう1つは、動画サイトのプレーヤーを埋め込み、全画面表示を許す例です。

どちらも、自社の外にあるサービスの部品を、自分のページに置く使い方です。仕様書の側も、地図と動画を典型例として扱っています。

弊社の公開記事での使用数

弊社の公開記事を新しい順に50本取得し、本文のHTMLを調べました。取得した記事の日付は、2026年11月6日から11月9日です。

窓のタグは、50本のうち0本でした。弊社の記事は、地図も動画も本文に入れていません。取得したのは記事の本文部分だけで、サイトの共通部分（ヘッダーやフッター）は含んでいません。

埋め込むか、リンクと文字で書くか：4つの問い

窓のタグを使うかどうかは、技術の好みで決める話ではありません。お客様がそのページで何を得たいのかから決めます。

この記事で扱う判断を、1枚の図にまとめました。左から順に問うと、埋め込むかどうかが決まります。

問い1：枠の中が見えなくても、ページは成り立つか

最初に、その窓が表示されなかったときを想像します。地図が出なかったとき、お客様は店の場所が分かるでしょうか。

分からないなら、住所を文字で書きます。駅からの道順も文字で書きます。窓は、その文字を補う部品にします。

これが、この記事の軸です。窓の中に書かれた内容は、親ページの文字として確実に扱われる保証がありません。後の節で、Googleの公式の説明を確かめます。

問い2：相手のページは、枠の中に表示される設定か

次に、窓に入れたい相手のページが、枠の中に表示されることを許しているかを確かめます。

仕様の外にある決まりですが、相手のサーバーが「枠の中には表示しない」と返してくることがあります。Googleの公式の説明にも、枠での埋め込みを防ぐHTTPヘッダーの話が出てきます。

ブラウザで測ったところ、枠の中の表示を断る設定を返すページを埋め込むと、窓の中には中身が出ず、ブラウザのエラー画面が表示されました（Chromium 145）。ページの作り手には、窓の中が空白に見えるだけで、理由は分かりません。

問い3：読む人が窓の中で操作を完結できるか

3つ目に、窓の中で、読む人が操作を終えられるかを考えます。

地図を動かす、動画を再生する、といった操作は窓の中で終わります。一方で、予約の受付のように、入力の途中でスマホの画面からはみ出したり、確認の画面で別のページに移動したりする場合は、窓の中に収めない選択もあります。

窓の中で完結しにくい操作は、リンクにして、別のページで開く形が安全です。これは弊社の整理で、仕様書には書かれていません。

問い4：読み込みの重さを払う価値があるか

窓を1つ置くたびに、別のページを1枚読み込むことになります。地図や動画の窓は、特に重くなりがちです。

記事の最初から最後まで読む人のうち、窓の場所まで来る人はどれくらいいるでしょう。ほとんど見られない位置の窓には、遅延読み込みを付けるか、リンクに替えます。

4つの問いの判定表

4つの問いへの答えをもとに、取る手を表にしました。

問いの答え	取る手	理由
窓が出なくても困る情報がある	その情報を文字で書き、窓は補助にする	親ページの文字として確実に読ませる
相手が枠での表示を断る	リンクにする	窓の中が空白になる
窓の中で操作が終わらない	リンクにする	スマホで崩れやすい
ほとんど見られない位置にある	遅延読み込みを付ける、またはリンクにする	ページの読み込みを軽くする
全部問題ない	窓で埋め込み、title を付ける	利用者にも名前が伝わる

情報の種類で見た判断

4つの問いを、よく埋め込まれる情報にあてはめてみます。

地図：住所は文字、地図は補助

所在地の案内では、住所・最寄り駅・営業時間を、文字で書きます。そのうえで、地図の窓を添えます。

窓の地図は、住所を知りたい人にも、道順を知りたい人にも役立ちます。ただし、住所の文字が無いと、窓が表示されないときに場所が分かりません。

動画：要点は文字、動画は詳細

動画は、見る人が時間を使って向き合うものです。動画の前に、何が分かる動画なのかを2〜3行で書きます。

動画の中だけにある情報は、文字で書き出しておくと、読む人にも検索にも伝わります。この点は、弊社の公開記事「PDF・画像・動画の情報をAI検索に伝える方法」で、Googleの公式ページに沿って整理しました。

予約や問い合わせの受付：窓か、リンクか

受付ページを窓で埋め込むか、別のページへのリンクにするかは、迷いやすい点です。

窓にすると、自社のページの中で手続きが完結して見えます。リンクにすると、読む人はいったん外へ出ますが、受付ページの表示は確実に崩れません。

スマホからの利用が多いサイトは、リンクを先に考えます。窓の幅の問題は、後の節で計測した結果を示します。

自社の別のページ：窓にせず、直接書く

自社サイトの中の別のページを、窓で貼り付けるのは、おすすめしません。

同じ内容は、そのページへのリンクで案内できます。本文として読ませたいなら、本文に直接書けば、親ページの文字として確実に扱われます。

窓にすると、同じ内容が2つのアドレスで存在することになり、整理が難しくなります。

情報の種類ごとの判断のまとめ

情報	文字で書くもの	窓にするもの	リンクにする場合
所在地	住所・最寄り駅・営業時間	地図	地図アプリで開くリンク
動画	動画の要点	動画プレーヤー	動画のページへのリンク
受付	電話番号・受付時間・必要な情報	受付画面	受付ページへのリンク
資料	資料の要点	閲覧画面	ダウンロードのリンク
自社の別ページ	本文を直接書く	使わない	ページへのリンク

書き直しの例

最後に、よくある書き方を、4つの問いで直す例を示します。

直す前

ある店舗のアクセスのページが、見出しと窓の地図だけでできていたとします。住所は地図の中にしか出てきません。

地図の窓が表示されない環境では、ページを開いても、店の場所が分かりません。検索で「店名 住所」を探した人にも、文字が少ないページに見えます。

直した後

見出しの下に、住所・最寄り駅からの道順・営業時間・駐車場の有無を、文字で書きます。

その下に、地図の窓を添えます。窓には title="店舗の地図" のように、窓の内容が分かる名前を付けます。

文字で書いたことで、窓が出なくても、必要な情報は伝わります。窓は、見ればより分かりやすくなる補助という位置づけになりました。

チームで決めておくとよいこと

窓の使い方は、社内でルールにしておくと、担当者が変わっても崩れません。

決めておきたいことは、次の表のとおりです。

決めること	決め方の例
窓に入れてよい相手	地図と動画のみ。それ以外は担当者に相談
文字で必ず書く情報	住所・電話番号・受付時間
必ず付ける属性	title と loading="lazy"
受付ページの扱い	スマホの確認後に、窓かリンクかを決める

「非推奨」と言われる理由と、仕様書での扱い

「窓のタグは非推奨」という言葉は、検索の候補にも出てくるほど広まっています。仕様書で、何が廃止され、何が残っているかを確かめました。

廃止されたのは、枠でページを分けるタグ

HTMLの仕様（WHATWG）の「廃止された機能」の章には、完全に廃止され、書き手が使ってはいけない要素の一覧があります。

その一覧に、frame・frameset・noframes が載っています。代わりの方法として、仕様書はこう書いています。

「iframeとCSSを使うか、サーバー側の仕組みで共通部分をはめ込んだ完全なページを作るか、どちらかにする」（英語の原文を和訳）

廃止の代替として、窓のタグが挙げられているわけです。窓のタグ自体は、廃止の一覧に入っていません。

古い属性は、廃止されている

一方で、窓のタグに付ける古い属性は、廃止の一覧に入っています。先ほど挙げた9つの属性です。

つまり、「窓のタグそのものが非推奨」という言い方は、仕様書の記述とは合いません。「古い書き方の属性が非推奨」と言えば、仕様書のとおりです。

噂の出どころ：弊社の整理

仕様書に書かれていない話は、弊社の整理として示します。非推奨という言葉が広まった理由は、次の3つが混ざっているためだと考えています。

混ざっているもの	実際のところ	確かめた先
枠でページを分ける古い方式	frame と frameset は廃止された	HTMLの仕様（WHATWG）
古い見た目の属性	9つの属性が廃止された	HTMLの仕様（WHATWG）
検索や安全面の心配	検索は次の節で確かめる。安全面は、制限の属性で扱える	Google検索セントラルとHTMLの仕様

使わない方がよい場面は、ある

仕様書に残っていることと、自社のページに向いているかは別の話です。前の節で示した4つの問いで、窓を使わない方がよい場面は決まります。

噂をそのまま信じて禁止にするのも、気にせずに全部を窓にするのも、判断を放棄した形です。問いに沿って、ページごとに決めます。

title属性を付ける理由

窓のタグに付ける属性のなかで、最も抜けやすく、最も効果がはっきりしているのが title です。

WCAGの技法H64が示していること

WCAG 2.2（W3C）の技法H64は、窓のタグに title 属性を付けることを示しています。

文書には、この技法がWCAGの2つの達成基準に関わると書かれています。1つは「ブロックのスキップ」（2.4.1）で、繰り返される部分を飛ばせるようにするための基準です。もう1つは「名前、役割、値」（4.1.2）です。

目的は、窓に名前を付けることだと説明されています。「どの枠に入って詳しく調べるかを、利用者が判断できる」（英語の原文を和訳）

titleは、窓の中身には付かない

H64には、見落としやすい注記があります。title は窓に名前を付けるもので、窓の中の内容に名前を付けるものではない、という点です。

また、窓の title 属性と、ページ全体の title 要素は別のものだとも書かれています。文書は「両方を付けるべき」としています。

窓の title は窓同士の行き来を助け、ページの title 要素は、いまどのページにいるかを伝えます。

技法は必須ではない

文書の冒頭には、技法は「WCAGを満たす方法の例で、必須ではない」と書かれています。title を付けなければ違反、という意味ではありません。

ただし、窓に名前がなければ、画面を読み上げる環境の利用者は、何の窓なのかを知る手がかりを失います。

Tabキーで止まる

ブラウザで、窓を挟んだリンクを並べ、Tabキーを3回押したところ、フォーカスの順は「前のリンク、窓、後ろのリンク」になりました（Chromium 145）。

窓はTabキーで止まる場所になります。キーボードで操作する人が、何の窓か分からないまま止まらないよう、名前を付けておきます。

付ける名前の例

窓の中身	付ける名前の例	避けたい名前
店舗の地図	店舗の地図	地図
紹介動画	会社紹介の動画	動画
受付ページ	無料相談の受付	受付
資料の閲覧画面	サービス資料の閲覧画面	PDF

名前は、何が入っているかを1語で言い切らず、「何の」を添えます。ほかの窓や、ページ内の見出しと見分けがつく文字数があれば十分です。

sandbox・allowと、埋め込めない相手

窓の中に入れるのは、他人が作ったページであることが多いものです。仕様には、窓の中のページに制限をかける属性があります。

sandboxで、窓の中のページを制限する

sandbox 属性を付けると、仕様書は、窓の中のページが独立した別の出所として扱われ、フォームやスクリプトなどが無効になると定めています。

ブラウザで、スクリプトを含むページを窓に入れて確かめました（Chromium 145）。

窓の書き方	窓の中のスクリプト
制限の属性なし	動いた
sandbox だけ	動かなかった
sandbox="allow-scripts"	動いた

値を書くと、その機能だけが許されます。全てを許せば、制限の意味がなくなります。

自社で地図や動画の部品を貼るときは、提供元の指定に従います。制限をかけすぎると、地図が動かない、動画が再生されないといった不具合が起きます。

allowで、窓に許す機能を決める

allow 属性は、窓の中のページに許す機能を決めます。仕様書の例では、地図の窓に位置情報の機能を許していました。

提供元のコードに allow が付いているときは、そのまま残します。理由が分からないまま消すと、動画の全画面表示などが効かなくなることがあります。

枠の中の表示を断る相手

相手のページが、枠の中での表示を断ることもあります。Googleは、2023年12月のSEO office hoursで、枠での埋め込みを防ぎたいときにはHTTPヘッダーの設定を使う、と説明しています。

ブラウザで、枠の中の表示を断る設定を返すページを窓に入れました。窓の中には、ブラウザのエラー画面が出ました（Chromium 145）。

自分のサイトの窓が空白に見えるときは、相手のページが断っていないかを疑います。

スマホではみ出す・崩れるとき

窓のタグで起きる困りごとのうち、最も多く相談されるのが、スマホで表示がはみ出す問題です。

何も書かないときの大きさ

窓に幅も高さも書かなかったとき、ブラウザで測った大きさは、幅304、高さ154でした。枠線は2ピクセルの溝のような線が付きます（Chromium 145）。

幅600の窓を、幅375の画面に置く

幅375ピクセルのスマホ相当の画面に、width="600" の窓を置きました。ページ全体の横幅は604になり、画面からはみ出して、横スクロールが出ました。

設定	ページ全体の横幅	結果
width="600" のまま	604	はみ出す
幅の上限を100%にしただけ	379	4ピクセルはみ出す
幅の上限を100%にして、枠線を0に	375	収まる
幅の上限を100%にして、枠線を含めた計算に	375	収まる

幅の上限だけを付けても、4ピクセルはみ出しました。枠線の太さが、幅に上乗せされるためです。枠線を消すか、枠線を幅に含める指定を足します。

比率を保つ書き方

動画のように、縦横の比率を保ちたい窓には、CSSの aspect-ratio が使えます。幅375の画面で、16対9を指定したところ、高さは約211になりました（Chromium 145）。

この例を、CSSの形で示します。

css
iframe {
width: 100%;
max-width: 100%;
border: 0;
aspect-ratio: 16 / 9;
height: auto;
}

窓の width と height の属性は、そのまま残してかまいません。CSSの指定が優先されます。

窓の高さが固まっている場合

窓の中のページの長さは、親ページからは分かりません。高さを固定すると、窓の中に縦のスクロールが出ます。

地図や動画は、比率で高さを決めるのが向いています。長い文章のページを窓に入れると、読みにくくなるため、リンクに替える方が親切です。これは弊社の整理です。

読み込みが遅くなる問題と、遅延読み込み

窓を置くと、別のページを1枚読み込みます。窓が多いページほど、表示は重くなります。

loading属性の仕様

HTMLの仕様（WHATWG）は、loading 属性を「画面の外にある窓の読み込みの方針」と説明しています。値は lazy と eager の2つで、書かなければ eager、つまりすぐに読み込みます。

lazy は、条件が揃うまで読み込みを後回しにする指定です。仕様書には、スクリプトが無効な環境では後回しにしない、という但し書きもありました。

ブラウザで測った結果

縦に8000ピクセルの余白を置き、その下に窓を置いて、スクロール前に窓のアドレスが読み込まれるかを調べました（Chromium 145）。

窓の書き方	スクロール前に読み込まれたか	窓まで進んだ後
loading なし	読み込まれた	読み込み済み
loading="lazy"	読み込まれなかった	読み込まれた

画面から遠い窓の読み込みが、後回しになりました。ページの先頭に近い窓は、すぐ見えるため、後回しにしても効果が出ません。

遅延読み込みの落とし穴は別の記事で

遅延読み込みの作り方を誤ると、Googleに見せたい内容が見えなくなることがあります。画像や一覧の遅延読み込みについては、弊社の公開記事「【Google検索セントラル解説】遅延読み込み（lazy-loading）の直し方」で、公式の説明をもとに整理しました。

窓の読み込みを軽くしたいときは、位置を見て loading="lazy" を付けるか、リンクに替えるかを決めます。

検索エンジンは、枠の中身をどう扱うか

窓の中に書かれた文字が、親ページの文字として検索に数えられるのか。ここは、公式に書かれている範囲だけを示します。

Googleが2023年12月に答えたこと

Googleは、2023年12月のGoogle SEO office hoursで、窓の中のページを親ページと関連づけるメタタグは必要か、という質問に答えています。

回答の要点は次のとおりです。「一般に、システムは窓に入れたページの内容を、窓を置いたページの一部として関連づけようとします。ただし、どちらのページも単体で見られる普通のHTMLページでもあるため、保証はありません」（英語の原文を和訳）

つまり、親ページの一部として扱われることが多そうだが、約束はされていません。この記事の軸である「大事な情報は枠の外に文字で書く」は、この説明に沿った判断です。

親ページの一部としてだけ扱わせたいとき

同じ回答には、窓に入れるページを、親ページの一部としてだけ索引に載せたいときの方法も書かれています。窓に入れるほうのページに、noindex と indexifembedded という2つのロボット用のメタタグを併せて書く方法です。

Googleのロボットメタタグの説明は、indexifembedded を「noindexがあっても、窓などで別のページに埋め込まれている場合は、内容を索引に載せてよい」という意味だと書いています。noindex と一緒に書いたときだけ効果がある、とも明記されています（英語の原文を和訳）。

自社で作った補助のページを窓に入れるときだけの話です。地図や動画の提供元のページには、手を入れられません。

窓に入れさせたくないとき

逆に、自社のページを他人の窓に入れさせたくないときは、HTTPヘッダーで防げる、というのが同じ回答の説明でした。前の節のとおり、これはブラウザでも確かめた動きです。

動画の窓は、Googleが見つけられる

Google 検索セントラルの動画のページには、Googleが動画を見つけられる要素として、video・embed・iframe・object が挙げられています。

動画の窓のアドレスは、動画のサイトマップや構造化データで、動画の再生用のアドレスとして示す例にも登場します。窓のタグそのものを避ける必要は、動画については書かれていません。

公式に記載がない範囲

次の点は、公式の文書で見つかりませんでした。

疑問	確かめた結果
窓の中の文字が、順位にどれだけ効くか	公式に記載なし
窓を何個までなら問題ないか	公式に記載なし
地図の窓を置くと、店の情報として評価が上がるか	公式に記載なし

「窓は検索に不利」「窓は検索に有利」のどちらの断定も、公式には見つかりませんでした。判断の根拠が欲しいときは、窓の外に文字で書く方針を取れば、どちらの場合でも困りません。

AI検索との関係：公式に書いてあること

ChatGPTやGeminiなどのAI検索に、窓の中の情報が読まれるのか。この点も、公式の文書で確かめた範囲だけを示します。

Google 検索セントラル「AI 機能とウェブサイト」

Googleの「AI 機能とウェブサイト」を、2026年11月10日に開きました。ページは、AIによる概要とAIモードに「追加の要件はなく、特別な最適化も必要ない」と書いています（英語の原文を和訳）。

そのページに、窓のタグに触れた記述は見つかりませんでした。

OpenAIとAnthropicの公式文書

OpenAIのクローラーの公式ページと、Anthropicのクローラーに関する公式ヘルプを開きました。どちらにも、窓の中の情報の扱いについての記述は見つかりませんでした。

OpenAIのページは、画面の描画に依存する作りで、本文の取得に限りがありました。確かめられたのは、取得できた範囲だけです。

確かめた範囲を表にする

資料	窓の中の情報についての記載
Google 検索セントラル「AI 機能とウェブサイト」	見つからなかった（公式に記載なし）
OpenAIのクローラーの公式ページ	見つからなかった（取得できた範囲）
Anthropicのクローラーの公式ヘルプ	見つからなかった

弊社の整理

ここからは公式の記載がない領域で、弊社の整理です。AIが答えを作るときに、窓の中の情報を拾うかどうかは分かっていません。

分からないのであれば、大事な情報は、窓の外の文字として書いておくのが堅実です。文字として書いてあれば、窓が拾われてもそうでなくても、同じ情報が読まれるからです。

「窓を入れればAIに引用される」と言える根拠は、見つかりませんでした。逆に、窓があるせいで引用されなくなる、という根拠もありません。

WordPressで埋め込んだときのHTML

WordPressのサイトでは、窓のタグを自分で書かなくても、アドレスを貼るだけで埋め込める場面があります。

自サイトの記事を埋め込むと出るHTML

WordPressには、記事のアドレスから、埋め込み用のHTMLを返す仕組みがあります。弊社サイトで、自社の記事1本のアドレスを渡して、返ってきたHTMLを2026年11月10日に確かめました。

返ってきたHTMLは、先に引用のブロックがあり、その中に記事の題名へのリンクが入っていました。その直後に、窓のタグが続いていました。

見つけたもの	中身
sandbox	allow-scripts だけを許す指定
title	記事の題名とサイト名を組み合わせた文字
width height	600と338
古い属性	frameborder・marginwidth・marginheight・scrolling

ここから分かることが3つあります。

まず、窓に title が自動で付いていました。名前を付ける作業は、この仕組みでは不要です。

次に、窓の手前に、題名へのリンクが文字として置かれていました。窓が出ない環境でも、リンクと題名は読めます。この記事の軸である「窓と、リンクと文字の併用」を、WordPress自身が採っている形です。

最後に、廃止された古い属性が、そのまま出力されていました。仕様書の廃止の一覧に載っている属性です。表示には影響しないため、気にしすぎる必要はありませんが、検査ツールの警告の理由にはなります。

YouTubeや地図を貼ったときのHTML

YouTubeの動画のアドレスを編集画面に貼ったときや、地図のコードを貼ったときに、WordPressが最終的に出すHTMLは、今回確かめていません。未確認です。

確かめられたのは、提供元のヘルプが案内するコードの取り方です。YouTubeでは「共有」の「埋め込む」から、Googleマップでは「地図を埋め込む」の「HTMLをコピー」から取ります。

貼る前に見る場所

提供元から渡されたコードを貼るときは、次の表の順に確かめます。

見る場所	直し方
title があるか	無ければ、窓の内容が分かる名前を付ける
loading があるか	画面の下の方なら lazy を付ける
古い属性があるか	CSSの指定に置き換える
幅が固定か	幅の上限と比率のCSSを足す

弊社の記事では使っていない

前の節で示したとおり、弊社の公開記事50本には窓のタグがありませんでした。必要がなければ、使わない選択もあります。

リンクの書き方は、弊社の公開記事「aタグとは href属性の書き方と別タブで開く設定 下線を消す方法」に整理しています。

よくある質問

Q1. iframeとは何ですか

ほかのページを、いま見ているページの中の枠として表示するタグです。地図や動画の埋め込みコードの中身です。

窓の中は別のページで、親ページとは別の文書として動きます。

Q2. iframeは非推奨ですか

窓のタグ自体は、現行の仕様に残っています。仕様書で廃止されているのは、frame・frameset・noframes と、窓のタグに付ける9つの古い属性です。

Q3. iframeで埋め込むには、どう書けばよいですか

提供元のサービスが、埋め込み用のコードを渡してくれます。コードをコピーして、ページのHTMLに貼ります。

貼ったあとに、title の有無と幅の指定を確かめます。

Q4. スマホで枠がはみ出すときは、どうしますか

幅の上限を100%にして、枠線を0にします。幅375の画面で、これで収まることを確かめました。比率を保つなら、aspect-ratio を使います。

Q5. 検索やAI検索で不利になりますか

Googleは、窓の中の内容を親ページの一部として関連づけようとするが、保証はない、と説明しています。有利・不利の断定は、公式に記載がありません。

AIについても、窓に触れた公式の記載は見つかりませんでした。大事な情報は、窓の外に文字で書きます。

まとめ：窓は補助にして、大事な情報は文字で書く

窓のタグは、ほかのページを、自分のページの中に表示するための要素です。仕様書では、frame と frameset が廃止されましたが、窓のタグ自体は残っています。

廃止されているのは、古い見た目の属性です。title を付け、枠線はCSSで消します。

スマホではみ出すときは、幅の上限を100%にして、枠線を0にします。画面から遠い窓には、loading="lazy" が使えます。

検索については、Googleが「親ページの一部として関連づけようとするが、保証はない」と説明しています。AIとの関係は、公式に記載がありませんでした。

だから、お客様に必ず伝えたい情報は、窓の外の文字で書きます。窓は、その情報を見やすくする補助です。

今日できる点検

自社サイトの窓を、次の表の順に確かめてください。ページのソースの表示と、スマホでの表示だけでできます。

点検すること	確かめ方	見つかったときの直し方
窓の数が把握できているか	主なページのソースで、窓のタグを探す	一覧にして、必要かどうかを決める
窓に title が付いているか	ソースで、窓のタグの属性を見る	窓の内容が分かる名前を付ける
窓が出なくても情報が伝わるか	窓のところを手で隠して、ページを読む	住所や要点を、文字で書き足す
スマホではみ出していないか	スマホの実機で、横スクロールを確かめる	幅の上限を100%にして、枠線を0にする
ページの下の方の窓に loading があるか	ソースで、窓のタグの属性を見る	loading="lazy" を付ける
窓の中が空白になっていないか	窓の場所を、画面で見る	相手が断っていないか確かめ、リンクに替える

ページを増やしても問い合わせが来ないなら、原因はページの外にあります。その場合は、下の入口からご相談ください。