[CSS] 비트맵(Bitmap)방식과 벡터(Vector)방식에 대해 알아보자!

비트맵(Bitmap)방식과 벡터(Vector)방식은 무엇일까?

이미지 확장자를 선택하는 것은 비트맵과 벡터 이미지 중 어떤 형식으로 저장할지를 선택하는 것입니다.
포토샵과 일러스트레이터 중 결정하는 것도 비트맵과 벡터 중에서 선택하는 것입니다.
이번 포스팅을 통해 비트맵 방식과 벡터 방식 차이를 배워봅시다!

---

▶ 비트맵(Bitmap) 방식이란?

비트맵(Bitmap) 방식이란, 사각형 격자로 된 작은 점(픽셀)들이 모여서 표시된 이미지를 의미합니다.
쉽게 말해 픽셀에 있는 비트들이 모여 있는 방식이라고 보면 됩니다.
비트맵 이미지는 래스터 이미지라는 다른 표현으로 부르기도 합니다. 1픽셀마다 다른 데이터들을 가지고 있으며 서로 조합하여 하나의 이미지가 완성됩니다.
비트맵 이미지는 섬세한 색상을 표현해야 하는 이미지, 즉 사진에서 주로 사용됩니다.
핸드폰이나 디카로 찍었을 때 저장되는 이미지가 비트맵 이미지입니다.

비트맵 방식의 장점과 단점

-장점
: 많은 픽셀로 정교하고 다양한 색상을 가진 이미지를 만들 수 있습니다.
-단점
: 이미지를 확대하고 축소할 수는 있으나, 깨짐 현상과 이미지 품질이 저하됩니다.

---

▶ 벡터(Vector) 방식이란?

벡터(Vector) 방식이란, 점과 곡선을 수학적인 함수로 정의해서 표현되는 이미지입니다.
점과 점이 연결되어 선이 되고 선과 선이 연결되어 면이 되는 즉 점, 선, 면을 이용해 이미지를 표현합니다. 점,선,면을 수학적인 함수로 표현하기 때문에 벡터이미지는 원본 이미지를 크게 확장해도 깨지지 않습니다.
비트맵의 픽셀과 다르게 크기 조절이나 변형으로도 해상도가 깨지지 않습니다.
로고, 서체, 아이콘 작업 등에 다양하게 이용되고 있으며 Adobe Illustrator프로그램은 벡터 방식입니다.

벡터 방식의 장점과 단점

-장점
: 작업의 용이성 : 점과, 점으로 이루어진 선, 면으로 모든 그래픽 요소들이 이루어져 있기 때문에 간단하게 점과 선을 수정하는 과정으로 그래픽 작업을 유지하고 관리하기 쉽습니다.
: 벡터 포맷의 작업 파일이 보존되는 한 자유로운 수정 가능
-단점
: 정교한 작업의 한계점

---

▶ 비트맵 방식과 벡터 방식 정리

	비트맵(Bitmap)	벡터(Vector)
정의	정사각형의 픽셀에 저장된 비트 정보의 집합	수학적인 함수 관계로 만든 그래픽 이미지
확대	계단 현상	뚜렷한 외곽선
변화/회전	이미지 품질 손상	변화 없음
특징	사실적인 표현, 특수 효과, 풍부한 색감 표현	선명한 표현, 효과적인 응용 작업
단점	이미지의 축소, 확대로 인한 이미지 품질 손상	사진과 같은 이미지 그래픽의 정교한 작업의 한계점
확장자	JPG,PNG,GIF 등	AI, SVG, VML 등
프로그램	포토샵, 페인터 등	일러스트레이터, 플래시 등