Typography (nghệ thuật sắp chữ) không chỉ là chọn font đẹp — đó là cách bạn dùng chữ như một lớp hình trong bố cục: tạo cấp bậc thị giác, dẫn mắt người xem, và truyền tải tông cảm (từ tối giản đến sôi nổi) mà không cần thêm một nét vẽ tự do. Cùng tinh thần với Cơ sở tạo hình, chữ trên trang là điểm, đường, khối và không gian âm; cùng tinh thần với Điểm tập trung, tiêu đề là nam châm đầu tiên trong hierarchy.
Khi bạn vẽ tranh, chữ thường là phần “đi kèm” — tiêu đề poster, chữ ký, ghi chú trong sketchbook. Nhưng trong thiết kế đồ họa, poster, portfolio và editorial, chữ chiếm diện tích lớn và có vai trò như hình khối âm dương: cụm chữ đậm tạo một khối đậm; khoảng trắng (negative space) giữa dòng, chữ cái và lề tạo nhịp thở. Macro typography là bố cục cột, lề, đối xứng; micro typography là kerning từng cặp, rag hợp lý, tránh góa quả — hai tầng cùng quyết định cảm giác “sạch” hay “trật”.
Hiểu typography giúp bạn không lạc giữa hàng nghìn font trên mạng: bạn chọn theo chức năng (đọc lâu / bắt mắt tức thì), theo độ tương phản với nền (liên hệ Bố cục sắc độ khi chữ cần nổi trên nền phức tạp), và theo bối cảnh (sách, web, tường triển lãm).
A — Thuật ngữ cốt lõi
Typeface / FontHọ chữ / Bộ file
Typeface là thiết kế glyph; font là file cụ thể (Regular, Bold, Italic). License khác nhau cho web, app, in ấn.
HierarchyCấp bậc
Cỡ, đậm nhạt, màu, vị trí — mắt biết đọc gì trước. Thiếu hierarchy là thiếu “đạo diễn” cho trang.
Leading / Line height
Khoảng cách dòng; body tiếng Việt thường cần nhích cao hơn tiếng Anh thuần vì dấu cao.
Tracking / Kerning
Tracking: cả cụm; kerning: từng cặp (AV, To…) — cực quan trọng với chữ in lớn, logo, và chữ nghiêng.
Rag & rivers
Cạnh canh trái tự nhiên tạo “rag”; canh đều hai bên dễ sinh khe sáng dọc (rivers) nếu không chỉnh từ ngắt dòng.
Optical size
Một số họ có cut riêng cho cỡ nhỏ (caption) vs display — dùng đúng cut giúp nét thanh mảnh ở body và nét đậm ở poster.
Poster / Key visual — chữ lớn, ít dòng, đọc xa
Editorial / portfolio — nhiều cấp chữ, khối đọc dài
Một bố cục chữ tốt cho người xem ba tầng: (1) nhận ra chủ đề trong vài giây đầu — (2) đọc phụ đề, nhãn nhóm, metadata — (3) đọc thân bài nếu họ muốn đào sâu. Nếu mọi thứ cùng cỡ và cùng độ đậm, mắt không có điểm neo; nếu chỉ có tiêu đề to mà thân bài quá chật, người xem cảm giác “hét vào tai rồi thì thầm khó nghe”.
Kiểm tra nhanh: squint test (nheo mắt) — khối tiêu đề vẫn phải là vùng tương phản mạnh nhất về mật độ; phụ đề tách bậc rõ với đoạn văn. Cách này giống kiểm tra focal point trong tranh, chỉ áp dụng lên typographic massing.
Minh họa
Cấp bậc nhìn từ xa
Khi nheo mắt, tiêu đề vẫn phải là khối đậm nhất; phụ đề tách bậc rõ với đoạn văn. Đây là cách kiểm tra hierarchy trước khi in poster hay xuất PDF portfolio.
Cùng tinh thần với nguyên lý nhấn mạnh và tương phản trong Cơ sở tạo hình — chỉ áp dụng lên chữ và khoảng trắng.
Chữ đẹp là chữ đúng vai trong bố cục — không nhất thiết là chữ hoa mỹ nhất.
— Quan điểm editorialNguyên tắc an toàn: một font cho nội dung dài + một font cho tiêu đề / nhấn mạnh (có thể cùng họ với nhiều trọng lượng, hoặc sans + serif bổ trợ). Thêm font thứ ba chỉ khi bạn đã thành thạo cấp bậc, margin và luật nhịp. Với biến thể variable font, một file có thể phủ nhiều trục (weight, width) — vẫn nên giữ ít “giọng điệu” hình học trên một trang.
Trong poster mỹ thuật, chữ thường ngắn — có thể dùng display có cá tính mạnh; trong portfolio PDF, ưu tiên khả đọc và spacing đều đặn để giảng viên đọc không mỏi. Khi ghép serif + sans, thường chọn cùng thời đại cảm giác (cùng “kỷ nguyên” thiết kế) để tránh cảm giác ghép ngẫu nhiên.
Contrast cỡ
Ít nhất ~1.5–2 bậc giữa tiêu đề và body (vd body 11–12pt → tiêu đề 24–36pt) trừ khi brief tối giản cực đoan.
Giới hạn độ rộng dòng
Block text quá ngang khiến mắt mệt — chia cột, thu cột, hoặc tăng cỡ nhẹ thay vì kéo ngang full bleed.
Canh lề có chủ đích
Canh trái thân thuộc cho tiếng Việt dài; canh đều hai bên chỉ khi dòng đủ ít từ và bạn kiểm tra rivers.
Squint test
Nheo mắt: tiêu đề vẫn nhô ra nhất? Nếu không, tăng tương phản cỡ, weight, hoặc nền block.
Modular scale
Chọn một tỉ lệ (vd 1.25, 1.333) nhân từ cỡ cơ sở để sinh H1/H2/body/caption — ít quyết định tùy hứng hơn.
Baseline khi mix ảnh + chữ
Căn đáy dòng đầu tiên của đoạn với grid ảnh giúp spread editorial “đứng” dù có nhiều khối.
Modular scale là chuỗi cỡ chữ lấy từ một số cơ sở nhân theo tỉ lệ cố định — giúp các cấp H1, H2, quote, caption “bắt sóng” nhau thay vì mỗi khối một cỡ tùy hứng. Kết hợp với lưới cột và baseline (đường căn đáy chữ theo nhịp dọc), bạn kiểm soát được cảm giác editorial: các khối chữ và ảnh cùng “nhịp thở” dọc trang.
Trên web, baseline cứng toàn trang đôi khi xung đột với component động — khi đó hãy nhất quán ít nhất nhịp dọc theo section (padding section là bội số của 4px/8px) và giữ scale cỡ trong design token. Mục tiêu không phải ôm cứng luật sách in, mà là giảm entropy để người xem không bị mỏi.
Tốt cho khả đọc
Ưu tiên
- Leading đủ; tăng nhẹ cho tiếng Việt nhiều dấu
- Tương phản chữ — nền đạt WCAG khi là UI / web
- Hierarchy rõ bằng cỡ + weight + ít màu nhấn
- Ít font; margin/gutter đồng nhất theo grid
- Test đoạn văn thật thay vì chỉ “Lorem ipsum”
Dễ gây mệt
Tránh
- Quá nhiều decorative trong một spread
- Chữ nhỏ trên poster treo xa người xem
- ALL CAPS cho đoạn văn dài (mất hình dạng từ)
- Tracking âm quá mức trên body nhỏ
- Kéo dãn font không đồng tỉ lệ (trừ khi méo có chủ đích)
Tiếng Việt có dấu và thanh — font kém thiết kế làm dấu chồng, sát ascender, hoặc vỡ rhythm dòng. Khi chọn font, hãy kiểm tra đủ bộ ký tự và dán một đoạn văn thật (có ơ, ư, ă, dấu kép) ở mọi cỡ bạn dùng. Lưu ý chuẩn hoá Unicode (NFC vs NFD) có thể làm kerning khác nhau giữa app — nếu file in lệch dấu, thử chuẩn hoá trước khi gửi xưởng.
Trên poster triển lãm, test in hoặc mockup kích thước thật: chữ nhỏ trong file có thể mất khả đọc khi in A2/A0. Với chữ trên nền họa tiết, dùng nền tối/sáng tạm (knockout), viền mảnh, hoặc shadow có chủ đích — liên hệ trắng đen trước màu trong Bố cục sắc độ khi cần.
- Lập style sheet: H1/H2/body/caption + leading cho cả dự án
- Dùng grid hoặc baseline để các khối chữ căng hàng
- Tham chiếu poster / sách yêu thích và đếm bậc chữ + khoảng lề
- Embed / subset font khi gửi file in hoặc PDF portfolio
- Lưu master có layer “chỉ typography” để chỉnh nhanh khi đổi copy
- Kéo dãn font (scale không đồng tỉ lệ) trừ khi méo có chủ đích
- Outline quá mỏng trên nền họa tiết phức tạp
- Nhồi slogan dài trong khối hẹp — hãy rút copy hoặc tách cột
- Copy font trend không khớp nội dung / thương hiệu
- Quên kiểm tra dòng cuối trang (orphan) khi in multi-page
Hình họa
Bố cục màu
Trang trí màu
⭐ Điểm mấu chốt
Typography là bố cục của ngôn ngữ hiển thị — macro (lưới) + micro (kerning, rag).
Nắm hierarchy, spacing, scale và khả đọc tiếng Việt, bạn có thêm một lớp công cụ cho poster, portfolio và nhận diện cá nhân — song song với hình vẽ và màu.
Serif hay sans cho portfolio nghệ thuật?
Cả hai đều được. Sans thường hiện đại, sạch; serif mang cảm giác editorial. Quan trọng là đồng nhất trong toàn file và đủ khả đọc khi chữ nhỏ; có thể dùng sans cho body + serif chỉ cho tiêu đề.
Có cần mua font không?
Nhiều font Google Fonts / Adobe Fonts đủ cho học tập và portfolio cá nhân; dự án thương mại cần đọc license (web embedding, app, broadcast). Font trả phí thường có đủ weight, kerning và hỗ trợ ngôn ngữ tốt hơn.
Typography liên quan các bài Bố cục thế nào?
Chữ là các khối trong grid — xem thêm Điểm tập trung, Bố cục sắc độ và các bài nhóm Bố cục trong Thư viện để ghép hierarchy không gian với hierarchy chữ.
Luyện nhanh như thế nào?
Tái sắp layout một poster có sẵn chỉ bằng cỡ và weight; hoặc redesign typography cho một trang sách / bìa album; hoặc lấy một trang web và chỉ sửa type scale + leading, giữ nguyên nội dung.
Line height trên web có giống in không?
Gần như luôn cần lớn hơn một chút trên màn hình vì độ phân giải và khoảng cách mắt–màn; test trên điện thoại và desktop. Đo bằng cảm giác đọc 3 đoạn liên tiếp, không chỉ một dòng.
Có nên dùng nhiều style ALL CAPS?
ALL CAPS phù hợp nhãn ngắn, số hiệu, hoặc display; tránh cho đoạn dài vì mất hình dạng từ và khó đọc tiếng Việt có dấu. Nếu cần nhấn mạnh, dùng weight hoặc màu thay vì caps lock toàn khối.