이미지의 종류
이미지의 종류는 크게 다음과 같다
비트맵
- 대표 형식: JPG, PNG, GIF
- 특징: 픽셀 기반으로 구성되어 고사양 사진 및 일반 그림 표현에 적합
- 장단점
- 장점: 다양한 색상과 디테일 표현에 유리
- 단점: 확대/축소 시 계단 현상 발생(깨짐)
JPG
- '손실' 압축 방식으로 높은 압축률 제공
- 24비트 컬러 지원(광범위한 색 표현 가능)
- 투명도 미지원
- 활용: 일반 사진, 배경 이미지
PNG
- '비손실' 압축 방식(압축 후에도 품질 유지)
- 8비트, 24비트 컬러 지원
- 투명도 지원
- 파일 크기는 JPG보다 큼
- 활용: 투명도가 필요한 이미지(아이콘, 로고), 투명도가 필요 없으면 압축 효율이 더 좋은 JPG 사용 권장
GIF
- '비손실' 압축 방식
- 8비트 컬러 지원
- 애니메이션 및 간단한 그래픽 표현에 적합
- 활용: 움짤, 간단한 애니메이션
WEBP
- JPG, PNG, GIF를 대체할 수 있는 구글이 개발 이미지 포맷
- 손실 및 비손실 압축 모두 지원
- JPG와 PNG 대비 높은 압축 효율 제공
- 투명도와 GIF 애니메이션 지원
- 일부 브라우저에서 '호환성 문제' 있음
- Tip: WebP 호환성 지원 여부를 확인하고 미지원 브라우저에서는 대체 이미지를 제공한다
벡터
- 대표 형식: SVG
- 특징: 수학적 계산을 기반으로 한 이미지를 렌더링
- 장점:
- 무한 확대/축소 가능(품질 손실 없음)
- 파일 크기가 작고 플랫한 이미지에 적합
- 활용: 단순한 모양의 로고/아이콘/일러스트
SVG
- HTML/XML에서 벡터 그래픽을 표현하는 포맷
- 이미지 확대/축소에 자유로움, 깨지지 않음
- CSS와 JS로 제어 가능
- 활용: 이미지 크기가 자주 변경되는 상황(로고, 아이콘, 해상도)에서 자주 사용
