고정 레이아웃 문서에 'viewport' 메타 요소가 없습니다.

내.맘.대.로 2025. 10. 2. 09:17

Fixed layout document has no "viewport" meta element.

이 오류는 잡지나 그림책과 같은 고정 레이아웃(Fixed Layout) EPUB에서 발생하는 중대한 문제입니다.

오류의 의미는, 각 페이지의 정확한 크기(가로, 세로 픽셀)가 얼마인지 전자책 뷰어에게 알려주는 필수 정보인 <meta name="viewport"> 태그가 누락되었다는 뜻입니다.

800x600 픽셀 크기의 그림을 벽에 걸어야 하는 상황을 생각해보세요. 🖼️ viewport 메타 태그는 그림 뒷면에 "이 그림의 너비는 800, 높이는 600입니다"라고 붙여두는 라벨과 같습니다. 이 라벨이 없으면, 전시 담당자(전자책 뷰어)는 그림을 얼마나 크게 표시해야 할지 알 수 없어 너무 작게 보여주거나 그림의 일부를 잘라버리는 등 엉뚱하게 표시할 수 있습니다.

## 해결 방법

해결책은 고정 레이아웃 EPUB에 포함된 모든 HTML/XHTML 파일의 <head> 섹션 안에 viewport 메타 태그를 추가하는 것입니다.

페이지 크기 확인: 먼저, 제작하려는 고정 레이아웃 페이지의 정확한 가로(width)와 세로(height) 크기를 픽셀 단위로 확인해야 합니다. (예: 1024 x 768)
메타 태그 추가: 아래 형식에 맞게 width와 height 값을 자신의 프로젝트에 맞게 수정한 뒤, 모든 HTML 파일의 <head> ... </head> 안쪽에 추가합니다.

### 수정 예시

수정 전 (오류가 발생하는 <head>):

HTML

<head>
  <meta charset="UTF-8" />
  <title>1 페이지</title>
  <link rel="stylesheet" href="../css/style.css" />
</head>

수정 후 (올바른 코드): ✅

HTML

<head>
  <meta charset="UTF-8" />
  <title>1 페이지</title>
  <link rel="stylesheet" href="../css/style.css" />

  <meta name="viewport" content="width=1024, height=768" />
</head>

중요: 위 예시의 width=1024, height=768 부분은 반드시 자신의 고정 레이아웃 페이지 실제 크기에 맞게 수정해야 합니다.

저작자표시 비영리 변경금지 (새창열림)