비트맵 이미지와 벡터 이미지

비트맵 이미지

 

기본적으로 픽셀(점)로 이루어져 있기 때문에

과도하게 확대시 점 사이 공간이 비게 되어 깨짐(계단현상)이 발생

 

형식

• jpg : 손실 압축, 용량을 획기적으로 줄임
• png : 비손실 압축, W3C권장 형식, 이미지에 투명추가 가능
• gif : 비손실 압축, 하나의 파일에 여러 이미지 가능(움짤), 8비트(256색)로 선명한 이미지는 아님
• webp : 손실/비손실 압축 선택 가능, 움짤/투명 가능, 지원 브라우저가 제한적

벡터 이미지

 

Code로 구성되어 수학적 계산을 통해 선과 면을 표현(CSS, JS로 컨트롤 가능)

확대해도 깨지지 않음(점으로 이루어진 것이 아니므로)

 

형식

• svg : W3C가 만든 벡터 이미지 표준

SVG