Typography Thực Tế: Cách Biến Đổi Mọi Văn Bản Đẹp Hiệu Quả

“Typography là nghệ thuật và kỹ thuật sắp xếp chữ để khiến ngôn ngữ viết hiển thị rõ ràng, dễ đọc, và hấp dẫn.”
— Wikipedia

Này, đây là thời digital, và nếu bạn còn dùng font Arial hay Times New Roman kích cỡ 12px, nếu bạn vẫn còn VIẾT HOA in đậm in nghiêng gạch dưới vô tội vạ, nếu bạn còn dùng chữ trắng trên nền đen – chúng ta cần nói chuyện.

Hãy nói chuyện về Typography.

Typography là vấn đề thị giác của chữ: hầu hết mọi người đều không biết trình bày văn bản. Sách vở nặng nề, thuyết trình màu mè, diễn văn khô khan, bảng tính rườm rà, hồ sơ sơ sài. Chúng khiến người đọc bị nhức mắt. Nhức từ trái sang phải, nhức từ trên xuống dưới, nhức từ mở bài đến kết luận.

Nhưng bạn, thưa độc giả thân mến: bạn có sức mạnh để thay đổi điều đó!

Chỉ với chút thời gian tìm hiểu và nỗ lực tối thiểu, bạn có thể là người được khen mỗi khi người ta cầm văn bản bạn soạn: “Chàng/nàng ta trình bày văn bản đẹp nhất công ty”. Typography tốt khoác một lớp ngoài chỉn chu cho thông điệp của bạn giữ được sự chú ý và thuyết phục được người đọc.

Tất cả những gì bạn cần làm là làm theo những quy tắc sau và chuẩn bị đón nhận những cái vỗ vai tán thưởng nồng nhiệt.

Bỏ qua các quy tắc này, cẩn thận, thì người đọc sẽ muốn săn lùng bạn và đập bạn nhừ tử với cái máy đánh chữ.

Typography Tốt Là Gì?

Chữ là để truyền đạt ý. Ý có thể là thông tin (Lớp học bắt đầu lúc 09:00), hướng dẫn (Học viên đến lớp bằng chong chóng tre), cảnh báo nhắc nhở (Học viên phải trên 18+ mới được vào lớp). Trong mọi trường hợp, typography tốt hỗ trợ và tăng cường thông điệp. Typography tốt khiến cho chữ hiệu quả hơn.

Có ba mệnh đề từ đó:

1. Ty­pog­ra­phy tốt được đo bằng khả năng tăng cường ý nghĩa của chữ, chứ không phải thang đo n vòng nhan sắc.
2. Cho một đoạn chữ, có nhiều giải pháp typography tốt ngang ngửa nhau. Typograpy không phải là vấn đề toán học chỉ có một lời giải đúng. Lựa chọn typography hiệu quả cho chữ này có thể không hiệu quả với chữ kia.
3. Khả năng tạo typography tốt phụ thuộc vào bạn hiểu mục tiêu của ý chữ đến đâu, không phải dựa trên gu nghệ thuật hay mắt thiết kế của bạn. Nếu bạn hiểu sai mục đích của văn bản thì typography chỉ là trò chơi may rủi.

Ty­pog­ra­phy là phần thị giác của chữ, nhưng đây không phải cuộc theo đuổi đến tận cùng mỹ thuật. Typography chính là về tính hữu dụng, cho nên đây là một kỹ năng rèn luyện được. Typography nhìn đẹp mắt, nhưng không củng cố ý của chữ, là thất bại. Typography củng cố ý của chữ, dù không đẹp mắt, là thành công.

Ví dụ như bảng đường và biển tốc độ sau.

Bảng đầu nhìn đẹp hơn bảng sau. Nhưng bảng đầu thất bại. Bảng sau thành công.

Những Quy Tắc Typography

“Tôi thích đọc một văn bản trình bày luộm thuộm, hỗn độn, và xấu xí.”
– Chưa ai từng nói

Dành cho người phàm như bạn và tôi, hãy đọc Webook Practical Typography của tác giả Matthew Butterick. Ông lấy bằng thiết kế và typography ở Đại Học Harvard và lấy bằng luật ở Đại Học California. Cuốn sách miễn phí trên của ông là tài liệu duy nhất một người không có mắt thiết kế cần tham khảo cho mọi vấn đề về typography. Bạn có thể ủng hộ tác giả bằng cách mua các font của ông, nhưng lưu ý là chúng không hỗ trợ tiếng Việt.

Nếu bạn theo 5 quy tắc typography đầu tiên dưới đây, bạn sẽ là một typographer tốt hơn 95% người viết chuyên nghiệp và 70% người thiết kế chuyên nghiệp. Những quy tắc còn lại sẽ nâng bạn tốt hơn 99% ở cả hai thế giới.

Để xem cách thiết lập các quy tắc trên trong Word, Mac hay Web, hãy xem chi tiết tại: http://practicaltypography.com/

Phù. Bạn nhớ hết chứ? Nếu bạn phải xử lý văn bản như cơm bữa thì hãy dán các quy tắc trên ra lên bàn. Chúng sẽ khiến đồng nghiệp phải há hốc mồm, sếp phải gật gù, và khách hàng phải xuýt xoa.

Những điều tốt đẹp sẽ đến khi bạn thuần thục các quy tắc trên như một thói quen. Tôi đã có cơ hội hỗ trợ các tiến sĩ, khoa học gia, tác giả sách, quản lý cấp cao thay đổi bộ mặt những văn bản quan trọng của họ. Tôi đã áp dụng chúng từ thiết kế website, sách, văn bản công ty, bảng tính spreadsheet, thuyết trình, đến hồ sơ xin việc.

Giờ đây typography là kỹ năng bắt buộc cho mọi trợ lý của tôi như một phần của làm việc chuyên nghiệp.

Những Ứng Dụng Kỳ Diệu của Typography

Bạn đã đọc từng quy tắc typography lẻ, giờ là lúc kết hợp mọi thứ lại.

Không cần phải đầu tư tốn kém để tạo hiệu ứng “mắt chữ A mồm chữ O” cho văn bản. Đa số ví dụ dưới đây đều được thực hiện bởi Microsoft Word, chứ không cần đến Photoshop hay InDesign.

Hãy xem các ứng dụng kỳ diệu của typography.

1. Tài Liệu Nghiên Cứu

Bố cục tài liệu trong các tổ chức thời nay vẫn còn dấu ấn của thói quen đánh máy chữ ngô nghê xa xưa. Chúng hết hợp thẩm mỹ rồi. Hãy áp dụng những tối ưu cơ bản như lề lớn hơn, kích cỡ điểm nhỏ hơn, khoảng cách dòng chật hơn.

Trước

1. Lề trang quá nhỏ, độ dài dòng quá rộng
2. Kích cỡ điểm quá lớn.
3. Khoảng cách dòng quá rộng.
4. Times New Ro­man—ngao ngán.
5. Quên dùng khoảng trắng giữa các câu.
6. Thụt lề đầu dòng quá sâu.
7. Canh chữ đều mà không bật tách từ.
8. Gạch dưới ở các thẻ tiêu đề.

Sau

1. Lề trang lớn hơn; độ dài dòng ngắn hơn (khoảng 65 ký tự mỗi dòng).
2. Kích cỡ điểm nhỏ hơn.
3. Giảm khoảng cách dòng.
4. Font tốt hơn.
5. Một khoảng trắng giữa các câu.
6. Bật tách từ.
7. Không gạch dưới.

2. Thư Từ

Không phải mọi thứ trên trang đều quan trọng như nhau. Một tài liệu có tiền cảnh – chứa những gì quan trọng nhất, và hậu cảnh – chứa những thứ còn lại. Hãy để những thứ nổi bật lên trước, phần nền chìm phía sau.

Trước

1. Chữ thân có nguy cơ bị nghiền nát bởi khung địa chỉ khổng lồ.
2. Độ dài dòng quá rộng; lề trang quá nhỏ.
3. Thụt dòng đầu tiên và khoảng trắng giữa các đoạn không cần được áp dụng áp dụng cùng nhau.
4. Font hệ thống (Ver­dana) tối ưu cho màn hình lại dùng cho tài liệu in.
5. Quá nhiều chữ ở trung tâm.
6. Quá nhiều không gian lãng phí ở lề trên.
7. Thiết kế tổng thể trông phô trương.

Sau

1. Khung địa chỉ & chữ thân được đặt font dễ đọc và phù hợp hơn.
2. Chữ thân được bố trí nhiều không gian trực quan hơn khung địa chỉ, kết nối chặt chẽ giữa tiền cảnh-hậu cảnh.
3. Chữ cái bắt đầu ngay trên trang.
4. Bố cục 2 cột đơn giản, gọn gàng hơn.
5. Không để chữ ở trung tâm.
6. Triệt tiêu tính phô trương.

3. Hồ Sơ Ứng Tuyển

Điểm dở lớn nhất của hồ sơ ứng tuyển là chúng dày đặt chữ ơi là chữ. Huyền thoại là một hồ sơ ứng tuyển PHẢI dài một trang mới chuẩn. Nhưng bạn có thể tránh dày đặt chữ bằng cách sử dụng trang thứ hai.

Trước

1. Lề trang quá nhỏ, độ dài dòng quá lớn.
2. Chữ thân dùng font hệ thống (Calibri).
3. Tiêu đề và các hộp xám quá lớn so với chữ thân.
4. Thông tin quan trọng – ở đâu và khi nào, bị chôn vùi.
5. Ký hiệu danh sách xấu xí.

Sau

1. Lề trang lớn hơn, độ dài dòng nhỏ hơn.
2. Cal­ibri được thay bằng font Eq­uity và Con­course.
3. Thẻ tiêu đề không còn bá chủ trên trang.
4. Tên trường và người thuê dễ thấy.
5. Ký hiệu danh sách nhẹ mắt hơn.
6. Thông tin kém quan trọng được dời vào trang sau.

4. Danh Thiếp

Danh thiếp phải chứa nhiều thông tin vừa vặn trong một khu vực nhỏ gọn. Nhưng chúng thường cố đạt quá nhiều mục tiêu cùng lúc. Hãy co cụm và đơn giản hóa lại.

Trước

1. Font ngố được dùng cho tên. Font xấu (Cop­per­plate) được dùng cho chữ.
2. Kích cỡ điểm của tên quá lớn.
3. Không để khoảng cách chữ cái ở chữ hoa.
4. Có quá nhiều thông tin, bị dồn vào góc.

Sau

1. Font Equity cho toàn văn bản.
2. Kích cỡ điểm hợp lý và nhất quán hơn.
3. Khoảng cách chữ được thêm vào chữ hoa nhỏ.
4. Đơn giản hóa bố cục văn bản.
5. Loại bỏ tính phô trương.

5. Các Bảng và Cột

Canh theo chiều dọc là mấu chốt. Với các bảng số, tính logic ty­po­graphy phải theo tính logic toán học. Nếu không, ty­pog­ra­phy của bạn vô hình chung gây hiểu nhầm hay rối rắm cho người đọc về ý nghĩa những con số.

Trước

1. Những con số canh chưa chuẩn.
2. Bảng màu rực rỡ.
3. Lề ô trong bảng quá sát.
4. Đường kẻ và đường viền lề dày không cần thiết.
5. Khoảng cách dòng không đồng đều.
6. Font hệ thống vụng về (Calibri).

Sau

1. Số hóa đơn (số danh định) canh bên phải.
2. Giá trị tài sản ròng (số lượng) có ký tự tiền tệ, dấu phẩy, và đơn vị lẻ. Chúng được canh ở bên phải nên đơn vị lẻ và đồng dollar thẳng hàng. Nếu số lượng nằm giữa 0 và 1 thì chèn thêm một số 0 đằng sau để rõ ràng.
3. Trọng lượng cần canh với tab thập phân để giá trị đồng và lượng tiền tệ cũng thẳng hàng.
4. Zip code cần được canh trái, để những zip code 5 và 9 ký tự thẳng hàng. (Số điện thoại cũng cần canh phải.)
5. Loại bỏ viền và màu sắc không cần thiết.
6. Chỉnh lại khoảng cách dòng.
7. Font tốt hơn (Concourse).

6. Bài Thuyết Trình

Ít ai mách bạn gợi ý đơn giản và hiệu quả nhất về cách thiết kế một bài thuyết trình. Cân nhắc điều kiện chiếu sáng của người xem.

1. Tắt hết ánh sáng, để không gian làm việc tối lại, chỉ cho phép một luồng sáng đến từ màn hình máy tính của bạn. Thấy sáng cỡ nào chưa?
2. Để nền đen trơn trong bài thuyết trình.
3. Để chữ hao ít photon nhất có thể, hãy dùng font sans serif.
4. Về màu font, sắc trắng trơn đặt giữa nền đen có thể mang đến độ tương phản nhức mắt. Do đó cần bắt đầu dùng font với mức xám 50% và cho sáng dần lên. Khi nào vừa mắt thì ngừng lại. Font càng mỏng thì càng cần độ sáng.
5. Chọn một kích cỡ điểm cơ bản để vừa 12- 15 dòng văn bản trên màn hình. Dùng cùng kích cỡ điểm này cho tất cả slide – ngay cả khi trên slide chỉ có một dòng.
6. Các quy tắc typographic khác vẫn áp dụng vào. Hạn chế dùng màu, nếu dùng thì màu nhạt thay vì màu sáng. Tránh dùng chữ canh giữa.

Trước

1. Hình chữ nhật khủng màu trắng.
2. Font xấu vãi.
3. Kích cỡ điểm quá lớn.
4. Khoảng cách dòng quá chật.
5. Tiêu đề màu cam được canh giữa.

Sau

1. Hình chữ nhật đen nhẹ.
2. Font chuẩn hơncó màu xám nhạt.
3. Giảm kích cỡ điểm; tăng khoảng cách dòng.
4. Tiêu đề không canh giữa và tô màu cam.
5. Nhiều “khoảng trắng” hơn (trong trường hợp này thực sự là khoảng đen).

Nếu bài thuyết trình của bạn không được trình chiếu trong phòng tối, thì vấn đề màu sắc không phải lo. Nhưng bạn vẫn nên tránh dùng chữ đen trơn trên nền trắng trơn. Dùng nền xám nhạt, hoặc chữ xám nhạt, sẽ giảm độ tương phản và tăng tính dễ đọc.

7. Website

Tôi đã thiết kế website www.greatsun0.com, www.ngungtromuocmo.org, www.hocpiano.org đơn giản nhưng vẫn bắt mắt nhờ sử dụng các quy tắc typography trên.

Trước

1. Kích cỡ điểm nhỏ cho chữ thân (mà không làm thay đổi kích thước cửa sổ)
2. Các tiêu đề khổng lồ, bôi màu xám rườm rà.
3. Mọi font đều là font hệ thống—Ar­ial, Tre­buchet, và
4. Link liên kết điều hướng chi phối tiền cảnh; chữ thân chìm xuống hậu cảnh.
5. Bố cục ngập tràn hình chữ nhật màu mè—chữ nhật xanh lá lớn để phía bên trái, và ở phía dưới trang, chữ nhật nào là hồng, xanh, xám, vàng, và cả hai sắc tím chữ.

Sau

1. Kích cỡ điểm lớn hơn dành cho phần chữ văn bản (thay đổi phù hợp với kích thước cửa sổ làm việc). Các thẻ tiêu đề nhỏ hơn những vẫn phải rõ ràng.
2. Font chuẩn hơn (Eq­uity, Con­course, và Trip­li­cate).
3. Điều hướng bớt khoa trương và tích hợp vào phần chữ thân.
4. Hình chữ nhật có màu dùng hạn chế để chỉ những phần đặc biệt.
5. Tận dụng thoải mái các khoảng trắng.

8. Email

Trong email, lựa chọn của bạn bị giới hạn. Không giống như PDF, các font không được giữ nguyên trong e-mail. Người nhận sẽ không thấy font bạn dùng trừ phi máy họ có cài sẵn font đó. Hơn thế, người nhận đọc email trên nhiều thiết bị khác nhau có cách ứng dụng typography khác nhau.

Cho nên, typography vẫn áp dụng trong email, nhưng bỏ qua các quy tắc về lựa chọn font.

Font: Lựa Chọn Quan Trọng Nhất Trong Typography

Font xứng đáng được dành riêng một đoạn vì tầm quan trọng bậc nhất Đế Vương của nó trong Typography.

“Làm sao mình giỏi phối font trong văn bản hơn?”

Bạn thân mến, phối hợp font cũng giống như phối hợp suit và cravat – không có quy luật bất biến nào. Vài người khéo, vài người không.

Nhưng nhớ những nguyên lý sau:

1. Phối hợp font là một lựa chọn, không phải là yêu cầu. Bạn có thể vắt nhiều lợi ích chỉ từ một font bằng cách sử dụng các biến thể dựa trên kích cỡ điểm, in đậm hay in nghiêng, chữ hoa nhỏ, vâng vâng.
2. Ít hơn là nhiều hơn. Hầu hết văn bản có thể chấp nhận font thứ hai; số ít có thể chấp nhận font thứ ba; hiếm có thể chấp nhận từ font thứ tư trở lên.
3. Bạn có thể phối bất kỳ hai font nào nhìn khác biệt rõ rệt với nhau. Cũng như phối màu, độ tương phản thấp giữa các font có thể hiệu quả hơn độ tương phản cao.
4. Phối hợp font thành công nhất khi mỗi font có một vai trò thống nhất trong văn bản. Thử font này cho thân chữ và font kia cho tiêu đề. Thử font này cho những chữ ở giữa tài liệu (thân chữ và tiêu đề) và font kia cho những chữ ở rìa (chỉ mục, ghi chú, trích dẫn, footer). Thử font này cho các ký hiệu danh sách và font kia cho tên danh sách.
5. Dùng nhiều font trong cùng một đoạn văn hiếm khi nào hiệu quả. Hãy giới hạn mỗi đoạn văn một font, và đổi font ở dấu ngắt đoạn.

“Có Bao Nhiêu Loại Font?”

Số liệu font nhiều như sao trên trời. Khi làm việc thuê ngoài cho sáng lập viên của trang font thương mại www.hypefortype, tôi đã có thời gian bơi trong dữ liệu của hơn 3,700 fonts.

Chung quy font được chia thành 5 nhóm chính:

1. Serif là loại chữ có chân, nên được dùng cho body text của văn bản in như sách và báo, và cả văn bản số. VD: Cambria, Adobe Caslon Pro.
2. San Serif là loại chữ không chân, nên được dùng cho body text của văn bản số. VD: Arial, Walkway.
3. Monospace là loại chữ mà độ rộng của các con chữ là bằng nhau tạo cảm giác tròn và đều, chỉ nên dùng trong trường hợp đặc biệt như các dòng code. VD: Monospace, Lucida.
4. Script là loại chữ như chữ được viết tay, chỉ nên dùng cho trường hợp đặc biệt như tạo chữ ký. VD: Script, Palace Script.
5. Fantasy Decoration là loại chữ có hình thù đặc biệt, thường là các hình dạng như đồ vật, con người, hoa văn, nhân vật hoạt hình, rất hiếm xài. VD: Windesign.

“Mình nên dùng font chuyên nghiệp nào?”

Mỗi font hệ thống dưới đây đều mang trong mình một quá khứ đen tối của ăn cắp ý tưởng, độc quyền tập đoàn, và định kiến cổ lổ sĩ. Nhưng tôi sẽ tha cho bạn bài học lịch sử và thả cho bạn một danh sách các font thay thế lý tưởng.

Hãy cài đặt những font sau thay thế cho font mặc định.

• Helvetica/Arial (trung tính): Concourse, Atlas, Neue Hass Grotesk, Frutiger.
• Calibri (trung tính): Concourse, FF Unit, Fira Sans, Whitney.
• Minion (trung tính): Equity, Verdigris, Lyon, Harriet.
• Times new Roman (chữ thân): Equity, Tiempos, Starling, Plantin.
• Palatino (chữ thân): Palatino Nova, Iowan Old style, Verdigris, Bembo Book.
• Georgia (màn hình, không in): Miller, Equity, Harriet, Ingeborg.
• Verdana (màn hình, không in): Concourse, Alright Sans, Amplitude, Colfax.
• Cambria (đơn cách): Guardian, Elena, Charter, FF Tisa, Source Serif Pro.
• Courier (đơn cách): Triplicate, Pitch, Source Code Pro, Nitti.

 “Nếu phải dùng font hệ thống thì mình nên dùng nào?”

Người viết chuyên nghiệp cần font chuyên nghiệp. Nhưng nếu bạn bị giới hạn với các font hệ thống, hãy xem bảng dưới sau và lựa chọn khôn ngoan.

Với văn bản in, fonts hạng A là tốt nhất. Với văn bản số, fonts hạng A, B, C cũng được. Nhưng tránh xa font hạng F. Fonts dùng tốt chữ thân được đánh dấu ★. Những font khác thì dùng cho mục đích đặc biệt như tiêu đề, ghi chú.

Hạng A: Chơi được

Hạng B: OK ở liều lượng hạn chế

Hạng C: Đáng Nghi Ngờ

Hạng F: Nhức Mắt

Typography Là Kỹ Năng Hơn Là Nghệ Thuật

Typography có phải là nghệ thuật không? Tôi đã thấy những nghệ nhân sắp chữ với ý tưởng và kỹ thuật nâng typography lên hàng tác phẩm nghệ thuật. Nhưng về cốt lõi, typography thực hiện chức năng thực tế là “tạo hình cho ý”. Tính mỹ thuật là riêng. Trở thành một người typographer hiệu quả đòi hỏi kỹ năng tốt hơn là có gu tốt.

Cho người phàm như bạn và tôi, đây là sự biến đổi kỳ diệu và nhanh nhất trong thiết kế.

Bạn đã áp dụng typography như thế nào?

Tài Liệu & Công Cụ

Practical Typography: Cuốn sách duy nhất về typography bạn cần đọc. Ngấu nghiến webbook miễn phí này đã giúp tôi nâng trình thiết kế mọi văn bản lên một tầm cao mới.

Google Vietnamese Font: Tìm hiểu các google font hỗ trợ tiếng Việt và các cách phối trộn font với nhau.