TL
툴랩
💰후원하기
💰후원하기

아이프레임 생성기

사용자 정의 크기와 샌드박스 속성으로 HTML 아이프레임 코드를 생성합니다.

이 도구 소개

Iframe 생성기는 바로 사용할 수 있는 HTML `<iframe>` 임베드 코드를 생성합니다. 소스 URL, 크기, 제목, 스크롤 동작, 지연 로딩, 전체 화면 권한, sandbox 속성을 설정한 뒤 결과를 복사하세요.

모든 필드는 생성된 코드에 실시간으로 반영됩니다. 데이터는 서버로 전송되지 않습니다. title 속성은 접근성을 위해 필수이며, 스크린 리더가 이를 읽어 임베드된 콘텐츠를 설명합니다.

사용 방법

  1. URL 필드에 삽입하려는 URL을 입력하세요.
  2. 너비, 높이, 제목, 테두리, 스크롤, 로딩 옵션을 설정하세요.
  3. 필요에 따라 allowfullscreen과 sandbox를 켜고 끄세요. sandbox가 켜져 있으면 부여할 권한을 선택하세요.
  4. 생성된 iframe 코드를 복사해 HTML에 붙여넣으세요.

활용 사례

개발자는 정확한 픽셀 크기로 YouTube나 Vimeo 동영상을 삽입합니다. 프론트엔드 엔지니어는 sandbox 보안을 적용해 지도, 위젯, 타사 도구를 삽입합니다. 디자이너는 외부 콘텐츠를 인라인으로 포함하는 포털 페이지를 만듭니다.

자주 묻는 질문

  • sandbox 속성이란 무엇인가요?sandbox는 삽입된 페이지가 할 수 있는 동작(스크립트 실행, 폼 제출, 팝업 열기 등)을 제한합니다. 보안을 위해 실제로 필요한 권한만 활성화하세요.
  • title 속성은 왜 중요한가요?스크린 리더는 title을 사용해 시각 장애가 있는 사용자에게 삽입된 콘텐츠를 설명합니다. WCAG 2.1은 모든 iframe에 의미 있는 title을 요구합니다.
  • 모든 웹사이트가 자신을 삽입하도록 허용하나요?아닙니다. 사이트는 X-Frame-Options나 Content-Security-Policy 헤더를 보내 삽입을 차단할 수 있습니다. 명시적으로 허용된 페이지만 삽입할 수 있습니다.