비트맵 Raster
픽셀이 모여 만들어진 정보의 집합,
레스터(Raster)이미지라고도 부름
정교하고 다양한 색상을 자연스럽게 표현, 확대/축소시 계단현상, 품질저하.
01. JPG(Joint Photographic coding Experts Group)
Full-color 와 Gray-scale 의 압축을 위해 만들어 졌으며,
압축률이 훌륭해 사진이나 예술 분야에서 많이 사용.
손실압축 : 표현 색상도(24비트, 약 1600만 색상)가 뛰어남
이미지의 품질과 용량을 쉽게 조절 가능
가장 널리 쓰이는 이미지 포멧
02.PNG(Portable Network Graphics) 는 Gif 의 대체 포멧으로 개발됨
비손실 압축
8비트(256 색상)/ 24비트(약 1600만 색상) 컬러 이미지 처리
Alpha Channel 지원(투명도)
W3C 권장 포맷
03.GIF(Graphics Interchange Format)는 이미지 파일 내에 이미지 및 문자연 같은 정보들을 저장.
비손실 압축
여러장의 이미지를 한개의 파일에 담을 수 있음
(움짤, 애니메이션)
8비트 색상만 지원(다양한 색상 표현에는 적합하지 않음)
04.WEBP(하위호환성을 확인해야 함)
JPG, PNG, GIF 를 모두 대체할 수 있는 구글이 개발한 이미지 포맷
완변한 손실/비손실 압축지원
GIF 같은 애니메이션 지원
Alpha Channel 지원(손실, 비손실 모두)
벡터 Vector (.svg)
점,선,면의 위치(좌표), 색상등 수학적 정보의 형태 (Shape)로
이루어진 이미지.
확대/축소에 자유로우며 용량변화가 없음
정교한 이미지는 표현하기 어려움
01.SVG(Scalable Vector Graphic)는 마크없 언어(HTML/XML) 기반의 벡터 그래픽을 표현하는 포멧
해당도의 영향에서 자유로움
CSS와 JS로 제어 기능 파일 및 코드 삽입가능
'프론트엔드 > HTML,CSS,JS' 카테고리의 다른 글
특수 문자 용어 (0) | 2021.09.28 |
---|