Loading...

html

아이프레임(iframe)과 외부 콘텐츠 삽입

페이지 정보

작성자 DocsArchives
작성일 2025.09.07 20:07
분류 html
952 조회

본문

외부 콘텐츠를 웹페이지에 삽입할 때 사용하는 것이 <iframe> 태그입니다. 지도, 동영상, 광고 등 다양한 활용이 가능합니다.

기본 사용법

<iframe width="560" height="315" src="https://www.youtube.com/embed/HudTGfYF0Ug?si=JL0tu-F9AKXvw1f2" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

  • src: 외부 콘텐츠 URL

  • width, height: 크기 지정

  • allowfullscreen: 전체 화면 허용

실무 활용 사례

  1. 유튜브 동영상 삽입

  2. 구글 지도 표시

  3. 외부 웹 앱 연동

접근성 팁

  • title 속성으로 콘텐츠 설명 제공

 
<iframe src="..." title="유튜브 소개 영상"></iframe>

iframe은 강력하지만, 과도한 사용은 속도 저하와 보안 문제를 야기할 수 있습니다. 필요한 경우에만 사용하고, 접근성을 고려하는 것이 중요합니다.
댓글 0
홈으로 전체메뉴
전체 검색
회원가입