이미지 포맷의 종류

Gif 색을 256 표현 가능하고 선명하진않지만 용량이 적게듬 투명표현가능하지만 정도조절 불가 그림자표현불가 애니메이션처리가능

Jpg/jpeg 화소가 높고 용량도적지만 투명처리 불가능

Png 웬만한컬러 표현다가능 투명영역처리가능, 용량이 큼

Svg 벡터이미지. 코드로 구현된 이미지! 손실이나 품질저하없이 모든 크기에서 렌더링 가능 ,컬러풀하고복잡한 이미지는 용량이 너무 커진다

Webp 압축률좋은 jpg보다 용량은 70수준으로 낮지만 더 뛰어난 색상지원가능 그럼에도 png처럼 투명도표현도가능하고 Gif처럼 애니메이션도 가능한 만능포맷!

Avif 웹피처럼 색상표현 애니메이션지원 투명도 표현 모두 가능하며 Jpeg 50 만큼, 다 좋은 거지만 최신이라 지원파는 브라우저가 별로 없음

이미지 포맷의 종류
GIF(Graphics Interchange Format) :
256색의 컬러만 표현 가능하기 때문에 선명하진 않지만 용량이 적게 듭니다. 투명은 표현 가능하지만 그 정도를 조절하는건 불가능하며, 때문에 그림자 표현도 불가능합니다. 애니메이션 처리가 가능합니다.

JPG/JPEG (Joint Photographic Expert Group image):
매우 화소가 높고, 용량도 적지만 투명처리가 불가능합니다.

PNG (Portable Network Graphics) :
웬만한 컬러는 모두 표현 가능하여 투명 영역을 처리 가능하지만 용량이 큽니다.

SVG (Scalable Vector Graphics) :
SVG 형식의 벡터 이미지는 손실이나 품질 저하 없이 모든 크기에서 렌더링이 가능합니다.

WebP (Web Picture Format) :
압축률이 좋다고 소문난 JPEG 이미지에 비해 무려 용량은 70% 수준으로 낮지만 더 뛰어난 색상을 지원하는 포맷입니다. 그럼에도 불구하고 PNG 처럼 투명도 표현 가능하며, GIF 처럼 애니메이션 표현도 가능한 만능 포맷입니다.

AVIF (AV1 Image File Format) : WebP 처럼 뛰어난 색상표현, 애니메이션 지원, 투명도 표현 모두 가능하며 JPEG 이미지의 50% 수준인 용량을 자랑하는 차세대 이미지 포맷입니다. 아직 지원하지 않는 브라우저가 많음에 주의해야합니다.