본문으로 건너뛰기
피드

트럼프 행정부가 Calibri를 'woke 폰트'로 규정, 그리고 Atkinson Hyperlegible의 접근성 디자인

frontend 약 5분
vote
0
댓글
북마크

트럼프 행정부가 국무부 문서에 Times New Roman을 강제하면서 Calibri를 DEIA 프로그램이라 부른 사건을 계기로, 접근성을 진지하게 고민한 Atkinson Hyperlegible 폰트의 디자인 원칙을 상세히 소개.

  • 1

    Times New Roman 의무화로 접근성 후퇴와 재작업 비용 발생

  • 2

    Atkinson Hyperlegible은 저시력자를 위해 특화된 그로테스크 산세리프

  • 3

    역슬래시 제로, 꼬리 달린 l, 비대칭 g 등 모든 디자인 결정에 접근성 근거가 있음

  • 4

    최악의 사용 환경을 전제하고 설계된 폰트

Times New Roman 회귀

  • 트럼프 행정부가 국무부 전체 문서에 Times New Roman 사용을 의무화함. 루비오 국무장관은 Calibri를 "또 하나의 낭비적인 DEIA 프로그램"이라고 불렀음. 21세기에 디자인된 기능적인 산세리프 폰트가 "너무 캐주얼하다"는 이유임

  • Times New Roman은 공짜이긴 한데, 그 결과는 공짜가 아님. 정부 문서 전체를 재작업해야 하고, 접근성이 후퇴하고, 사용자 불편으로 더 비싼 서비스 채널 이용이 늘어나고, 평판 회복 비용까지 — "절약"보다 훨씬 비쌈. 그 모든 걸 감수하고 얻는 게 1931년 신문 조판의 미학적 위엄이라니

  • 서체 선택은 조용히 가치관을 인코딩하는 거임. 전통 vs 진보, 규정 준수 vs 사용성, 상징 vs 실제 경험 사이의 트레이드오프. 이 결정은 폰트가 아니라 "정책 결정에서 누가 고려되고 누가 안 되는가"에 관한 거라는 게 글의 핵심 논지임

Atkinson Hyperlegible — 접근성을 진지하게 고민한 폰트

  • Braille Institute에서 만든 폰트로, 2019년 첫 릴리스 후 2025년에 대규모 확장됨. "일반적인 접근성 폰트"가 아니라 저시력자(low vision)를 위해 특화된 폰트임. 스크린 리더 사용자가 아니라, 장애인이라고 인식하진 않지만 조용히 고군분투하는 사람들 — 예를 들어 고령 사용자 — 을 위한 거임

  • 그로테스크(grotesque) 산세리프 계열인데, "grotesque"가 "못생겼다"는 뜻이 아니라 "비고전적"이라는 의미임. 실용적이고 약간 어색한 특성이 오히려 접근성에 좋은 기반이 됨

  • 역슬래시 제로: 대부분의 슬래시드 제로는 대각선을 앞으로 긋는데, Atkinson은 뒤로 그음. 이유? 앞으로 긋는 슬래시가 노르딕 문자 Ø, ø, Đ, đ, 그리고 null 기호와 충돌하기 때문. 한 글리프로 5개의 국제적 혼동을 방지하는 우아한 해결책임

  • 꼬리 달린 소문자 "l": 시력이 떨어지면 높이 차이가 제일 먼저 사라짐. 흐릿하게 보면 긴 것과 짧은 것이 구분이 안 됨. 소문자 l에 작은 꼬리를 달아서 대문자 I와 절대 혼동되지 않게 함

  • 거만한 대문자 "I": 정통 그로테스크 폰트의 대문자 I는 얇고 절제되어 있는데, Atkinson의 I는 넓은 세리프를 달고 공간을 당당히 차지함. 우아한 비례 규칙을 다 깨지만, 1, l, |과 절대 헷갈리지 않음

  • 이중층 "a": 접근성 폰트의 교과서는 "단순하게, 단층 a를 써라"인데 Atkinson은 무시함. 본문에서 이중층 a가 인지적으로 더 익숙하고, 익숙하다는 건 읽는 데 힘이 덜 든다는 뜻임

  • 비대칭 "g": 대칭은 시력이 떨어지면 모호한 블롭으로 변함. g의 불균형한 보울과 과장된 관절은 일부러 비대칭으로 만든 거임. 깔끔한 글자들이 흐릿해져도 g는 자기 정체성을 유지함

  • 숫자가 무겁다: 같은 획 두께인데 숫자가 시각적으로 더 무거움. 금융 수치, 인증 코드, 참조 번호에서 흔들림이 없음. "이게 6인가 8인가" 불안 스파이럴이 없음

  • 최악을 전제한 자간: 사용자가 줄 높이를 바꾸고, 자간을 늘리고, 브라우저 설정에서 온갖 짓을 할 거라고 가정하고, 그래도 읽히게 설계됨. 대부분의 폰트는 이상적 조건을 위해 디자인되는데, Atkinson은 사용자의 현실을 위해 디자인됨

중요

> Atkinson Hyperlegible의 설계 철학: "보이지 않는 중립적 폰트"를 추구하는 현대 타이포그래피와 달리, 우아함보다 유용함을, 균일성보다 명확성을 택함. 할머니의 처방전 오독을 방지하려는 폰트임.

서체 하나에 이렇게 많은 접근성 고민이 들어갈 수 있다는 게 놀라움. 프론트엔드 개발자라면 폰트 선택의 의미를 다시 생각하게 될 글.

댓글

댓글

댓글을 불러오는 중...

frontend

요즘 픽셀 폰트가 그냥 복고 감성이 아닌 이유

1990년대 기기 화면 느낌을 현대 폰트 시스템으로 재해석한 픽셀 폰트 몇 가지를 소개한 글이다. 핵심은 예쁜 복고풍 글자 모양만이 아니라, 실제 제품에서 쓸 수 있게 기준선, 자간, 메타데이터, 세로 메트릭까지 챙기는지가 중요하다는 점이다.

frontend

HTML의 `<dl>`이 생각보다 쓸모 많은 이유

이 글은 HTML의 description list, 즉 `<dl>`, `<dt>`, `<dd>`가 단순 용어 사전용 태그가 아니라 이름-값 쌍 UI를 표현하는 꽤 강력한 시맨틱 도구라고 설명한다. 숙소 편의시설, 요금 내역, 기술 용어 설명, 게임 능력치표처럼 흔한 패턴을 중첩 `<div>` 대신 의미 있는 HTML로 만들 수 있다는 얘기다.

frontend

HTML을 캔버스 안에 넣는 데모 모음이 등장함

구글 크롬 랩스 저장소에 HTML-in-Canvas 관련 데모와 프레임워크 지원 목록이 정리됐다. Duck Hunt 스타일 폼, 흔들리는 버튼, 셰이더 기반 페이지 전환, 천처럼 매달린 폼 같은 실험적 예제가 포함돼 있고 Three.js와 PlayCanvas 쪽 샘플도 연결돼 있다.

frontend

싱글 페이지 앱이 웹을 너무 비싸게 만들었다는 불평

이 글은 싱글 페이지 앱(SPA)이 사용자 경험을 좋게 만든다는 명분 아래 웹의 초기 로딩 비용, 도구 복잡도, 개발 진입 장벽을 키웠다고 비판한다. 페이스북 로그인 페이지의 CSS 3.8MB, 레딧 몇 개 클릭 후 33MB 다운로드 같은 숫자를 들며, 지금의 프론트엔드 생태계가 사람보다 대기업의 요구에 맞춰져 있다고 주장한다.

frontend

네이티브로 끝까지 가려다 텍스트에서 막힌 macOS 개발자의 고백

20년 가까이 macOS와 iOS 네이티브 개발을 해온 작성자가 SwiftUI, AppKit, TextKit 2로 마크다운 채팅 UI를 만들다 결국 WebKit과 Electron 쪽이 훨씬 낫다는 결론에 도달한 글이다. 문제는 성능 하나가 아니라 선택, 스트리밍, 스크롤, 접근성, 텍스트 상호작용 같은 ‘사용자가 당연히 기대하는 기본기’가 네이티브 조합에서 계속 깨진다는 점이다.