이미지 포맷 전략
SLUR UI System에서는
이미지 포맷을 단순한 기술 선택이 아니라,
이미지의 역할과 사용 목적에 따른 설계 요소로 다룹니다.
포맷 선택은 UI 품질과 성능에 직접적인 영향을 미칩니다.
이미지 포맷 선택의 기본 원칙
Section titled “이미지 포맷 선택의 기본 원칙”이미지 포맷은 다음 기준을 우선으로 선택합니다.
- 이미지의 역할이 무엇인가
- 투명도가 필요한가
- 디테일 유지가 중요한가
- 성능 최적화가 우선인가
하나의 포맷이 모든 상황에 적합하지는 않습니다.
포맷별 사용 기준
Section titled “포맷별 사용 기준”JPG / JPEG
Section titled “JPG / JPEG”- 사진, 배경 이미지 등 실사 이미지에 사용합니다.
- 색상 변화가 많고 디테일이 중요한 경우 적합합니다.
- 용량과 품질의 균형이 필요할 때 사용합니다.
- 투명도가 필요한 이미지에 사용합니다.
- 아이콘, UI 그래픽에 적합합니다.
- 용량이 커질 수 있으므로 제한적으로 사용합니다.
- 대부분의 UI 이미지에 우선 고려합니다.
- JPG, PNG 대비 용량이 작습니다.
- 투명도와 애니메이션을 모두 지원합니다.
WebP는
범용적인 기본 포맷으로 권장됩니다.
- 고압축이 필요한 경우 사용합니다.
- 성능 최적화가 중요한 이미지에 적합합니다.
- 브라우저 지원 여부를 반드시 고려합니다.
AVIF는
조건부 사용을 전제로 합니다.
역할 기반 포맷 선택
Section titled “역할 기반 포맷 선택”SLUR UI System에서는
이미지 역할에 따라 포맷을 선택합니다.
- 정보 전달 이미지 → 품질 우선
- 기능 이미지 → 명확성 우선
- 장식 이미지 → 용량 최소화 우선
포맷 선택은
역할 정의 이후에 결정되어야 합니다.
포맷 전략의 목적
Section titled “포맷 전략의 목적”이미지 포맷 전략은
단순한 용량 절감이 아니라,
UI 품질과 성능을 동시에 유지하기 위한 기준입니다.
이미지 포맷이 일관되게 관리될수록
페이지 로딩 성능과 사용자 경험은 안정적으로 유지됩니다.