이미지 및 사진 · 이미지 변환기 및 압축기
PNG을 JPEG로 변환하면 투명성은 어떻게 되나요?
· 작동 방식
이미지 형식 투명성 캔버스
JPEG에는 알파 채널이 없으므로 투명한 픽셀은 변환 중에 무언가가 되어야 하며 브라우저의 규칙은 이를 검은색으로 합성하는 것입니다. 이 게시물에서는 합성 단계인 알파와 WebP 또는 PNG를 선택하여 투명성을 유지하는 방법에 대해 설명합니다.
검은색 사각형으로 변한 제품 컷아웃 - 처음에 거의 모든 사람을 놀라게 한 변환 결과
제품 컷아웃은 실선 직사각형으로 둘러싸인 JPEG 변환에서 반환될 수 있습니다. 이 도구에서는 직사각형이 검은색으로 강제되지 않습니다. 계획은 배경색을 전달하고 초점이 맞춰진 패널은 흰색에서 시작하며 `renderPlan`은 비트맵을 그리기 전에 전체 캔버스를 채웁니다. 따라서 출력에는 문서화되지 않은 브라우저 대체가 아닌 가시적인 사용자 선택이 반영됩니다.
소스 사본을 사용하여 문제를 재현하고 선택한 매트를 기록해 둡니다. 흰색을 선택한 후 검은색 블록이 나타나면 변환을 비난하기 전에 실제 다운로드한 파일을 이후 처리 단계와 비교하세요. ToolAcre의 경고에는 투명 픽셀 뒤에 배치된 색상이 포함되어 있어 JPEG 인코더가 캔버스를 수신하기 전에 계획을 감사할 수 있습니다.
놀랍도록 견고한 직사각형은 선택한 매트일 수 있습니다. ToolAcre의 기본값은 검정색이 아닌 흰색입니다.
투명도는 디코딩된 픽셀 표면에서 색상과 함께 불투명도로 표시됩니다. 제품의 형식 표에는 PNG 및 WebP 출력이 알파를 지원하지만 JPEG는 지원하지 않는 것으로 기록되어 있습니다. 이는 인코딩 기능 설명입니다. 입력 디코더도 GIF를 허용하지만 GIF는 디코딩 전용이며 스틸 프레임을 하나만 제공합니다. 읽기 지원 및 쓰기 지원을 하나의 목록으로 축소하면 안 됩니다.
알파 값을 사용하면 내보낸 후 동일한 전경이 다른 페이지 배경과 혼합될 수 있습니다. 픽셀이 매트 위에 병합되면 저장된 JPEG에 일반 불투명 색상이 포함되어 있기 때문에 유연성이 사라집니다. JPEG을 다시 PNG로 변환하면 알파 지원 컨테이너가 생성되지만 어떤 픽셀이 이전에 투명했는지 추론하거나 선택한 배경과 분리할 수 없습니다.
JPEG이 투명성을 보유할 수 없는 이유 — '여기에는 아무것도 없음'이라는 개념이 없는 사진용으로 설계된 형식입니다.
JPEG 출력에는 ToolAcre의 형식 팩트에 알파 채널이 없으므로 전체 출력에는 모든 픽셀에 색상이 필요합니다. 변환 계획은 해당 색상을 제공하고 렌더러는 소스 픽셀이 그려지기 전에 대상 전체에 색상을 칠합니다. 이 순서는 완전히 투명한 영역이 무광택이 되고 부분적으로 투명한 경계가 일반 캔버스 구성을 통해 혼합되도록 보장합니다.
JPEG이 나타날 위치를 기준으로 매트를 선택합니다. 흰색 카탈로그 페이지는 흰색을 선호합니다. 어두운 슬라이드는 실제 어두운 배경을 선호합니다. 대상 배경이 변경될 수 있는 경우 결정이 너무 일찍 이루어지기 때문에 JPEG은 잘못된 결과물입니다. PNG 또는 WebP은 이후 레이아웃에서 알파 채널을 사용할 수 있도록 유지합니다.
합성 규칙 브라우저는 다음을 따릅니다. 사양에 따라 투명한 영역은 JPEG 인코딩 전에 단색 검정색 배경에 혼합됩니다.
통합 문서에서는 검정색 합성을 브라우저 사양 규칙으로 설명했지만 구현에서는 우발적인 브라우저 종속 채우기를 명시적으로 방지합니다. `fillRect`은 `plan.background`을 사용하며 패널은 선택한 형식에 알파가 없는 경우에만 색상 입력을 노출합니다. 수정이 중요합니다. 사용자에게 검정색이 불가피하다고 알리면 그러한 놀라움을 피하기 위해 특별히 만들어진 컨트롤이 숨겨집니다.
매트 필드는 장식용 메타데이터가 아닙니다. JPEG로 전송된 픽셀 색상을 변경하며 형식 및 품질과 함께 재현 가능한 변환 기록에 포함되어야 합니다. 출력만 스크린샷으로 표시하면 고의적인 어두운 매트가 손상된 것처럼 보일 수 있습니다. 계획을 캡처하면 직사각형이 선택한 배경에서 나온 것인지 나중에 보는 사람에게서 나온 것인지 설명됩니다.
ToolAcre는 JPEG 인코딩 전에 사용자가 선택한 배경으로 투명도를 채웁니다.
부드러운 앤티앨리어싱 가장자리에는 단순한 켜기/끄기 마스크가 아닌 부분적으로 투명한 픽셀이 포함되어 있습니다. 최종 색상은 구성하는 동안 아래에 있는 매트에 따라 달라집니다. 개체를 흰색에 대해 먼저 편평하게 만들면 어두운 대상에 옅은 줄무늬가 나타날 수 있습니다. 나중에 페이지를 변경하면 불투명 JPEG에서 혼합 경계 픽셀을 다시 계산할 수 없습니다.
ToolAcre는 미리 곱셈된 알파 버퍼를 노출하지 않거나 특정 저수준 디코더 표현을 약속하지 않으므로 증거 기반 검사는 시각적입니다. 두 개의 매우 다른 매트에 대해 동일한 로고를 내보내고 해당 윤곽선을 기본 크기와 비교합니다. 자산이 두 백그라운드 모두에서 작동해야 하는 경우 하나의 타협 JPEG 에지를 검색하는 대신 알파를 유지하세요.
부드러운 가장자리 결과는 선택한 매트에 대해 검사해야 합니다. 사전 곱셈 내부는 노출되지 않습니다
부드러운 그림자가 있는 투명한 로고를 사용하세요. 먼저 흰색을 선택하고 JPEG을 내보냅니다. 그런 다음 짙은 녹색을 선택하고 다른 JPEG을 내보냅니다. 투명한 필드는 선택한 각 색상이 되어야 하며, 그림자는 그 색상과 혼합됩니다. 크기가 변경되지 않은 PNG 및 WebP 복사본도 내보낸 다음 이미지 인식 뷰어의 밝은 테스트 블록과 어두운 테스트 블록 위에 모두 배치합니다.
PNG 경로는 무손실 인코더를 사용하고 투명성을 유지합니다. WebP 경로는 투명성을 유지하지만 100 품질에서도 애플리케이션의 형식 데이터에 따라 손실이 남아 있습니다. JPEG 복사본은 반드시 불투명해야 합니다. 브라우저가 실제 인코딩된 바이트를 측정하고 콘텐츠가 결과를 결정하기 때문에 고정된 파일 크기 순위가 주장되지 않습니다.
여기서 다루지 않는 내용 — 사용자 정의 배경색, 애니메이션 투명도 및 1비트 GIF 스타일 마스크 선택
이 워크플로에는 사용자 정의 배경 색상이 포함되어 있습니다. 원래 개요에서는 이를 잘못 제외했습니다. GIF 애니메이션을 보존하지 않고, GIF 출력을 제공하거나, 특수한 1비트 마스크 편집기를 제공하지 않습니다. GIF 입력은 하나의 스틸 프레임으로 디코딩되며 다른 허용된 입력과 동일한 대상 형식 규칙을 받습니다.
또한 불투명 소스에서 기존 색상 배경을 제거하지 않습니다. 알파 보존은 투명도가 디코더에 도달할 때만 도움이 됩니다. 소스에 이미 흰색 직사각형이 포함된 경우 PNG로 내보내면 누락된 투명도를 다시 생성할 수 없습니다. 해당 작업에는 형식 변환이 아닌 편집기에서 의도적인 배경 제거가 필요합니다.
사용자 정의 배경색이 구현되었으며 범위에 속합니다.
투명성은 그것을 표현할 수 있는 목적지에서만 살아남습니다. ToolAcre는 대안을 명시적으로 만듭니다. JPEG은 선택한 매트를 가져오고 PNG 및 WebP는 문서화된 인코더 동작에 따라 알파를 유지합니다. 되돌릴 수 있는 디스플레이 기본 설정이 아닌 단방향 픽셀 결정을 설명하므로 변환하기 전에 경고를 읽어보세요.
원본 투명 자산을 마스터로 유지합니다. 최종 배경이 알려진 후에만 JPEG 사본을 생성하고 해당 색상의 부드러운 가장자리를 검사하십시오. 이는 유연한 소스를 유지하면서 수신자에게 열 수 있는 불투명 파일을 제공하며, 나중에 변환할 때 의도적으로 병합된 알파를 복구할 수 있는 척하지 않습니다.