【HTML Living Standard】iframe要素の使い方
iframe要素の使い方について、初心者にもわかりやすく解説します。
作成日: 更新日:
基本的な使い方
iframeオブジェクトは、現在のHTML文書内に別のHTML文書を埋め込むためのオブジェクトです。この要素を使用することで、一つのウェブページの中に、独立した別のウェブページやコンテンツを表示させることができます。例えば、外部の地図サービス、動画プレーヤー、広告、または他のサイトの特定の情報を自身のページに組み込む際に活用されます。
この要素の最も基本的な機能は、src属性によって埋め込みたいHTML文書のURLを指定することです。表示されるフレームのサイズは、width属性とheight属性を用いてピクセル単位やパーセンテージで設定することができます。
<iframe>を利用する上でセキュリティは特に重要です。sandbox属性を使用することで、埋め込まれたコンテンツが実行できるスクリプト、フォーム送信、ポップアップ表示などの機能を制限し、悪意のあるコードから自身のサイトを保護することが可能です。また、allow属性を設定することで、埋め込まれたコンテンツがカメラやマイクといったデバイス機能にアクセスする権限を細かく制御できます。
アクセシビリティの観点からは、title属性にフレームの内容を簡潔に説明するテキストを指定することが推奨されます。これにより、スクリーンリーダーなどの支援技術を利用するユーザーがコンテンツの内容を理解しやすくなります。
<iframe>は、異なるドメインのコンテンツを安全に表示したり、分離された環境でスクリプトを実行したりするための強力なツールですが、その特性を理解し、適切なセキュリティ対策を講じることが不可欠です。
公式リファレンス: <iframe>: The Inline Frame element
構文(syntax)
1<iframe src="url" title="description"></iframe>
引数(parameters)
引数なし
引数はありません
戻り値(return)
戻り値なし
戻り値はありません