• 가이드

사이트 이미지 파일 형식은 무얼 써야 할까요? (JPG, JPEG, GIF, PNG)

우리는 사이트에 상품을 등록하거나 페이지를 디자인 할 때, JPG, JPEG, PNG, GIF와 같은 형식의 이미지들을 종종 사용하게 됩니다. 보기에는 다 같은 이미지인데, 무엇이 다른 걸까요?

이 도움말에서는 웹 디자인 시 주로 사용하는 이미지 형식들의 차이점에 대해 알아봅니다.

JPEG/JPG

JPEG는 Joint Photograph Experts Group의 약자로, 인터넷에서 가장 많이 사용되는 그래픽 형식 중 하나입니다. JPEG와 JPG는 파일의 확장자명만 다를 뿐 같은 형식으로, 실제 JPEG 확장자명을 JPG로 바꿔도 그대로 사용할 수 있습니다. 형식명을 읽을 때는 '제이펙' 또는 '제피이지' 라고 발음합니다.

JPEG는 주로 사진 이미지에 사용합니다. JPEG와 함께 많이 사용되는 GIF의 경우 256색만 표현할 수 있는 데 반해 JPEG는 1,600만 개의 색을 표현할 수 있으며, 그럼에도 데이터의 압축 효율이 무척 좋아 고화질의 사진에 적합하기 때문입니다. 이에 따라 사이트에 사진 이미지를 삽입하는 경우 JPEG를 많이 권장합니다.

단, 글자나 로고, 아이콘과 같이 단순하고 날카로운 면이 주를 이루는 이미지의 경우, 이미지가 다소 손상되어 보이는 경향이 있습니다.

GIF

GIF는 Graphics Interchange Format의 약자로, 네트워크 상에서 빠른 이미지 전송을 목적으로 개발되었습니다. 국내에서는 '기프' 또는 '지아이에프' 라고 발음합니다.

GIF는 256색 밖에 표현할 수 없고 압축률도 매우 낮아 어쩜 지금의 인터넷 속도 및 고해상도 디스플레이에 어울리지 않는 그래픽 형식으로 보입니다. 그러나 쉽게 애니메이션 제작이 가능하고, 배경을 투명하게 처리할 수 있다는 점에서 세계적으로 여전히 많이 사용되고 있습니다.

웹사이트에서 특정 상품 또는 내용을 강조할 때 애니메이션으로 종종 사용되곤 합니다.

PNG

PNG는 Portable Network Graphics의 약자로 무손실압축 방식에 32비트 트루컬러 처리가 가능한 그래픽 형식입니다. 일반적으로 '피앤지'라고 읽습니다. 대개의 경우 JPEG 대비 파일 크기가 다소 크지만, 경우에 따라 더 뚜렷하게 표현하는 장점이 있으며, 날카로운 면 표현에도 적합합니다.

웹사이트에 로고, 텍스트, 아이콘, 도형 등의 단순 이미지를 삽입할 때 권장하며, 페이지에 반투명 이미지 사용 시 거의 유일한 방법이기도 합니다. 예를 들어 스마트폰 아래 그림자를 입히고, 배경을 투명하게 처리하여 페이지에 삽입하는 방법 등이 있습니다.

목록으로

아임웹 디자이너가 되어주세요!

개인 디자이너, 1인 기업을 위한 아임웹 디자이너 프로그램

리셀러/디자이너 신청

한 번 이용하면 팬이 됩니다.

아임웹에서 당신의 생각을 표현해보세요.

218.7K

누적 사이트 이용 수
이미 수만 명이 아임웹 팬이 되어
각자의 생각을 표현하고 있습니다.

315

일 평균 사이트 개설 수
지금 이 순간에도 매일
새로운 브랜드가 소개되고 있습니다.

1.9K

전국 파트너/리셀러 수

아임웹 공식제휴사

아임웹은 페이팔, KG이니시스, 네이버, KCP, 나이스페이, 엑심베이 공식파트너입니다.