웹 이미지 사이즈, 비례, 해상도

2007-06-21 작성 2024-04-10 수정

웹 상에서 많이 쓰이는 이미지의 사이즈, 해상도 혹은 가로, 세로 비례를 소개합니다. 단위는 픽셀 (pixel, px) 입니다.
최근 웹 이미지 제작 시 많이 사용하게 되는 가로 사이즈는 최대 확장 시 1920 px, 고정폭 최대 시 1280 px, 모바일 대응 시 768 px 입니다. 스크롤을 고려하면 세로 사이즈에는 제한이 없으나 보통 아래와 같은 비례로 제작합니다.

아래의 글은 주로 홈페이지의 이미지 사이즈에 대한 것입니다.
홈페이지 제작 시 화면 사이즈에 대한 자세한 설명은 홈페이지, 웹사이트 디자인 사이즈 글을 참고하세요.

컴퓨터 모니터

가로 세로 16 : 9 비율. 프레젠테이션 슬라이드, 컴퓨터 모니터, 와이드 스크린 TV.
889 x 500, 1280 x 720, 1920 x 1080.

889 x 500

SNS 프로필

가로 세로 1 : 1 비율. 8 x 8 인치
500 x 500, 1080 x 1080

500 x 500

황금비율

가로 세로 1 : 1.618 비율.
840 x 500, 1680 x 1000

840 x 500

구형 모니터

가로 세로 4 : 3 비율. 구형 TV, 구형 모니터, 디지털카메라. 8 x 6 인치
667 x 500, 1024 x 768

667 x 500

신용카드

가로 세로 1 : 1.56 비율.
780 x 500, 1560 x 1000

780 x 500

A4 용지

가로 세로 1 : 1.414 비율.
707 x 500, 1414 x 1000

707 x 500

35 밀리미터 영화

가로 세로 3 : 2 비율. 6 x 4 인치
750 x 500, 1080 x 720

750 x 500

1185 x 500

1185 x 500, 2560 x 1080

1185 x 500

사이즈, 비례, 해상도

이미지 사이즈 (Image size)는 이미지의 크기를 의미하며 픽셀(Pixel) 단위로 표현됩니다.
이미지 비례 (Aspect ratio)는 이미지의 가로와 세로 크기의 비율을 의미합니다. 이 비율을 유지하면서 이미지 크기를 변경하면 이미지가 왜곡되지 않습니다.
이미지 해상도 (Image resolution)는 이미지의 품질을 결정하는 요소 중 하나로, 픽셀 밀도(Pixel density)를 의미하며 DPI(Dots Per Inch)나 PPI(Pixels Per Inch)로 표시됩니다. 높은 해상도를 가진 이미지는 더 선명하게 보이지만 파일 용량이 커집니다. 웹 페이지에서 사용하는 이미지는 보통 72 DPI의 해상도로 제작합니다.