전체 페이지 스크린샷과 PDF 내보내기를 언제 쓸지

웹 페이지는 하나의 긴 이미지나 여러 페이지로 나뉜 PDF로 저장할 수 있습니다. 두 형식 모두 내용을 유지하지만, 파일이 브라우저 밖으로 나간 뒤의 동작이 다릅니다. 어떤 형식을 고를지는 독자가 레이아웃을 정확히 봐야 하는지, 텍스트를 검색해야 하는지, 인쇄해야 하는지에 따라 결정됩니다.

이 글은 같은 예시 페이지로 두 형식을 비교하고, 각 형식의 실패 사례를 정리합니다. 또한 화면을 캡처해 검색 가능한 PDF로 내보내는 세 번째 방법을 설명합니다. 예시의 모든 수치는 데스크톱 너비로 캡처한 긴 기사 페이지 하나에서 나왔습니다.

각 형식의 특징

전체 페이지 스크린샷은 스크롤 가능한 전체 페이지를 담은 단일 래스터 이미지입니다. 너비는 브라우저 창과 같고, 높이는 페이지 길이에 따라 늘어나며 10,000픽셀 이상이 되는 경우도 많습니다. 글꼴, 이미지, 색상을 포함해 렌더링된 모든 픽셀이 그대로 기록됩니다.

브라우저에서 만든 PDF 내보내기는 인쇄 엔진에서 생성됩니다. 브라우저는 종이용으로 페이지를 다시 배치하고, 사이트에 인쇄용 스타일시트가 있으면 적용한 뒤 결과를 페이지 단위로 나눕니다. 텍스트는 보통 실제 텍스트로 남아 선택, 검색, 복사가 가능하며 링크도 대부분 동작합니다.

차이는 결과를 만드는 방식에 있습니다. 스크린샷은 화면을 기록합니다. 브라우저 PDF는 인쇄를 위해 페이지를 다시 렌더링합니다.

이 글에서 사용하는 예시 페이지

아래 비교는 텍스트가 많은 기사 페이지 하나를 기준으로 합니다. 이 페이지에는 고정 헤더, 쿠키 배너, 스크롤할 때 로드되는 인라인 이미지 14개, 하단의 댓글 위젯이 있습니다. 1920픽셀 너비의 데스크톱 창에서 전체 페이지 높이는 12,000픽셀입니다.

이 페이지는 블로그, 문서 사이트, 뉴스 기사에서 흔한 형태입니다. 인쇄 규칙, 지연 로드 이미지, 늦게 나타나는 위젯이 함께 있어 두 형식의 결과 차이가 가장 크게 나타나는 페이지이기도 합니다.

픽셀, 포인트, 용지

스크린샷은 픽셀 단위로 측정합니다. PDF 페이지는 포인트 단위로 측정하며, 1인치는 72포인트입니다. 브라우저는 인쇄할 때 CSS 픽셀 하나를 1/96인치로 취급하므로, A4 페이지는 약 794 × 1123 CSS 픽셀이고 US Letter 페이지는 약 816 × 1056 CSS 픽셀입니다.

따라서 1920픽셀 너비로 설계된 레이아웃의 브라우저 PDF는 화면과 거의 같아 보이지 않습니다. 인쇄 엔진이 사용할 수 있는 너비는 약 800픽셀이므로, 내용을 더 좁은 단으로 재배치하거나 축소합니다. 스크린샷은 1920픽셀 너비를 그대로 유지하며 재배치하지 않습니다.

전체 페이지 스크린샷이 유리한 경우

• 정확한 시각 기록. 디자인 리뷰, 버그 리포트, 전후 비교에는 인쇄 결과가 아니라 화면에 보이던 그대로의 페이지가 필요함.
• 인쇄 스타일이 부실한 페이지. 많은 사이트가 인쇄할 때 이미지를 숨기거나, 레이아웃을 무너뜨리거나, 배경을 제거함. 스크린샷은 인쇄 규칙을 적용하지 않음.
• 앱 형태의 페이지. 대시보드, 지도, 캔버스 기반 도구는 빈 페이지나 깨진 페이지로 인쇄되는 경우가 많음.
• 채팅이나 슬라이드로 공유. 이미지 하나면 PDF 뷰어 없이 메시지, 티켓, 슬라이드에 바로 넣을 수 있음.

단점은 파일 크기와 텍스트입니다. 긴 PNG는 여러 MB에 이를 수 있습니다. 텍스트가 픽셀로 저장되므로 검색하려면 OCR이 필요합니다.

시각 검토와 비교

디자인팀과 QA팀은 릴리스 전후의 페이지를 비교합니다. 같은 너비로 찍은 스크린샷 두 장은 Compare Images로 비교할 수 있습니다. 이 도구는 슬라이더, 페이드, 나란히 보기, 픽셀 차이 보기를 제공합니다. 같은 페이지의 PDF 두 개는 비교가 훨씬 어렵습니다. 한 줄만 바뀌어도 그 뒤의 모든 페이지 나누기가 밀릴 수 있기 때문입니다.

비교는 두 캡처가 같은 설정을 쓸 때만 의미가 있습니다. 창 너비, 대기 시간, 광고 차단을 동일하게 유지합니다. 그렇지 않으면 차이 보기에 페이지에 없는 변화가 나타납니다.

인쇄되지 않는 페이지

일부 페이지 유형은 거의 항상 인쇄 엔진에서 실패합니다.

• 데이터 로드 후 캔버스 요소에 차트를 그리는 대시보드
• 창 크기에 맞춰 스스로 크기를 정하는 지도 보기와 이미지 뷰어
• 본문 대신 스크롤 패널에 내용을 넣는 단일 페이지 앱
• 주요 내용을 숨기는 인쇄용 스타일시트로 인쇄를 막는 페이지

이런 페이지는 인쇄 미리보기에서 빈 용지, 잘린 화면 하나, 또는 내비게이션만 표시됩니다. 스크린샷은 인쇄 규칙과 관계없이 화면에 그려진 내용을 캡처합니다.

긴 이미지의 크기와 높이 제한

긴 스크린샷에는 실질적인 제한이 있습니다. 텍스트 기사의 1920 × 12,000 PNG는 보통 3MB에서 8MB 사이이며, 같은 이미지를 품질 80의 JPEG로 저장하면 흔히 그 3분의 1 수준입니다. 일부 이미지 뷰어와 채팅 앱은 매우 긴 이미지를 크게 축소하므로, 파일을 열지 않으면 글자를 읽을 수 없습니다.

긴 캡처를 보내기 전에 픽셀 크기와 파일 크기를 확인합니다. Screenshot Resolution Checker는 너비, 높이, 파일 크기, 가로세로 비율을 보여줍니다. 채팅이나 티켓 시스템에 업로드 제한이 있으면 Image Compressor로 파일을 줄입니다.

PDF 내보내기가 유리한 경우

• 읽기와 검색. 선택 가능한 텍스트는 검색, 복사, 화면 낭독기에서 동작함.
• 인쇄. 긴 띠 하나가 아니라 용지 크기에 맞춰 페이지가 나뉨.
• 기사 보관. 인쇄용 스타일시트가 잘 갖춰진 텍스트 중심 페이지는 깔끔하고 작은 파일을 만듦.
• 작은 파일 크기. 텍스트 기반 PDF는 같은 페이지의 이미지보다 훨씬 작은 경우가 많음.

단점은 재배치에서 생깁니다. 고정 헤더가 모든 페이지에 반복되거나, 지연 로드 이미지가 빠지거나, 인쇄용 스타일시트가 숨긴 내용이 사라질 수 있습니다. PDF는 인쇄 엔진이 만든 결과를 보여주며, 이는 화면과 다를 수 있습니다.

예시 PDF에서 발생한 문제

예시 기사는 A4 9페이지로 인쇄되었습니다. 스크린샷에는 없던 문제가 세 가지 나타났습니다.

1. 고정 헤더가 모든 페이지 상단에 그려졌고, 2페이지부터 9페이지까지 텍스트 첫 두 줄을 가렸습니다.
2. 첫 화면 아래의 이미지 14개 중 5개가 빈 상자로 나왔습니다. 인쇄 엔진이 페이지를 배치할 때 아직 로드되지 않았기 때문입니다.
3. 인쇄용 스타일시트가 댓글 위젯을 숨겨서 위젯이 빠졌습니다.

쿠키 배너도 1페이지에 인쇄되어 제목 위에 겹쳤습니다. 이 문제들은 텍스트를 바꾸지 않으므로, 9페이지 전체에서 검색과 복사는 계속 동작했습니다.

인쇄용 스타일시트가 도움이 되는 경우

좋은 인쇄용 스타일시트는 내비게이션, 광고, 사이드바를 제거하고, 읽기 좋은 글자 크기를 지정하며, 링크 텍스트 뒤에 링크 대상을 인쇄합니다. 문서 사이트와 장문 발행물에는 보통 이런 스타일시트가 있습니다. 이런 페이지에서는 브라우저 PDF가 어떤 스크린샷보다 깔끔합니다.

인쇄 미리보기에서 세 가지를 확인합니다. 내비게이션이 없는지, 본문이 페이지 너비를 채우는지, 이미지가 텍스트 단 안에 놓이는지입니다. 세 가지가 모두 맞으면 PDF로 인쇄하면 됩니다.

PDF를 바꾸는 인쇄 대화상자 옵션

브라우저 인쇄 대화상자의 옵션 네 가지가 결과를 대부분 결정합니다. Paper size는 레이아웃이 재배치되는 페이지 너비를 정하므로, A4와 Letter는 서로 다른 줄에서 페이지를 나눌 수 있습니다. Scale은 레이아웃을 축소하거나 확대합니다. 80%에서 90% 사이의 배율은 넓은 표를 한 페이지에 담고 오른쪽 가장자리가 잘리지 않게 하는 경우가 많습니다.

Margins를 최소로 설정하면 내용의 너비는 늘어나지만, 일부 프린터에서 텍스트가 잘릴 수 있습니다. Headers and footers는 페이지 제목, URL, 날짜, 페이지 번호를 추가합니다. 보관용 아카이브에는 유용하지만 배포용 문서에는 불필요한 정보입니다. Background graphics는 앞서 설명한 대로 색상 상자와 배너 이미지가 나타날지 여부를 결정합니다.

중요한 PDF를 만들 때는 사용한 옵션을 파일 이름이나 메모에 기록합니다. 기록이 없으면 한 달 뒤 같은 페이지를 다시 내보낼 때 페이지 나누기가 달라져, 페이지가 바뀐 것처럼 보일 수 있습니다.

결정 표

필요	전체 페이지 스크린샷	브라우저 PDF
화면과 정확히 일치	예	대개 아님
선택과 검색이 가능한 텍스트	OCR 후에만 가능	보통 가능
클릭 가능한 링크	아니요	보통 가능
표준 용지에 인쇄	불량	예
대시보드와 웹 앱에서 동작	예	자주 실패
채팅이나 슬라이드에 붙여넣기 쉬움	예	아니요
긴 텍스트 페이지의 파일 크기	더 큼	더 작음

간단한 기준은 이렇습니다. 누군가 보기만 한다면 스크린샷을 찍고, 읽거나 검색하거나 인쇄한다면 PDF를 내보냅니다.

독자에 맞춰 형식 선택

표는 독자를 특정할 때 가장 잘 작동합니다. 디자이너는 스크린샷을 원합니다. 변호사, 감사인, 학생은 보통 인용할 수 있는 텍스트가 있는 PDF를 원합니다.

표가 다루지 않는 경우

일부 페이지는 두 열 중 어디에도 잘 맞지 않습니다. 무한 스크롤 피드에는 끝이 없으므로, 전체 페이지 캡처는 임의의 높이에서 멈추거나 끝나지 않습니다. 인쇄 엔진은 로드된 내용만 인쇄합니다. 로그인 뒤에 있는 페이지는 브라우저 세션을 공유하지 않는 도구로 인쇄할 수 없습니다.

무한 피드는 전체 페이지 대신 고정된 수의 화면을 캡처합니다. 로그인이 필요한 페이지는 세션이 활성화된 브라우저에서 캡처합니다. 두 경우 모두 아래의 하이브리드 방법을 사용합니다.

선택 전 2분 테스트

답이 분명하지 않으면 같은 페이지로 두 파일을 모두 만들어 비교합니다. 페이지를 PDF로 인쇄하고, 전체 페이지 스크린샷을 한 장 찍은 뒤, 두 파일을 나란히 엽니다.

네 가지를 순서대로 확인합니다. 빠진 이미지, 반복되는 헤더, 잘린 표, 선택할 수 없는 텍스트입니다. 문제가 적은 형식이 그 사이트에 맞는 형식입니다. 사이트의 페이지들은 보통 같은 방식으로 동작하므로, 테스트 한 번으로 한 묶음 전체의 형식이 대개 정해집니다.

하이브리드: 뷰포트 시퀀스에서 페이지 PDF로

세 번째 방법은 스크린샷의 시각적 정확성과 PDF의 페이지 나누기를 결합합니다. 페이지를 한 번에 한 화면씩 캡처한 뒤, 프레임을 화면 하나당 한 페이지인 PDF로 합치고 위에 OCR 텍스트를 올립니다.

Temposhot에서는 Auto Capture가 브라우저 창을 소스로 이 작업을 수행합니다. Stop condition을 Screenshots로 설정하고, Key press로 Space를 지정하며, Interval을 1초로 설정합니다. 각 프레임은 다음 키 입력 전에 저장됩니다. 결과 창에서 PDF를 선택하면 인식된 텍스트가 포함된 검색 가능한 PDF로 내보내집니다. Key press 자동화에는 Temposhot Pro가 필요합니다.

URL 목록의 경우 Website Capture에서 각 페이지를 Full page로 캡처하고 세션을 PDF로 내보낼 수 있습니다. URL 하나당 한 페이지가 됩니다. 기존 긴 스크린샷은 Split Image로 페이지 크기 조각으로 나눈 뒤 Image to PDF로 합칠 수 있습니다. 스크린샷 PDF에 텍스트 레이어를 추가하려면 Screenshot to Searchable PDF를 사용합니다.

레시피: 브라우저 창 하나, 화면 하나당 페이지 하나

예시에서 브라우저 창은 화면 하나에 약 1,000픽셀의 내용을 보여줬습니다. 대부분의 브라우저에서 Space는 전체 화면보다 약간 적게 스크롤하므로, 12,000픽셀 기사의 맨 아래에 도달하려면 13개 프레임이 필요했습니다. 개수를 14로 설정하면 여유 프레임이 하나 추가되며, 마지막 화면과 같으면 삭제합니다.

1. 페이지 준비

   기사를 열고, 쿠키 배너를 닫은 뒤, 지연 로드 이미지가 로드되도록 맨 아래까지 스크롤했다가 맨 위로 돌아갑니다. PDF에 담고 싶은 너비로 브라우저 창 크기를 맞춥니다.

2. 옵션 설정

   Auto Capture에서 위의 설정을 적용합니다. 5초 카운트다운 동안 페이지를 클릭해 Space가 페이지에 전달되도록 합니다.

3. 창 선택

   소스 선택기를 열고 Windows를 선택한 뒤 브라우저 창을 고릅니다. Start Capture를 선택합니다.

4. 프레임 확인

   창에 Capture complete가 표시되면, 바로 앞 화면과 같은 마지막 프레임의 체크를 해제합니다.

5. PDF 내보내기

   PDF를 선택합니다. 검색 가능한 PDF는 캡처 순서대로 화면 하나당 페이지 하나가 됩니다.

레시피: 여러 URL을 전체 페이지로

작업이 20개 또는 200개 페이지라면 브라우저 창은 적절한 소스가 아닙니다. Website Capture는 URL 목록을 받아 행마다 설정을 적용하고, URL당 이미지 하나를 저장합니다. 각 페이지를 비공개 WebKit 세션에서 열기 때문에, 로그아웃한 방문자가 보는 그대로 캡처합니다.

기사 페이지에는 Network idle보다 Load와 2초 Delay가 안전합니다. 분석 도구나 채팅 위젯이 계속 폴링하는 페이지는 시간 초과가 발생할 수 있기 때문입니다. Hide only는 동의 배너에 응답하지 않고 이미지에서 배너만 제거합니다. 결과 창에서 PDF를 선택하면 URL당 한 페이지인 검색 가능한 PDF 하나가 만들어집니다.

레시피: 긴 스크린샷 하나를 인쇄용 페이지로

이미 있는 전체 페이지 PNG는 새로 캡처하지 않고도 페이지로 나눌 수 있습니다. 1920 × 12,000 예시는 높이 2,400픽셀씩 5개 행으로 나뉩니다. 각 조각의 비율은 4:5이며, 여백을 두면 A4에 맞습니다.

고정 격자는 조각 경계에서 텍스트 줄을 반으로 자를 수 있습니다. 분할한 뒤 각 경계를 확인합니다. 자른 위치가 제목이나 표에 걸리면, Auto Capture의 뷰포트 시퀀스를 사용합니다. 각 화면이 창의 끝에서 끝나기 때문입니다.

결정 전 실용 팁

1. 인쇄 미리보기를 먼저 확인합니다. 브라우저의 인쇄 대화상자를 열고 미리보기를 훑습니다. 결과가 괜찮으면 브라우저 PDF가 가장 빠른 방법입니다.
2. 색상이나 이미지가 없으면 인쇄 대화상자에서 Background graphics를 켭니다.
3. 전체 페이지 캡처 전에 페이지를 한 번 스크롤합니다. 지연 로드 이미지가 나타나게 하기 위해서입니다. 지연 로딩 항목에서 이유를 설명합니다.
4. 텍스트가 많은 스크린샷에는 PNG를 선택합니다. JPEG 압축은 작은 글자를 흐리게 만들어 OCR 정확도도 낮춥니다.
5. 중요한 기록은 두 형식을 모두 보관합니다. 스크린샷은 페이지가 어떻게 보였는지 증명하고, PDF는 텍스트를 쉽게 검색하게 합니다.

전체 페이지 캡처 문제 해결

증상	가능한 원인	변경 사항
이미지가 있어야 할 자리에 회색 상자	캡처 시점에 지연 이미지가 로드되지 않음	Delay를 2초에서 5초로 추가하거나, 창 캡처 전에 페이지를 한 번 스크롤함
이미지 중간에 헤더가 나타남	스크롤하며 이어 붙이는 캡처 중 고정 헤더가 다시 그려짐	행에서 Render preview를 선택하고, 배치를 실행하기 전에 이미지를 확인함
동의 배너가 내용을 가림	새 방문자에게 배너가 표시됨	Cookies를 Reject banners 또는 Hide only로 설정함
한 URL에서 캡처 실패	페이지가 Network idle에 도달하지 않음	Wait until을 Load로 바꾸고 행을 다시 실행함
확대하면 이미지가 흐림	낮은 품질의 JPEG	PNG를 사용하거나 JPEG 품질을 100에 가깝게 올림

쿠키 처리는 최선의 노력으로 동작합니다. 일부 맞춤형 동의 시스템은 여전히 이미지에 나타나므로, 이런 페이지는 수동으로 확인합니다.

중복 없이 두 파일 보관

중요한 기록은 스크린샷과 PDF를 같은 이름으로 나란히 보관합니다. 캡처 날짜를 넣은 폴더를 페이지마다 하나씩 만들면 나중에 감사하기 쉽습니다.

하이브리드 방법을 빠르게 하는 단축키

키보드로 캡처를 시작하고 멈추면 뷰포트 방법이 더 빨라집니다. Temposhot의 Capture 메뉴는 브라우저가 앞에 있을 때도 동작합니다.

자주 묻는 질문

전체 페이지 스크린샷을 검색할 수 있습니까?

예. OCR을 거치면 검색할 수 있습니다. Temposhot에서 프레임을 PDF로 내보내면 인식된 텍스트가 추가되며, Extract Text from Image는 이미지 한 장에서 텍스트를 추출합니다.

브라우저 PDF가 페이지와 다르게 보이는 이유는 무엇입니까?

브라우저는 종이에 맞춰 페이지를 다시 배치하고 사이트의 인쇄용 스타일시트를 적용합니다. 인쇄에서 숨겨진 요소, 고정 헤더, 지연 로드 이미지가 대부분의 차이를 만듭니다.

법적 또는 규정 준수 기록에는 어느 형식이 더 적합합니까?

스크린샷은 화면에 실제로 나타난 내용을 정확히 보여주므로, 기록에 필요한 경우가 많습니다. 많은 팀은 텍스트를 위해 PDF도 함께 보관합니다. 기록을 받는 쪽의 요구 사항을 확인합니다.

전체 페이지 스크린샷은 얼마나 길어야 문제가 됩니까?

정해진 한계는 없지만 가독성이 가장 먼저 떨어집니다. 노트북 화면에 맞게 축소한 12,000픽셀 이미지는 본문 글자를 읽기 어려운 크기로 줄어들며, 일부 업로드 양식은 매우 큰 파일을 거부합니다. 그보다 훨씬 긴 페이지는 이미지를 나누거나 뷰포트 시퀀스를 사용합니다.

Website Capture는 로그인 뒤의 페이지를 캡처합니까?

아니요. 각 URL을 브라우저 쿠키 없이 비공개 세션에서 불러옵니다. 로그인 뒤의 페이지는 로그아웃한 방문자가 보는 상태로 캡처됩니다. 로그인된 브라우저 창에서는 Auto Capture를 사용합니다.

스크린샷 PDF의 OCR 텍스트는 브라우저 PDF만큼 정확합니까?

아니요. 브라우저 PDF는 원본 텍스트를 저장하지만, OCR은 픽셀에서 텍스트를 읽으므로 작은 글자, 특이한 글꼴, 수식을 잘못 읽을 수 있습니다. 창 크기를 키워 캡처한 PNG 프레임이 OCR에 가장 좋은 입력을 제공합니다.

저장이 허용된 페이지 작업

Temposhot은 페이지를 스크린샷으로 캡처하고, 이를 Mac에서 검색 가능한 PDF로 내보냅니다. Mac에서 스크린샷을 PDF로 저장 문서를 참고하거나, 스크린샷 PDF와 브라우저의 PDF로 저장 비교 글에서 두 방법을 비교합니다.