GIF, PNG 차이 - GIF, PNG chai

사진 확장자 간단하게 알아보자!

다양한 사진 확장자들이 많이 있습니다.

우리에게 익숙한 jpg, bmp부터 tiff나 png 확장자를 가진 사진, 그림파일들이 있는 데 각각 어떠한 차이들이 있고, 필요한 사진을 저장할 때 어떤 걸로 저장을 하면 좋을지 고민해 보기로 해요.

우선 첫번째로 .bmp 확장자에 대해 알아볼게요.

bmp 사진들은 윈도우 환경이 만들어지면서 오래전에 만들어진 파일 확장자 형태로 보입니다. 풀어서는 bitmap이라고도 합니다. 여러 사진 저장 확장자들 중에서 구조가 가장 단순하며 다른 확장자에 비해 압축이 거의 되지 않아 용량 또한 매우 큰 타입입니다.

사진을 저장할 때 가장 날것의 형태라고 볼 수 있겠습니다. 거의 압축이 되지 않다 보니 사진이나 그림의 손실은 적은 편이나 용량이 큰 관계로 인터넷 업로드 등에서는 잘 활용하지 않습니다. 

그래픽 작업등을 할 때 사용하는 경우가 있습니다.

두번째로는 jpg, jpeg입니다.

jpg는 사진 등을 인터넷 등 웹과 같은 통신에서 활용하기 만들어진 기술이라고 합니다. JPEG 위원회라는 곳에서 개발되었다고 하는데, FULL NAME은 joint photographic coding experts group이라고 합니다. coding이라는 문구가 들어가 있는 것에서 유추해보면 압축에 강점을 둔 이미지 형태라고 할 수 있는데, 다른 사진 확장자들에 비해 가장 높은 압축률을 보여주고 있습니다.

그리고 또하나의 장점은 1600만 개의 다양한 색상을 표현할 수 있어서 고해상도에도 적합합니다. 그리고 사진을 만들거나 파일 크기를 조절할 때 이미지의 품질을 조절할 수 있습니다. 

바로 위와 같이 각종 이미지 편집 툴이나 사진 앱에서 저장을 할 때 위와 같이 뜨는 경우를 볼 수 있습니다. jpg 형태로 저장할 때 사진의 품질을 조절할 수 있는데, 최저에서 최고 사이에서 조정을 할 수 있습니다.

품질을 낮게하면 용량은 작아지나 해상력은 다소 떨어지고, 품질을 좋게 하면 용량은 커지나 해상도는 좋아집니다. 

이를 잘 활용하면 인터넷에 게시하는 사진들을 해상도가 떨어지지 않는 선에서 적절히 용량을 줄일 수가 있습니다.

그럼 jpg와 jpeg는 차이가 있는걸까요?

결론적으로 차이는 없습니다. 예전에 도스를 사용하던 시절에 파일 확장자가 지원되는 게 3자리까지만 표현이 가능하여 jpg나 jpe로 많이 썼다고 합니다. 이후 윈도에서는 확장자가 4자리까지도 지원되어 원래의 jpeg로 표현이 가능해졌습니다. 확장자 자릿수만 차이 있을 뿐 사진상에서는 다른 점은 없습니다. 

다음은 gif 확장자입니다.

흔히들 gif는 움직이는 사진이라고들 많이 얘기합니다. 이것의 가장 큰 특징이죠. 

즉, 1개의 사진 이미지에 여러 개의 이미지를 저장하여 마치 영상을 보는듯한 느낌을 받도록 해주는 것입니다. 

웹에서 사진만으로 표현하기 어려울 때, 동영상으로 하기에는 동영상 플러그인도 있어야 하니 짧은 영상을 간단하게 표현하기에는 gif를 활용하면 좋습니다.

또한 gif 형태로 만들면 원본을 비손실 압축된 형태로 사진의 품질도 유지하면서 파일의 용량도 줄일 수 있습니다. 

단 한 가지 아쉬운 점은 jpg는 색의 표현이 1600만 개나 되나 gif는 최대 256개의 색을 표현할 수 있습니다.  고화질 사진용으로는 좀 어려운 면이 있습니다.

각종 배너나 애니메이션 표현용으로 적합한 형태네요.

다음은 png 파일 형태입니다. 

위와 같이 png는 jpg 보다는 화질이 좋으나 파일 용량이 좀 더 크다고 합니다.

속을 들여다보면 gif와 같이 비손실 압축 형태라 사진 원본의 훼손이 거의 없다고 볼 수 있겠습니다. 또한 지원되는 색상이 1600만 컬러가 지원되어 고품질의 사진을 얻을 수 있습니다.

그래서 살펴보면 jpg와 gif의 장점이 모였다고 볼 수 있겠습니다. 다만 파일 용량은 좀 더 크다는 점은 염두에 두어야 하겠습니다.

png는 potable network graphics의 약자로 윈도나 유닉스 등 다양한 운영 체제 및 앱에서 동일한 이미지를 보여줄 수 있고, jpeg 보다도 인터넷상에서 빠르게 보인다고 하네요.  

인터넷을 활용하면서 용량 제약이 크지 않다면 선명한 이미지를 빠르게 보여줄 수 있는 게 장점이 되겠습니다.

마지막으로는 tiff입니다.

이 이미지 형태는 1980년대에 개발된 이미지 형태로 마이크로소프트사와 알터스 사에서 공동 개발한 그래픽 파일 형태로 그래픽 자료 교환을 목적으로 만들어진 형태라고 합니다.

이는 예전에는 상호 다른 컴퓨터 기종에서 이미지를 서로 교환하는 것은 쉽지 않은 문제였다고 합니다. 그래서 이를 해결하기 위해 보편적으로 사용 가능한 이미지 타입이 필요했고 그래서 개발된 것이 tiff라고 하네요.

특징을 살펴보면 무손실 압축에다가 컬러 또한 1600만 컬러 표현이 가능합니다. 일반적으로는 업무용 이미지나 도면 등을 사진으로 저장할 때 많이 사용되는 형태로 볼 수 있습니다.

용량은 jpg 대비 크게 나오는 것을 볼 수 있습니다.

[같이 보면 좋을 내용들]

라인카메라(Line camera) 앱으로 만들수 있는 콜라주는 사진 9장까지!

라인카메라(Line camera) 앱으로 만들수 있는 콜라주는 사진 9장까지!

 라인카메라(LINE CAMERA) 어플로 만들 수 있는 콜라주는 사진 9장까지 안녕하세요. 오늘은 콜라주와 관련된 내용입니다. 여러분은 콜라주 만들때 어떤 어플을 사용하시나요? 저는 삼성 스마트폰에

jake-inventory.tistory.com

BEAM 빔 공유 전동킥보드 사용해볼까, 어플 설치부터~

BEAM 빔 공유 전동킥보드 사용해볼까, 어플 설치부터~

BEAM 빔 공유 전동 킥보드 사용해볼까, 어플 설치부터~ 이번 시간에는 BEAM 빔 공유 전동 킥보드에 대해 알아보려고 합니다. 지난 시간에 지쿠터 GCOOTER 공유 킥보드에 대해 살펴봤었는데요. 이 빔

jake-inventory.tistory.com

좋은 하루 보내십시요.

온라인에서 우리가 보는 수 없이 많은 이미지들의 속성을 확인해보면 파일 형식이 매우 다양합니다. 

자주 볼 수 있는 JPEG 부터 약간은 생소한 TIFF, SVG 파일까지.

이 글은 어떤 종류의 이미지 파일을 언제, 왜 사용하는지에 대한 약간의 정보 제공을 하고자 작성하였습니다. 

JPEG (Joint Photographic Experts Group) 혹은 JPG 파일

흔하게 볼 수 있는 보편적이고 일반적인 이미지 파일 형식으로서, .JPEG, .JPG 라는 파일 확장자를 사용합니다. 

웹사이트나 소셜 미디어에 업로드하기에 가장 적합하기에 웹브라우저에서 가장 많이 볼 수 있는 파일 확장자이지요. 

이미지 파일을 압축하여 작게 만들어서 빠르게 로딩될 수 있도록 만든 압축된 그래픽 파일이기 때문에, 

저화질이나 중간 화질 정도의 사진으로 볼 수 있습니다.  

그렇지만 일반적으로 웹에서 우리가 보는 이미지가 외부 인쇄 작업을 해야하는 고품질의 이미지 파일일 필요는 없기 때문에, 

크롬이든 사파리든 웹사이트에서 일반적인 이미지 공유로 매우 적합한 파일 형식이지요. 

동일한 JPEG 파일을 반복 저장하게 되면, 저장할 때마다 이미지의 품질이 낮아지는 단점이 있습니다. 

TIFF (Tagged Image File Format) 파일

압축되지 않은 고품질의 디지털 이미지를 의미합니다. 

웹에서 우리가 일반적으로 보는 이미지는 해상도나 화질이 그렇게 중요하지 않을 수도 있지만, 품질과 해상도가 중요할 때가 있습니다.

바로 광고와 같은 상업적 목적 또는 출판 인쇄나 정교한 그래픽 작업에서 그렇습니다. 

따라서, TIFF 는 상업 또는 전문 작업을 인쇄하거나 출판을 위한 작업을 위한 파일 형식이라고 할 수 있습니다. 

주로 Adobe Photoshop이나 InDesign 과 같이 출판용 페이지 레이아웃을 그리는 소프트웨어 프로그램에서 지원하는 형식입니다. 

JPEG와 달리 TIFF는 이미지의 품질을 그대로 유지하기 위해 무손실 압축 알고리즘을 사용합니다.

이 때문에, 고해상도 이미지 그대로를 보여주는 파일입니다.  

손실이 없으니 이미지의 사이즈는 커진다는 단점이 있습니다. 

Tiff 형식은 벡터가 아닌 래스터 형식(픽셀)으로서, 인터넷에 TIFF 확장자로 이미지를 올리면 당연히 로딩 시간이 매우 길어질 것입니다. 

이 때문에 웹 사이트에서는 이 tiff 형식이 지원되지 않는 경우가 많습니다. 

PNG (Portable Network Graphics) 파일

이미지의 품질에서는 TIFF와 비슷하지만, 배경이 투명하기 때문에 좀 더 복잡한 이미지를 작업하기 좋은 파일 형식입니다. 

정교한 작업이 필요한 웹 그래픽, 예를 들면 브랜드의 로고나 일러스트레이션, 프린트물을 작업하기에 좋습니다.

회사 홈페이지를 보면 색깔있는 배경 위에 로고가 있는 경우를 많이 보셨을 것입니다.

이처럼, 웹 사이트의 컬러 배경 위에 오버레이하려는 그래픽이나 로고가있는 경우 PNG로 저장해야 합니다. 

JPEG와 달리 이미지 저하없이 PNG 파일을 반복해서 다시 저장할 수 있습니다.

PNG 파일은 본질적으로 무손실이므로, 똑같은 PNG 파일을 반복 저장하면 파일이 점점 더 커질 것입니다. 

JPEG랑 비교했을 때, 웹 사이트에 PNG 파일로 업로드하면 웹 사이트 로딩 속도가 느려집니다.

그러나 그래픽의 품질을 유지하려면 어쩔 수 없겠지요. 

SVG (Scalable Vector Graphics) 파일

웹 디자인에 관심있는 분이라면 이 SVG파일을 자주 보셨을 것입니다. 

SVG 파일은 GIF, JPEG, PNG와 같은 픽셀 기반(Raster 형식)의 이미지 파일과 다른 XML기반의 이미지 형식입니다.

SVG 파일은 로고, 아이콘 및 간단한 그래픽에 사용되는 확장자라고 할 수 있겠습니다. 

SVG 파일은 모양, 색상, 크기를 정의하는 일종의 수학 방정식 같은 코드로서, 

디자이너는 그래픽 편집 응용 프로그램에서 이미지를 렌더링할 필요없이 텍스트 편집기에서 이미지 요소를 정의할 수 있습니다.

따라서, 이 SVG 형식을 지원하는 Adobe Illustrator, Sketch와 같은 벡터 기반의 그래픽 편집 프로그램이 필요합니다.

특수한 프로그램을 사용하여 코드로 프로그래밍 할 수 있기 때문에, 반응형 웹 사이트 작업에 적합하겠습니다. 

본래 위에서 다룬 이미지 파일 형식은 래스터(Raster) 기반이기 때문에,

이 파일들을 원래 크기 이상으로 확대하면 점들처럼 흐릿하게 깨져보일 것입니다. 

하지만 SVG 파일은 벡터(Vector) 기반이므로, 확대해도 깨지는 것 없이 품질이 그대로 유지됩니다.

PNG 파일보다 더 선명하게 보이고 훨씬 더 파일 사이즈가 작기 때문에, 웹 사이트 속도가 느려지는 단점은 없습니다. 

GIF (Graphics Interchange Format) 파일

"Graphic Interchange" 라는 이름에서 알 수 있듯이, 흔히들 "움짤"이라고 하는 애니메이션을 지원하는 파일 확장명입니다.

움직이는 이미지 또는 투명한 이미지에 쓰이는 파일이라고 볼 수 있겠습니다. 

png 파일과 마찬가지로 gif는 본질적으로 무손실이지만, 실제로는 png 이미지보다 더 많은 용량을 차지합니다.

투명한 이미지에도 쓰이지만, 투명도에 대한 지원이 약하고 256색만 있으며 웹 사이트 속도를 느리게 만듭니다.

(짤이 다운로드 안되서 사이트 로딩이 안됐던 경험 다들 있으실 겁니다.)

따라서, 웹 사이트에서 애니메이션을 제외하고는 gif 형식을 사용하지 않는 것이 좋습니다.