나무모에 미러 (일반/밝은 화면)
최근 수정 시각 : 2024-10-06 20:49:50

이미지크기

1. 개요2. 이미지 크기는 용량을 줄이기 위한 노력의 결과3. 이미지 확장자4. HTML에서의 색상 표현 방법

1. 개요

컴퓨터 이미지는 픽셀로 이루어져 있다.
픽셀은 가로 픽셀수 * 세로 픽셀수의 값을 가지고 * 색이 결정되는 경우의 수로 계산된다.
예를 들면 색의 수는 흑백 이미지는 흑과 백의 값만 갖게 되므로 값은 2이다.
200 * 200 픽셀로 된 이미지라면 200 * 200 * 2 bit로 계산 된다.
1 bit = 1/8 byte 이므로 크기는 80000bit = 10000byte의 크기가 된다.

2. 이미지 크기는 용량을 줄이기 위한 노력의 결과

흑백은 0 또는 1로 2bit로 계산된다.
그런데 우리가 보는 영상은 Red, Green, Blue의 조합으로 표현된다.
(여기에 별도의 레이어가 추가될 수 있다)
각 R을 2의 3승(8), G와 B도 2의 3승으로 각각 계산하면
200 * 200 픽셀일 때 200 * 200 * (R)8 * (G)8 * (b)8 로 계산된다.
(최근에는 24비트 이상의 칼라를 지원하기도 한다.)

사람의 눈으로는 약 6만개 정도의 색상을 구분할 수 있다.
그래서 RGB 각각의 값을 2의 3이 아닌 2의 8승 (65536)으로 계산하면 2의 24승의 칼라스케일이 나오는데 이를 True Color라 부르기도 한다.

지금이야 고사양의 그래픽카드가 저렴하고 흔해서 모두 True Color를 사용하지만 예전에는 그렇지 못했다.

플로피 디스크가 1.4메가 정도의 사이즈였으니 True Color로 저장을 하면 작은 사진도 디스크에 담기 어려웠다.

3. 이미지 확장자

각 이미지 확장자의 유래는 다른 문서에서 다루겠다.
우선 압축하지 않은 True Color는 Tif (tagged image file format)를 사용했다.

그런데 용량이 조금이라도 커지면 크기가 어마무시하게 커지니 화면에 표시되는 간단한 자료들은 256컬러 (각 2의3승)를 사용하는 Gif 형식을 사용하였다.(초기 인터넷을 Gif 파일로 만든 이유도 그런 이유다)

하지만 256(R8*G8*B8)컬러는 색상이 자연스럽지 않아 일종의 파일변환 값을 포함한 JPG (Joint Photographic Experts Group) 규약을 만들어 2의 24승 값이 아닌 색상의 변환값을 포함하여 표현하는 압축기술을 사용하게 된다.

이럴 경우 1/100 이하로도 줄어들 수 있는데 압축률에 따라 이미지 손실이 발생한다. 위에서 표기한 바와 같이 사람의 눈이 6만개 이상의 색상 구분이 불가능 하므로 압축률을 최소화 시킨다면 전문가가 아니면 구별하기 어렵다.

4. HTML에서의 색상 표현 방법

HTML에서는 색상을 R24*G24*B24를 코드로 사용한다.
즉 색상 표기 방법은 #000000 이라하면 R00 G00 B00 즉 모든 색을 끈 0으로 만든 수치이므로 검은색이 된다.
반대로 #FFFFFF 라면 R255 G255 B255 모든 색을 최대로 밝게 켜게 되므로 흰색이 된다.http://colorchart.ltool.net/

255라는 값이 FF가 되는 것은 두자리에 숫자를 맞춰야 하니 99 다음에 이후의 수는 A0, A1,,,ff로 마무리 된다.

분류