01 · 원본 한 장으로 시작
고해상도 이미지를 선택하고 페이지 레이아웃에 맞는 너비와 형식을 지정하세요. 원본 파일은 변경하지 않습니다.
게시용 이미지 / 01
웹사이트 이미지 에셋 생성기
원본 한 장에서 화면별 크기를 준비하세요. 웹사이트에 사용할 이미지 세트와 반응형 HTML을 함께 내보냅니다.
이미지 하나를 웹 게시용으로
게시용 이미지 패키지
320px640px1280px
원본 하나로 모든 화면에 대응하세요.
실제 파일 크기를 비교하고 이미지와 반응형 HTML을 함께 받으세요.
생성 후 실제 크기를 표시합니다. 추정값이나 미리 채운 결과가 아닙니다.
이미지 한 장에서 완성된 이미지 세트로
02 · 실제 출력 비교
파일을 생성한 후 행을 선택해 미리 보고 각 너비의 실제 파일 크기를 비교하세요.
03 · 전체 패키지 다운로드
대체 텍스트와 sizes 속성을 설정하고 이미지, HTML, 파일 목록을 ZIP 하나로 다운로드하세요.
게시 전 확인
크기 조절과 편집은 새 파일을 만듭니다. 원본과 필요한 저작자 표시를 보관하고 요구되는 AI 사용 사실을 공개하세요.
자주 묻는 질문
ZIP에는 무엇이 들어 있나요?
인코딩된 이미지, picture.html 코드, 크기와 바이트 수를 기록한 목록, 간단한 사용 설명이 포함됩니다. HTML 참조는 실제 출력 파일명과 일치합니다.
이미지를 확대하나요?
아니요. 요청한 너비는 원본 너비를 넘지 않습니다. 중복 너비를 합치고 비율을 유지하며 HTML에는 실제 출력 크기를 사용합니다.
모든 형식에서 투명 배경을 유지하나요?
WebP와 AVIF는 투명도를 유지합니다. JPG는 지원하지 않아 선택한 배경색을 씁니다. 투명도를 끄면 모든 형식에 해당 색을 합성합니다.
srcset과 sizes는 어떻게 사용하나요?
이미지를 HTML 옆에 두거나 URL을 이미지 디렉터리로 바꾸세요. 각 분기점의 실제 CSS 표시 너비에 sizes를 맞추면 브라우저가 목록에서 너비를 선택합니다. 첫 화면 주 이미지의 지연 로딩은 제거하세요.
무손실 출력이거나 메타데이터를 보존하는 사본인가요?
아니요. 크기를 변경하고 재인코딩하며 원본 메타데이터는 복사하지 않습니다. 압축으로 세부 표현이나 색상이 달라질 수 있습니다. 편집 이력, 출처, 저작권 기록을 위해 원본을 보관하세요. 재인코딩 없는 검증된 메타데이터 정리는 AI Metadata Checker를 사용하세요.