야동위키 블로그

이번 글의 핵심 결론은 무엇인가요?

전체 맞춤은 원본을 모두 보여 주는 대신 틀에 여백을 남길 수 있습니다. 채우기는 틀 안을 채우지만 원본과 틀의 비율이 다르면 일부가 가려집니다. 같은 파일을 써도 보이는 정보량이 달라지므로, 썸네일이나 화면 크기만으로 원본에 무엇이 들어 있는지 판단하기 어렵습니다.

• 비교 대상: 이 글을 위해 제작한 1280 × 720 WebP 그림 1장입니다.
• 바꾼 조건: 정사각형 전체 맞춤, 정사각형 채우기, 세로형 채우기의 세 경우입니다.
• 확인하지 않은 것: 외부 영상의 화질, 디코딩 성능, 스트리밍 속도와 실제 플레이어의 기능입니다.

증상 확인과 수치 검증은 어디서 시작하나요?

증상은 세 그림 비교에서, 수치 검증은 결과표와 JSON에서 시작하면 됩니다. 당장 화면이 잘리는 이유가 궁금하면 글의 세 그림 비교를 먼저 보세요. 양옆 표식이 나타나거나 사라지는 모습으로 차이를 볼 수 있습니다. 숫자를 확인하려면 결과표에서 각 틀에 남는 원본 영역을 비교할 수 있습니다.

직접 다시 계산하려는 독자를 위해 원본 그림과 배율·잘림 범위를 적은 JSON도 공개했습니다. 글에 적힌 백분율은 보이는 면적의 비율이며 파일 용량이나 화질 점수가 아닙니다. 자료의 구분 방식은 편집 기준에 설명했습니다.

세 조건은 어떤 차이를 보여 주나요?

같은 파일에서도 표시 틀과 맞춤 방식에 따라 포함되는 원본 영역이 달라집니다. 정사각형 전체 맞춤은 장면을 모두 남기고, 채우기는 틀을 비우지 않는 대신 가장자리를 가립니다. 두 결과를 “화면이 더 크다”는 한 기준으로 평가하면 차이를 놓치게 됩니다.

1. A: 전체 맞춤. 1280×720 그림을 320×320에 넣으면 표시된 그림은 320×180입니다. 위아래에 70픽셀씩 여백이 남지만 L·C·R은 모두 보입니다.
2. B: 정사각형 채우기. 같은 틀을 채우면 원본의 중앙 720×720만 보입니다. 원본에서 좌우 280픽셀씩이 가려집니다.
3. C: 세로형 채우기. 180×320 틀에는 원본의 중앙 405×720만 남습니다. 보이는 면적은 약 31.64%입니다.

이 계산은 가득 채우기와 전체 맞춤을 정의한 MDN object-fit 문서에 표본 크기를 대입한 것입니다. 모든 영상 서비스에서 같은 메뉴와 배치를 사용한다는 조사 결과는 아닙니다.

이 글에는 어떤 직접 확인 자료가 있나요?

자체 제작 원본 1장, 표시 조건 3개, 두 창 크기의 브라우저 확인값을 공개했습니다. 다른 작품의 줄거리나 사진을 요약한 글이 아니라, 같은 표본이 어떻게 달리 보이는지 비교한 기록입니다.

• 원본 그림에서 세 표식이 실제로 들어 있는지 확인할 수 있습니다.
• 계산 기록에서 해시·크기·배율과 가시 영역을 대조할 수 있습니다.
• 조건 설명에는 1366×900과 390×844 창에서 확인한 범위가 적혀 있습니다.

두 창 크기를 확인한 사실을 두 종류의 실제 기기에서 시험한 것으로 표현하지 않았습니다. 정지 이미지를 썼으므로 동영상 디코딩, 음성, 네트워크 지연이나 자막 트랙의 성능도 이 기록에 포함하지 않습니다.

특히 56.25%는 보이는 원본 면적입니다. 파일 크기가 그 비율로 줄었다거나 화질이 그 점수라는 뜻이 아닙니다. 결과를 다시 사용할 때는 이 대상과 조건을 함께 적어야 의미가 유지됩니다.