핵심 요약
- 전통 활판 인쇄에서 쓰이던 행잉 구두점, 여백 정렬 등을 웹에 구현하는 HTML 프리프로세서 'Typeset'이 소개되었습니다.
- 클라이언트 자바스크립트를 쓰지 않고 1KB 미만의 CSS만으로 IE5 구형 브라우저까지 지원하는 뛰어난 가벼움이 특징입니다.
- npm CLI나 빌드 도구 플러그인으로 손쉽게 연동 가능하며 CC0 퍼블릭 도메인으로 무료 배포 중입니다.
요약 웹 브라우저의 기본 텍스트 렌더링 엔진만으로는 고급 활판 인쇄술(타이포그래피) 특유의 섬세한 조판 방식을 완벽하게 구현하기 어렵습니다. 이를 보완하기 위해 개발된 오픈소스 HTML 프리프로세서 'Typeset'이 개발자들 사이에서 주목받고 있습니다.
Typeset은 전통적인 인쇄물에서나 볼 수 있었던 고급 타이포그래피 기법을 웹페이지에 적용해 주는 도구입니다. 주요 기능으로는 문단 가장자리의 따옴표나 문장부호가 바깥으로 튀어나오게 처리하는 행잉 구두점(hanging punctuation), 시각적 여백 정렬(optical margin alignment), 작은 대문자(small caps) 자동 감지, 부드러운 하이픈(soft hyphen) 삽입, 그리고 올바른 특수 구두점 치환 등이 포함되어 있습니다.
가장 눈에 띄는 장점은 성능과 호환성입니다. 클라이언트 사이드 자바스크립트를 전혀 사용하지 않으며, 사용되는 CSS 용량 역시 1KB 미만에 불과합니다. 변환 처리를 거친 HTML과 CSS는 스타일시트가 없는 환경이나 오래된 Internet Explorer 5 브라우저에서도 문제없이 작동하도록 설계되었습니다.
Node.js 환경에서 npm을 통해 손쉽게 설치할 수 있으며, CLI(명령줄 인터페이스)를 통해 직접 컴파일하거나 grunt, gulp 같은 빌드 도구의 플러그인으로 연동해 사용할 수 있습니다. 특정 CSS 선택자를 제외(ignore)하거나 특정 요소에만 적용(only)하는 옵션을 제공하며, 하이픈이나 합자(ligatures), 따옴표 등 개별 기능을 선택적으로 비활성화할 수도 있습니다.
이 프로젝트는 블로그 플랫폼 Blot을 위해 제작되었던 라이브러리 모음에서 출발해 현재 실제 프로덕션 환경에서 사용 중이며, CC0 라이선스로 퍼블릭 도메인에 공개되어 있어 누구나 자유롭게 활용할 수 있습니다.
Sponsored · 광고