'2014/04'에 해당되는 글 1건

  1. 2014.04.23 웹 상에서의 이미지 비교 분석 (JPEG, PNG, GIF)

컴퓨터에서 이미지를 표현하는 방식은 무수히 많다.


하지만 다행히 웹 상에서 사용하는 '일반적인' 이미지 형식은 오직 3가지 뿐이다.


바로 JPEG, PNG, GIF.


이전에 라인 정규직 전환 면접 때도 웹 상에서의 이미지 표현 형식에 따른 차이점을 말하라는 질문을 받았는데, 당시에 이에 대한 개념이 전혀 없었기에 제대로 대답하지 못했던 뼈 아픈 기억이 남아있다.


HeadFirst HTML/CSS 를 공부하던 중 마침 이 부분을 다루길래 글로 남겨본다.



JPEG 

PNG 

 GIF

 사진이나 복잡한 그래픽처럼 연속적인 톤의 이미지에 가장 잘 맞는다.


1,600만개의 서로 다른 색을 가진 이미지를 표현할 수 있다.


이미지 정보 일부가 손실되고 파일 크기가 감소되는 '손실이 많은' 형식이다.


투명도는 지원하지 않는다.


웹 페이지에 좀 더 효율적이다.


애니메이션은 지원하지 않는다.

PNG는 몇 가지 단색이나 로고, 클립아트 같은 선이 있는 이미지, 텍스트가 있는 이미지에 가장 잘 맞는다.


PNG는 수 백만 가지의 다른 색을 가진 이미지를 표현할 수 있다. PNG는 표현하려는 색이 얼마나 많으냐에 따라 PNG-8(256),PNG-16(65536), PNG-24(1670만), PNG-32 세 가지로 분류할 수 있다.


PNG는 파일을 압축해 크기를 줄이기는 하지만, 내용을 버리지는 않는다.

즉, '무손실' 압축 형식이다.


'투명'모드 설정을 할 수 있어 이미지 밑으로 모든 것을 볼 수 있다.


JPEG와 비교하면 파일 크기는 커지는 경향이 있지만, 사용된 색상의 수에 따라 GIF보다 작거나 커질 수 있다.

PNG와 마찬가지로 GIF는 몇 가지의 단색이나 로고, 클립아트 같은 선이 있는 이미지, 텍스트가 있는 이미지에 가장 잘 맞는다.


GIF는 256가지 색상을 표현할 수 있다.


GIF 역시 '무손실' 형식이다.


GIF는 투명도를 지원하긴 하지만, 오직 한 가지 색상만 '투명'하게 설정할 수 있다.


JPEG와 비교해 파일 크기가 크다.


애니메이션을 지원한다. 


저작자 표시 비영리 동일 조건 변경 허락
신고

'NHN NEXT' 카테고리의 다른 글

웹 상에서의 이미지 비교 분석 (JPEG, PNG, GIF)  (0) 2014.04.23
[iOS] AssetsLibrary와 Semaphore  (0) 2014.02.19
Posted by 우너효