더 빠른 웹사이트를 위해 이미지 준비하기
사진과 페이지 그림을, 레이아웃이 실제로 쓰는 너비의 WebP로 만듭니다. 첫 화면이 무겁고 이미지가 아직 카메라 전체 해상도일 때 쓰는 보통 절차입니다.
- 빠름
- 100% 비공개
- 항상 무료
- 어떤 브라우저든
이 페이지 어디에든 이미지를 놓을 수 있습니다
JPG, PNG, WebP, GIF, SVG, HEIC, AVIF. 사진은 이 기기에 남습니다.
이럴 때 씁니다
여기서 기본값은 WebP입니다. 사진에서는 보통 JPG보다 작고, 화면 부품의 투명을 남길 수 있습니다. 지금 브라우저는 모두 WebP를 보여 줍니다.
CMS, 메일 소식지, 거래처가 아직 WebP를 받지 않으면 JPG로 둡니다. 그린 그대로 남아야 하는 로고는 PNG로 둡니다.
페이지 속도가 목적이면, 너비를 줄이는 일은 형식만큼 중요합니다. 4000px WebP도 용량은 아직 큽니다.
JSON을 정리하거나, 토큰을 공개 사이트에 붙이지 않고 확인하고 싶으면 ToolBuddy을 씁니다. 그 도구도 브라우저에 남습니다.
하는 방법
- 페이지에 올릴 이미지를 놓습니다.
- 색 띠가 보이지 않는 한, 받을 때 WebP로 두고 품질은 0.8 안팎으로 합니다.
- 최대 너비는 1600 안팎으로 합니다. Retina 화면에서 1200 CSS 픽셀로 보이는 이미지는 2400으로 합니다.
- WebP를 받고, 테마나 CDN에 있는 원본 파일과 바꿉니다.
팁
- 상단의 큰 사진에는 WebP 한 장을 씁니다. 그 사진을 찍은 PNG 스크린샷은 쓰지 않습니다.
- 상품 목록에서는 너비를 맞추면 캐시와 레이아웃이 안정됩니다.
- 상대가 미리보기를 열지 못하면 사본을 JPG로 만듭니다. 사이트에는 WebP를 남깁니다.
관련
질문
아직 JPG 대체본이 필요한가요?
2026년의 공개 사이트에서는 거의 필요 없습니다. 시험할 수 없는 아주 오래된 앱 안 브라우저를 맞춰야 하면 JPG를 남깁니다.
WebP가 WordPress 미디어 라이브러리를 깨뜨리나요?
지금 WordPress는 WebP를 받습니다. 오래된 플러그인이 그 파일을 거절하면, 그 한 장만 JPG로 되돌립니다.
이 사이트의 CDN에서 처리되나요?
되지 않습니다. 변환은 이 브라우저 안에서 됩니다. 파일을 보지 않습니다.