가이드

파일은 큰데 어디서 줄여야 할지 모르겠고, PNG와 WebP 중 무엇을 골라야 할지 헷갈릴 때가 있습니다. 이곳에는 Boltpic 도구를 직접 확인하면서 정리한 형식 선택법, 용량 줄이는 순서, 색상 코드 읽는 법, 사진 공유 전 점검 항목을 모았습니다.

• PNG vs JPG vs WebP, 결국 뭘 써야 할까?

  사진, 스크린샷, 투명 그래픽에 맞는 형식은 서로 다릅니다. PNG·JPG·WebP의 압축 방식과 선택 기준을 실제 작업 순서에 맞춰 정리했습니다.

  2026년 7월 28일 검토

• 이미지 용량 줄이기, 화질은 지키면서

  파일 용량을 줄일 때 먼저 손볼 것은 픽셀 크기, 형식, 압축 품질입니다. 불필요한 화질 손실을 줄이는 조정 순서와 확인 방법을 설명합니다.

  2026년 7월 28일 검토

• HEX, RGB, HSL — 색상 코드 읽는 법

  #e63946, rgb(230, 57, 70), hsl(355, 78%, 56%)가 각각 무엇을 뜻하는지, 언제 어떤 표기가 편한지, 이미지에서 정확한 값을 뽑는 방법까지 정리했습니다.

  2026년 7월 28일 검토

• 웹사이트 이미지 최적화 실전 체크리스트

  이미지 크기, 형식, 로딩 우선순위, 레이아웃 안정성을 점검하고 LCP에 영향을 줄 수 있는 요인을 확인합니다.

  2026년 7월 28일 검토

• 올리기 전에 가리세요 — 사진 속 개인정보 처리법

  택배 라벨, 차량 번호판, 모니터 화면, 지나가는 사람들. 사진을 올리기 전에 확인할 것과 약한 블러가 충분한 보호가 되지 않는 이유, 브라우저에서 가리는 방법을 정리했습니다.

  2026년 7월 28일 검토

• CSS 그라디언트 실전 가이드

  linear-gradient, radial-gradient, conic-gradient를 복사해 쓸 수 있는 예제로 익히고, 히어로 오버레이·그라디언트 텍스트·줄무늬 패턴과 밴딩 해결법까지 다룹니다.

  2026년 7월 28일 검토