Responsive Preview

반응형 미리보기란?

반응형 미리보기 도구는 iframe 안에서 지정한 뷰포트 크기로 웹페이지를 불러와 휴대폰, 태블릿, 노트북 등 다양한 화면에서의 레이아웃을 확인합니다. iPhone SE, iPhone 12/13, iPad, 노트북, 데스크톱, Full HD 프리셋을 기본 제공하며 가로·세로 수동 입력도 지원합니다.

주요 기능

• iPhone·iPad·노트북·데스크톱·Full HD 등 주요 기기 프리셋 내장
• 가로·세로(200~4000px) 직접 설정 가능
• 프로토콜 없는 URL은 자동으로 https:// 보완
• 크기 변경이 즉시 반영되는 iframe 미리보기
• 예시·지우기 버튼 제공

사용 시나리오 / 주의사항

리뉴얼이나 연동 확인 시 페이지가 다양한 화면 크기에서 어떻게 보이는지 빠르게 점검할 때 유용합니다. 미리보기는 대상 사이트의 정책에 따라 달라지며, X-Frame-Options나 CSP로 임베딩을 막은 사이트는 빈 화면으로 표시됩니다. 이는 사이트 정책이지 도구의 문제가 아닙니다.

사용 방법

1. 미리보기할 페이지 URL을 입력합니다
2. 기기 프리셋을 선택하거나 가로·세로 값을 직접 입력합니다
3. [미리보기]를 누르면 해당 뷰포트에서 페이지가 로드됩니다