JPG 똔느 PNG 이미지를 WebP 포맷으로 변환, 저장하는 방법에 대해 알아보겠습니다.
JPG 또는 PNG 이미지를 WEBP 변환, 저장하는 방법
위 방법에 대해 알아보기 앞서 WebP 포맷이 무엇인지? 알아보겠습니다.
WebP 포맷이란?
웹 이미지를 더 빠르게 로딩하기 위해 구글이 개발한 이미지 포맷으로, 기존의 JPG, PNG 포맷 보다 더 작은 파일 크기로 비슷한 이미지 품질을 제공할 수 있어 웹 페이지 로딩 속도 향상에 효과적이라고 합니다.
요하네스 시폴라(Johannes Siipola)라는 개발자는 "Is WebP really better than JPEG?" 라는 글을 통해 WebP 포맷과 다른 포맷들을 직접 비교한 내용을 공개했습니다.
위 내용에 따르면 500px 의 작은 크기의 이미지일 경우 WebP가 JPG 보다 나은 결과를 보여주지만, 1000px 이상 큰 이미지의 경우 WebP의 장점은 사라집니다.
블로그에 올리는 사진들의 크기를 생각해보면 WebP 사용에 대한 장점을 있는 것 같습니다.
핵심 특징
- Losseless (비손실) 압축: 이미지 데이터 손실 없이 압축하여 원본 품질을 유지할 수 있고, PNG 보다 파일 크기 26% 정도 감소함
- Lossy (손실) 압축: JPEG 보다 25%~35% 정도 더 작은 파일 크기로 비슷한 품질 제공하고, 이미지 복잡도에 따라 품질 저하 가능성 있음
- 알파 채널 지원: 투명도 정보 포함 가능하여 PNG 와 동일 기능 제공함
- 애니메이션 지원: GIF 와 유사하게 여러 이미지 프레임을 결합하여 간단한 애니메이션 표현 가능함
JPG, PNG와 비교
기능 | WebP | JPG | PNG |
압축 방식 | Lossless/Lossy | Lossy | Lossless |
파일 크기 (작은 이미지 경우) | 가장 작음 | 상대적으로 작음 | 가장 큼 |
품질 | 비슷 / 다소 낮음 | 다소 낮음 | 가장 높은 |
알파 채널 | 지원 | 지원하지 않음 | 지원 |
애니메이션 | 지원 | 지원하지 않음 | 지원하지 않음 |
장점
- 웹 페이지 로딩 속도 향상: 작은 파일 크기로 빠른 이미지 로딩 가능함
- 데이터 절약: 이미지 파일 크기 감소로 데이터 사용량 절감 효과
- 다양한 기능 지원: Losseless/Lossy 압축, 알파 채널, 애니메이션 기능으로 활용도 높음.
단점
- 모든 브라우저 지원하지 않음: 일부 구형 브라우저는 WebP 이미지 표시 어려움.
- 이미지 품질 감소 가능성: Lossy 압축 시 복잡한 이미지에서 품질 저하 발생할 수 있음.
웹 페이지 로딩 속도 향상과 데이터 절약을 위해 블로그 작성시 적극 활용하면 좋을 것 같습니다. 다만 위에서 JPG, PNG 와 비교했던 것처럼 이미지 복잡도와 필요한 품질에 따라 적절한 포맷을 선택하는 것이 좋을 것 같습니다.
JPG | WebP | |
이미지 | ||
사이즈 | 2268 * 2003 | 2268 * 2003 |
파일 크기 | 744KB (761,993 바이트) | 352KB (361,272 바이트) |
다음으로는 Python 을 이용하여 WebP 포맷으로 변환, 저장하는 방법에 대해 알아보겠습니다.
WebP 로 변환, 저장
Pillow library 설치
pip install Pillow
JPG 에서 WebP 로 변환, 저장
from PIL import Image
im = Image.open('hello.jpg').convert('RGB')
im.save('hello.webp', 'webp')
위와 같이 Python 을 이용하여 직접 변환할 수도 있지만, 웹으로 제공되는 방법들을 이용해도 좋을 것 같습니다.
https://www.geeksforgeeks.org/jpg-to-webp-converter/
PNG 에서 WebP 로 변환, 저장
from PIL import Image
im = Image.open('hello.png').convert('RGB')
im.save('hello.webp', 'webp')
PNG 에서 WebP 로 변환, 저장하는 것 역시 GeeksforGeeks 에서 제공하고 있습니다.
https://www.geeksforgeeks.org/png-to-webp-converter/?ref=lbp
오늘은 WebP 가 무엇인지, 그리고 어떻게 변환할 수 있는지에 대해 알아보았습니다. 블로그에 이미지 업로드할 때 포맷의 특성을 잘 이해하셔서 적절한 이미지 포맷을 사용하시면 될 것 같습니다.
'개발' 카테고리의 다른 글
[논문 리뷰][Architecture] Foundations for the Study of Software Architecture (46) | 2024.03.12 |
---|---|
[Architecture] Architectural Style 이란? (2) | 2024.03.11 |
[Pandas] Dataframe 중복 데이터 찾기, 제거하기 (0) | 2023.10.26 |
[Pandas] 아파트 매매 실거래가 (0) | 2023.10.20 |
[Pandas] 법정동코드 조회하기 (0) | 2023.10.14 |