웹에 쓰도록 PDF 페이지를 WebP로 변환

PDF WebP 변환 사용 방법

1. PDF 추가하기Chrome, Edge, Firefox에서 이 페이지를 연 다음 PDF를 도구 위에 끌어다 놓거나 찾아서 고르세요. 문서의 페이지마다 썸네일이 나타납니다.
2. 페이지, DPI, 화질 정하기모든 페이지를 선택한 그대로 두거나, 썸네일을 클릭하거나 4-6, 9처럼 입력해 범위를 좁히세요. 웹용이라면 150 DPI에 화질 ‘높음’으로 시작하는 것이 무난합니다.
3. WebP 이미지 저장하기‘이미지로 변환’을 누른 뒤 결과를 저장하세요. 한 페이지는 .webp 파일 하나로, 여러 페이지는 ZIP 파일 하나로 받으며, 압축을 풀어 사이트의 이미지 폴더에 넣으면 됩니다.

예시로 살펴보기

2페이지짜리 A4 메뉴판 메뉴판.pdf를 식당 웹사이트에 올리려고 합니다. Chrome에서 해상도는 150 DPI, 화질은 높음(92) 그대로 두고 변환합니다. 그러면 메뉴판-p1.webp와 메뉴판-p2.webp가 나옵니다. 둘 다 가로 1,240픽셀, 세로 1,753픽셀(210 mm ÷ 25.4 × 150 ≈ 1,240.2, 297 mm ÷ 25.4 × 150 ≈ 1,753.9, 소수점 이하 버림)이며, 메뉴판-2-files.zip으로 묶입니다.

폭 640픽셀인 단에 넣으면 1,240픽셀 이미지는 CSS 픽셀 하나당 이미지 픽셀을 약 2개(1,240 ÷ 640 ≈ 1.94) 공급하므로, 고밀도 화면에서도 선명해 보입니다. 작은 미리 보기용이라면 72 DPI에서 595 × 841이 됩니다.

할 수 있는 일과 한계

• WebP를 만들려면 Chrome, Edge, Firefox가 필요합니다. Safari에서는 오류가 나며 멈추므로, Safari에서는 PDF JPG 변환을 사용하세요.
• 출력은 항상 손실 WebP입니다(높음 = 92, 보통 = 80). 페이지를 픽셀 그대로 정확히 옮기려면 PDF PNG 변환을 사용하세요.
• 투명한 부분은 흰색이 되며, 방문자는 이미지에 보이는 글자를 선택하거나 복사할 수 없습니다.
• 한 번에 PDF 1개만 변환합니다. 한 변이 8,000픽셀을 넘거나 전체가 1,600만 픽셀을 넘는 페이지는 축소됩니다.

PDF WebP 변환 소개

WebP는 웹을 위해 설계된 이미지 형식입니다. 손실 압축을 쓰면 보통 비슷한 화질의 JPG보다 적은 바이트로 페이지 이미지를 저장할 수 있어서, 방문자에게는 페이지가 더 빨리 뜨고 모바일 데이터도 덜 듭니다. 현재 주요 브라우저는 모두 WebP를 표시할 수 있습니다.

이 변환기는 Mozilla의 오픈 소스 PDF 렌더러인 pdf.js로 PDF에서 선택한 페이지를 렌더링한 다음, 그 결과를 WebP로 인코딩하는 일을 브라우저에 맡깁니다. 해상도(72, 150, 300 DPI)와 화질을 고를 수 있는데, 기본값은 높음(92)이고 보통(80)은 세부가 조금 부드러워지는 대신 파일을 더 줄입니다. 결과 파일 이름은 카탈로그-p1.webp 같은 형태이며, 여러 페이지는 ZIP 하나로 받습니다.

브라우저 지원: Safari는 WebP를 만들 수 없습니다

WebP 인코딩은 브라우저가 제공하는 기능인데 Safari에는 이 기능이 없어서, Safari에서는 도구가 오류 메시지를 표시합니다. 컴퓨터에서 Chrome, Edge, Firefox를 쓰거나, 지원하는 모든 브라우저에서 작동하는 PDF JPG 변환으로 바꾸세요. 아이폰과 아이패드에서는 다른 브라우저도 대개 Apple의 WebKit 엔진으로 작동하므로 같은 제약이 있다고 보면 됩니다. Safari에서 WebP 파일을 열어 보는 데는 문제가 없고, 만드는 기능만 빠져 있습니다.

이럴 때 사용합니다

• 다운로드 페이지의 미리 보기

  PDF 설명서, 메뉴판, 사양서를 내려받게 한다면, 첫 한두 페이지를 WebP로 보여 주어 방문자가 다운로드 전에 내용을 확인하게 할 수 있습니다. 썸네일에는 72 DPI, 읽을 수 있는 미리 보기에는 150 DPI면 충분합니다.

• 블로그 글이나 문서 사이트의 삽화

  글에서 PDF의 그림이나 양식을 인용할 때 WebP를 쓰면 페이지 전체 용량을 줄일 수 있습니다. 한 글에 페이지 이미지가 여러 장 들어갈수록 그 차이가 쌓입니다.

• 앱이나 사내 시스템의 가벼운 이미지

  대시보드, 지식 베이스, 모바일 앱에 보고서 페이지를 보여 주는 팀은 PNG 사본 대신 WebP 버전을 보관해 대역폭과 저장 공간을 아낄 수 있습니다.

웹페이지용 해상도 고르기

온라인에서 중요한 것은 이미지가 화면에 얼마나 넓게 표시되느냐입니다. A4 페이지를 72 DPI로 렌더링하면 폭이 595픽셀, 150 DPI에서는 1,240픽셀, 300 DPI에서는 2,480픽셀입니다.

• 72 DPI는 읽는 사람이 어떤 페이지인지 알아보기만 하면 되는 썸네일, 카드, 작은 미리 보기에 알맞습니다.
• 기본값인 150 DPI는 A4 페이지를 기사 본문 단에 흔한 폭인 약 640 CSS 픽셀로 표시할 때, 고밀도 휴대폰이나 노트북 화면에서 선명하게 보일 만큼의 픽셀을 줍니다.
• 300 DPI는 웹에서는 거의 필요 없습니다. 픽셀 수가 150 DPI의 네 배이므로, 빽빽한 차트처럼 방문자가 작은 글씨를 확대해서 봐야 하는 페이지에만 쓰세요.

용량, 화질, 투명도

이 도구의 WebP 출력은 손실 압축이므로 JPG와 거의 비슷하게 작동합니다. 파일은 작아지고, 화질 ‘높음’에서는 날카로운 가장자리가 아주 살짝, ‘보통’에서는 조금 더 부드러워집니다. 글자가 많은 페이지도 150 DPI, 화질 ‘높음’이면 또렷하게 읽힙니다. WebP의 효과를 가장 크게 보는 것은 사진이 든 페이지이고, 글자만 있는 페이지는 어떤 형식이든 이미 가볍습니다.

각 페이지는 흰 바탕 위에 렌더링되므로 PDF의 투명한 영역은 이미지에서 흰색이 됩니다. 제목, 작성자 같은 문서 메타데이터는 옮겨지지 않습니다. 이미지 속 글자는 방문자가 선택하거나 복사할 수 없으니, 중요한 문구는 주변 HTML이나 이미지의 대체 텍스트에도 함께 넣으세요.

벽걸이 차트처럼 유난히 큰 페이지는 브라우저 캔버스의 한도인 한 변 약 8,000픽셀을 넘지 않도록 자동으로 축소됩니다.

대체 이미지와 함께 WebP 제공하기

현재 쓰이는 브라우저는 모두 WebP를 표시할 수 있습니다. 방문자 중에 아주 오래된 브라우저나 이메일 프로그램을 쓰는 사람이 있다면 HTML의 picture 요소로 JPG 대안을 함께 제공하세요. WebP를 JPG, PNG, AVIF와 더 자세히 비교한 자료로는 MDN의 이미지 파일 형식 안내가 있습니다.

WebP가 맞지 않는 경우

• 첨부 파일과 업로드 양식. 일부 이메일 프로그램, 사무용 소프트웨어, 공공 기관 사이트는 아직 JPG나 PNG를 요구합니다. 이런 곳에는 JPG를 보내세요.
• 인쇄. 프린터와 편집 디자인 프로그램은 무손실 파일을 더 잘 다룹니다. 이럴 때는 PDF PNG 변환에서 300 DPI로 렌더링하세요.
• 더 작은 PDF. 문서는 그대로 두고 가볍게만 만들려면 PDF 용량 줄이기를 쓰세요. 검색 가능한 텍스트가 유지됩니다.
• 몇 페이지를 PDF로 공개. 방문자가 이미지를 보는 대신 한 챕터를 내려받게 하려면 PDF 분할로 잘라 내세요.
• 암호화된 파일. 비밀번호를 묻는 PDF는 먼저 PDF 비밀번호 해제를 거쳐야 하며, 그 비밀번호를 알고 있어야 합니다.

받은 WebP 이미지를 더 널리 쓰이는 형식으로 바꿔야 한다면 WebP JPG 변환을 사용하세요.

처리는 기기 안에서만

문서를 보는 서버는 없습니다. PDF를 여는 일, 페이지를 그리는 일, WebP로 인코딩하는 일 모두 내 브라우저가 맡고, 결과는 기기에 저장됩니다. 파일 데이터가 탭 밖으로 나가지 않는다는 것을 직접 확인하려면 확인 절차를 따라 하세요.