웹 타이포그래피는 사용자 경험과 브랜드 아이덴티티를 형성하는 데 중요한 요소입니다.
Django 또는 정적 웹 프로젝트를 만들다 보면 .ttf.woff2 같은 다양한 폰트 포맷을 접하게 됩니다.

이 글에서는 .ttf.woff2의 차이점, 왜 웹 개발자들이 .woff2를 선호하는지,
그리고 Ubuntu에서 .ttf.woff2로 변환하는 방법을 설명합니다.
또한 변환 작업을 자동화할 수 있는 Bash 스크립트도 함께 제공합니다.


Various font formats for web design

1. TTF란?

TTF (TrueType Font)는 Apple과 Microsoft가 공동 개발한 범용 글꼴 포맷입니다.
인쇄 및 화면 출력 모두를 지원하며, 다양한 운영체제에서 폭넓게 사용됩니다.

  • ✅ 장점:
  • 모든 운영체제에서 널리 지원됨
  • 이미지 렌더링이나 데스크탑 앱에서 적합

  • ❌ 단점 (웹 기준):

  • 파일 용량이 큼
  • 웹 최적화가 되어 있지 않음
  • 로딩 속도 느림

2. WOFF2란?

WOFF2 (Web Open Font Format 2)는 웹 전용으로 설계된 최신 압축 폰트 포맷입니다.

  • ✅ 장점:
  • 매우 높은 압축률 (TTF 대비 최대 30% 작음)
  • 빠른 로딩, 네트워크 최적화
  • 모든 최신 브라우저 완벽 지원

  • ❌ 단점:

  • 데스크탑 앱이나 일부 이미지 렌더링에는 부적합
  • .ttf 또는 .otf로부터 별도 변환 필요

3. 왜 웹 개발자들은 WOFF2를 써야 할까?

항목 TTF WOFF2
파일 크기 ❌ 큼 ✅ 작음
웹 성능 ❌ 낮음 ✅ 최적화
브라우저 호환성 ✅ 좋음 ✅ 매우 좋음
웹폰트 적합성 ⚠️ 조건부 ✅ 강력 추천

웹 성능과 사용자 경험을 고려할 때, 특별한 이유가 없다면 항상 WOFF2를 사용하는 것이 좋습니다.


4. Ubuntu에서 TTF → WOFF2 변환하기

필요한 패키지 설치

sudo apt update
sudo apt install woff2

설치되면 woff2_compress라는 명령어로 변환이 가능합니다.


수동 변환 명령어

woff2_compress Poppins-Regular.ttf

같은 디렉토리에 Poppins-Regular.woff2 파일이 생성됩니다.


5. 보너스: 자동 변환 Bash 스크립트

아래 스크립트를 사용하면 .ttf 파일들을 한 번에 변환할 수 있습니다. bash script에 익숙하신 분들은 복사하여 사용하세요.

convert-ttf-to-woff2.sh

#!/bin/bash

# 변환 대상 디렉토리
FONT_DIR="./"
OUTPUT_DIR="$FONT_DIR/woff2"

# woff2_compress 명령어 확인
if ! command -v woff2_compress &> /dev/null; then
    echo "❌ 'woff2_compress' 명령어를 찾을 수 없습니다."
    echo "다음 명령어로 설치하세요:"
    echo "    sudo apt install woff2"
    exit 1
fi

# 결과 디렉토리 생성
mkdir -p "$OUTPUT_DIR"
echo "📁 변환 결과 디렉토리: $OUTPUT_DIR"

# 변환 실행
echo "🔄 TTF → WOFF2 변환 중..."

find "$FONT_DIR" -maxdepth 1 -type f -name "*.ttf" | while read -r ttf_file; do
    filename=$(basename "$ttf_file")
    base="${filename%.ttf}"
    output_file="$OUTPUT_DIR/$base.woff2"

    if [[ -f "$output_file" ]]; then
        echo "⚠️  이미 존재함: $output_file (건너뜀)"
        continue
    fi

    woff2_compress "$ttf_file"
    mv "${ttf_file}.woff2" "$output_file"
    echo "✅ 변환 완료: $output_file"
done

echo "🎉 변환이 모두 완료되었습니다!"

✅ 요약

  • .woff2는 웹 전용으로 설계된 최신 포맷이며, 성능과 용량 면에서 뛰어납니다.
  • .ttf는 웹에서는 비효율적이지만 이미지 렌더링 등 다른 용도에는 유용합니다.
  • 자동 변환 스크립트를 활용하면 프로젝트의 폰트 관리를 훨씬 효율적으로 할 수 있습니다.

여러분의 웹 프로젝트 폰트 성능 향상에 도움이 되길 바랍니다!