WebP 변환 — 투명 배경이 흰색으로 바뀌는 이유

이미지를 하나 받았는데 확장자가 .webp입니다. 더블클릭해도 기본 뷰어가 안 열리고, 문서에 붙이려니 받아 주지 않습니다. 요즘 웹사이트에서 이미지를 저장하면 흔히 겪는 일입니다.

WebP를 JPG로 변환하기 → · WebP를 PNG로 변환하기 →

두 도구 모두 이미지를 서버로 올리지 않습니다. 브라우저 안에서 변환하고 바로 내려받는 구조라, 개인 사진이나 회사 자료를 넣어도 밖으로 나가지 않습니다.

왜 자꾸 webp로 받게 되나

WebP는 구글이 만든 이미지 형식입니다. 사이트가 빨리 열리게 하려고 쓰는데, 실제로 얼마나 작은지 같은 그림을 세 형식으로 저장해 재 봤습니다.

같은 그림인데 PNG의 40% 정도 용량으로 끝납니다. 사이트 입장에선 안 쓸 이유가 없습니다. 이미지가 페이지 속도에 얼마나 영향을 주는지는 웹사이트 이미지 최적화 글에 정리해 두었습니다.

문제는 받는 쪽입니다. 브라우저는 webp를 잘 열지만, 오래된 이미지 뷰어·문서 편집기·일부 업로드 폼은 아직 안 받아 줍니다. 그래서 변환이 필요해집니다.

투명한 부분이 흰색이 됩니다

가장 많이 당하는 함정입니다. WebP를 JPG로 바꾸면 투명했던 영역이 흰색으로 채워집니다.

JPG 형식에는 투명이라는 개념 자체가 없어서 생기는 일입니다. 그래서 변환 도구는 빈 화면을 먼저 흰색으로 칠하고 그 위에 그림을 얹습니다. 실제로 투명 배경의 WebP를 JPG로 바꿔 모서리 픽셀을 들여다보니 이렇게 바뀌었습니다.

로고나 아이콘처럼 배경이 비어 있어야 하는 이미지라면 JPG로 바꾸는 순간 흰 네모가 생깁니다. 어두운 배경 위에 얹을 계획이었다면 그 자리만 하얗게 떠 보이게 됩니다.

투명을 지켜야 하면 PNG로 가야 합니다. PNG는 투명을 그대로 담기 때문에 변환 후에도 배경이 비어 있습니다.

어느 형식으로 갈지 고르는 기준

남에게 파일을 넘겨야 하는 상황이라면 한 가지를 더 생각하는 편이 좋습니다. 국내에서 쓰는 문서 편집기나 오래된 업로드 폼 중에는 JPG·PNG만 받는 곳이 아직 있습니다. 받는 쪽 환경을 모를 때는 webp 그대로 보내는 것보다 변환해 보내는 편이 안전합니다. 반대로 내가 보관만 할 이미지라면 굳이 바꿀 이유가 없습니다.

JPG 변환은 품질 90으로 저장됩니다. 화면으로 보기에는 원본과 구분이 어려운 수준이고, 이 단계에서 용량이 조금 늘어날 수 있습니다 — 위 표에서 본 7KB → 10KB가 그 예입니다. WebP가 원래 더 효율적인 형식이라 생기는 정상적인 증가이지 변환이 잘못된 것이 아닙니다.

반대 방향 — 내 사이트를 빠르게 하려면

내가 사이트를 운영하는 쪽이라면 방향이 반대가 됩니다. 가지고 있는 JPG·PNG를 WebP로 바꿔 올리면 페이지가 가벼워집니다.

• JPG를 WebP로 →
• PNG를 WebP로 →

다만 방문자 환경을 한 번은 생각해야 합니다. 요즘 브라우저는 대부분 webp를 표시하지만, 사내 시스템이나 아주 오래된 환경에서 열린다면 기존 형식을 함께 두는 편이 안전합니다. 용량을 더 줄여야 한다면 형식을 바꾸는 것보다 이미지 압축이나 크기 변경이 효과가 더 큰 경우도 많습니다.

변환 없이 그냥 보고 싶을 때

당장 내용만 확인하면 되는 경우도 많습니다. 그때는 변환할 필요가 없습니다.

• 브라우저로 열기 — webp 파일을 크롬·엣지·사파리 창에 끌어다 놓으면 그대로 보입니다. 브라우저는 webp를 기본으로 지원합니다.
• 윈도우 사진 앱 — 최근 버전은 webp를 엽니다. 안 열리면 파일을 우클릭해 "연결 프로그램"에서 브라우저를 고르면 됩니다.

반대로 절대 하지 말아야 할 것이 하나 있습니다. 확장자만 .jpg로 바꾸는 일입니다. 이름이 바뀔 뿐 파일 속 내용은 여전히 webp라, 열리기는커녕 "손상된 파일" 소리를 듣게 됩니다. 형식을 바꾸려면 내용을 다시 저장해야 하고, 그게 변환 도구가 하는 일입니다.

변환이 안 될 때 확인할 것

• 파일이 진짜 webp인가 — 확장자만 바꿔 둔 파일은 열리지 않습니다. 도구가 webp 형식만 받도록 되어 있어서, 이름이 .webp여도 내용이 다르면 거부됩니다.
• 파일이 너무 크지 않은가 — 서버가 정한 업로드 한도를 넘으면 안내 메시지가 뜹니다. 그때는 먼저 압축한 뒤 변환하는 순서가 빠릅니다.
• 애니메이션 webp인가 — 움직이는 webp를 넣으면 첫 장면 한 컷만 남습니다. 변환이 화면에 한 번 그려서 다시 저장하는 방식이라 프레임을 따로 다루지 않기 때문입니다(네 가지 변환 도구 모두 같습니다). 움직임을 살려야 한다면 이 도구로는 되지 않습니다.

자주 묻는 질문

변환하면 화질이 떨어지나요?
JPG로 갈 때는 품질 90으로 다시 저장되므로 이론상 손실이 있습니다. 화면에서 구분하기는 어려운 수준이지만, 변환을 여러 번 반복하면 조금씩 누적됩니다. 원본은 지우지 않는 편이 좋습니다. PNG로 갈 때는 픽셀이 그대로 보존됩니다.

올린 이미지가 서버에 저장되나요?
저장되지 않습니다. 변환은 브라우저 안에서 일어나고, 결과 파일도 내 컴퓨터로 바로 내려옵니다.

여러 장을 한 번에 바꿀 수 있나요?
한 번에 한 장씩 처리하는 구조입니다. 장수가 많다면 브라우저 탭을 여러 개 띄워 두고 번갈아 쓰는 편이 빠릅니다.

투명을 살리려면 결국 뭘 골라야 하나요?
PNG입니다. 배경이 비어 있어야 하는 이미지는 JPG 쪽으로 보내지 마세요 — 한 번 흰색으로 채워지면 되돌릴 수 없습니다.