Typography tạo nên bản sắc thương hiệu như thế nào

Author: Kody Anh Nguyen

2026-10-28 · 63 phút đọc

Typography là việc thiết kế và sắp xếp chữ để trình bày hoặc tái hiện nội dung, bao gồm lựa chọn hình dáng chữ, kích thước, khoảng cách và cách tổ chức chúng trên trang giấy hay màn hình. Tuy thường gắn với ngành in, typography ngày nay còn hiện diện trên website, điện thoại, bao bì và bảng hiệu, nơi bố cục phải thích ứng với khoảng cách nhìn, khổ trình bày và lượng thông tin khác nhau.

Trong nhận diện thương hiệu, typography tạo ra một đặc điểm thị giác được lặp lại để tổ chức thể hiện tên gọi và nội dung truyền thông của mình. Chữ viết liền nét của Coca-Cola, các hình dáng mang tính hình học của Google và những họ chữ có liên hệ với nhau trong IBM Plex cho thấy những cách giải quyết khác nhau: tên thương hiệu cố định có thể được vẽ thành một bố cục riêng, còn một họ chữ dùng lại phải phục vụ nhiều từ ngữ, ngôn ngữ và điều kiện đọc. Muốn hiểu sự khác biệt này, cần xem mỗi thiết kế được tạo ra để làm gì, thay vì gán sẵn một tính cách cho mọi kiểu chữ trong cùng một nhóm.

Typography và nhận diện thị giác

Thương hiệu là bản sắc gắn với một tổ chức, sản phẩm hoặc dịch vụ, còn nhận diện thị giác gồm những yếu tố nhìn thấy được dùng để thể hiện bản sắc đó, như biểu tượng, màu sắc, hình ảnh và chữ. Logo là một hình ảnh nhận diện; nếu logo chủ yếu được tạo từ tên gọi đã qua thiết kế, nó thường được gọi là wordmark, hay logo chữ. Những khái niệm này chỉ các phần có liên quan với nhau, chứ không phải nhiều tên gọi của cùng một thứ: dòng chữ trên chai có thể là logo chữ, trong khi màu sắc và cách trình bày chữ lặp lại trên bao bì thuộc về hệ thống nhận diện rộng hơn.

Typography còn tổ chức thông tin thông qua phân cấp thị giác, tức mức độ nổi bật tương đối giữa các thành phần trong bố cục. Trên áp phích sự kiện, tên chương trình, đơn vị tổ chức, thời gian và địa điểm có thể được phân biệt bằng cỡ chữ, độ đậm, vị trí và khoảng trống xung quanh, để tên chương trình nổi bật còn thông tin cần thiết được gom thành một nhóm riêng. Trong ví dụ giả định “Short Film Night” bên dưới, hai phiên bản chứa cùng một nội dung, nhưng bố cục bên phải giao vai trò thị giác khác nhau cho tiêu đề và các chi tiết bổ trợ.

![Hai áp phích giả định của câu lạc bộ phim có cùng nội dung; một bản nhấn mạnh mọi dòng như nhau, bản còn lại phân biệt đơn vị tổ chức, tên chương trình, ngày giờ, địa điểm và thông tin vào cửa.](/blog/u4b9q1sz.svg)

Hình 1. Cùng năm dòng nội dung được trình bày bằng IBM Plex Sans. Bản bên trái nhấn mạnh các dòng như nhau; bản bên phải làm nổi bật tên chương trình và gom thông tin cần thiết phía dưới. Đây là ví dụ giả định do tác giả thực hiện, chưa được thử nghiệm với người xem. Có thể bấm vào từng hình trong bài để mở bản kích thước đầy đủ.

Ví dụ này tách biệt hai quyết định thường bị nhầm lẫn khi mới học thiết kế: chọn hình dáng chữ và sắp xếp thông tin mà chữ truyền tải. Kiểu chữ phù hợp cung cấp các hình dáng, còn bố cục xác lập mức độ quan trọng giữa chúng; cả hai đều không thể bù cho thông tin bị thiếu. Khi một câu lạc bộ ở trường làm áp phích, vé và thông báo trên điện thoại, cách trình bày tên được lặp lại có thể giúp nhận ra đơn vị tổ chức ở cả ba định dạng, trong khi chi tiết sự kiện được sắp xếp theo diện tích có sẵn. Vì vậy, tính nhất quán dựa vào những mối quan hệ được duy trì giữa các thành phần, bên cạnh việc dùng lại tên font.

Kiểu chữ, font và hình dáng ký tự

Kiểu chữ, hay typeface, là thiết kế của chữ cái, chữ số và các ký tự khác, chẳng hạn IBM Plex Sans; còn font là phiên bản có thể sử dụng của thiết kế đó, thường được cung cấp dưới dạng tập tin chứa một kiểu cụ thể. Trong cách nói hằng ngày, hai từ này thường được dùng thay thế cho nhau, nhưng sự phân biệt sẽ hữu ích khi tải font hoặc chọn kiểu: một kiểu chữ có thể gồm nhiều thiết kế liên quan, trong khi một tập tin tải về có thể chỉ cung cấp một kiểu trong số đó. Họ chữ tập hợp những kiểu có liên hệ với nhau, như thường, đậm và nghiêng, với các đặc điểm chung giúp chúng sử dụng được cùng nhau [1].

Các đường tạo nên một chữ được gọi là nét, còn độ dày tương đối của nét được gọi là độ đậm, hay weight. Kiểu mảnh và kiểu đậm khác nhau về độ dày nét; kiểu nghiêng còn có thể thay đổi hình dáng cơ bản của chữ, bên cạnh việc tạo độ nghiêng. Một hình dáng ký tự cụ thể được gọi là glyph, có thể thể hiện chữ cái, chữ số, dấu câu hoặc một ký tự khác. Những khái niệm này giải thích vì sao một họ chữ cần nhiều hơn bảng chữ cái: dấu câu, chữ số và các kiểu sẵn có cũng phải đáp ứng nội dung được trình bày [1].

Có thể nhận ra ba nhóm lớn qua cấu tạo của chữ:

Nhóm thiết kếĐặc điểm hình dángVí dụ trong các hình
Chữ có chân, serifCó nét nhỏ ở đầu hoặc cuối các nét chínhIBM Plex Serif
Chữ không chân, sans-serifKhông có những nét kết thúc đó; “sans” có nghĩa là “không có”IBM Plex Sans và Google Sans
Chữ mô phỏng viết tay, scriptHình dáng bắt nguồn từ chữ viết tay, đôi khi nối liền với nhauChữ vẽ trong logo Coca-Cola

Các nhóm này mô tả đặc điểm cấu tạo, chứ không quy định ý nghĩa hoặc chất lượng. Một thiết kế có chân có tạo cảm giác trang trọng hay không, hoặc một thiết kế không chân có rõ ở cỡ nhỏ hay không, còn tùy hình dáng cụ thể và cách sử dụng. Chữ đơn cách, hay monospaced, mô tả một thuộc tính khác: mỗi ký tự được dành cùng một khoảng ngang, nên chữ i chiếm chiều rộng bằng chữ M. Với chữ có độ rộng thay đổi theo ký tự, khoảng ngang được phân bổ tùy hình dáng; IBM Plex có cả hai cách, giúp quan sát sự khác biệt về nhịp khoảng cách trong một nhóm thiết kế có liên hệ với nhau [2].

Cấu tạo chữ và kích thước nhìn thấy

Khoảng trống được bao quanh bởi các nét chữ gọi là counter, chẳng hạn phần bên trong chữ o; những chữ như e còn có một phần mở ra ngoài. Các khoảng trống này là thành phần của thiết kế vì tỷ lệ của chúng ảnh hưởng đến hình dáng nhìn thấy, nhất là khi chữ nhỏ hoặc đậm. Phần lớn chữ nằm trên một đường chân chữ, hay baseline, tưởng tượng; chiều cao của chữ x thường tính từ đường đó gọi là x-height, mô tả chiều cao thân chính của chữ thường mà không tính phần vươn cao của h hoặc phần kéo xuống của p [3].

![Các chữ thật Hoxp của IBM Plex thể hiện đường chân chữ, chiều cao chữ x thường và khoảng trống trong o; bên dưới là Ag ở kiểu có chân và không chân.](/blog/r6n2v8jf.svg)

Hình 2. Nét chữ thật của IBM Plex cùng các đường hướng dẫn. Đường x-height được tính từ đường viền của chữ x trong font. Các ví dụ phía dưới thể hiện nét chân ở Serif và sự vắng mặt của nét này ở Sans. Hình giải thích do tác giả thực hiện.

Kiến thức về cấu tạo chữ giúp diễn tả chính xác những điều dễ bị nhận xét chung chung. Một dòng có thể trông chật vì khoảng trống trong chữ bị thu hẹp, vì thân chữ thường tương đối lớn, hoặc vì khoảng cách giữa các dòng chưa đủ. Ngược lại, hai font đặt cùng một cỡ chữ trong phần mềm vẫn có thể trông lớn nhỏ khác nhau, do con số đó dựa trên hệ thống đo tổng thể chứ không phải chiều cao nhìn thấy của từng chữ. Vì vậy, so sánh nội dung thật ở cỡ dự định sử dụng sẽ cho nhiều thông tin hơn việc chỉ đặt hai font cùng một con số trong ô chọn cỡ chữ [3].

Chữ vẽ trước thời con chữ dùng lại

Lịch sử hình dáng chữ bắt đầu trước lịch sử font. Các hệ thống chữ viết cho phép ghi lại ngôn ngữ bằng ký hiệu nhìn thấy được, còn hình dáng ký hiệu thay đổi theo công cụ, vật liệu và cộng đồng sử dụng. Bảng chữ cái Latin trong những tên tiếng Anh được bàn đến ở đây phát triển qua một chuỗi bảng chữ cái có liên hệ, gồm các tiền thân Hy Lạp và Etruscan; những hệ thống chữ viết khác có lịch sử riêng. Nghiên cứu về các văn khắc chữ cái thời kỳ đầu xác định những bước phát triển quan trọng vào thiên niên kỷ thứ hai trước Công nguyên, rất lâu trước máy in hoặc tập tin trên máy tính [4].

Lettering thường chỉ việc vẽ chữ cho một bố cục cụ thể, còn thư pháp, hay calligraphy, tạo hình chữ bằng những chuyển động có kiểm soát của công cụ viết. Cả hai đều có thể ảnh hưởng đến thiết kế kiểu chữ, nhưng một tên gọi được vẽ riêng và một bảng chữ cái dùng lại đặt ra yêu cầu khác nhau. Người vẽ chữ có thể sửa một nét nối cho vừa một từ, trong khi người thiết kế kiểu chữ phải dự tính cả những tổ hợp chưa được viết ra. Chữ Coca-Cola ở phần sau là ví dụ về một bố cục riêng bắt nguồn từ truyền thống viết tay.

Việc làm bản thảo cũng đòi hỏi lựa chọn theo mục đích sử dụng. Người chép sách thời Trung cổ dùng những lối chữ khác nhau cho sách trang trọng và cho văn bản cần viết nhanh. Trong lối chữ trang trọng gọi là textura, phổ biến ở bản thảo châu Âu từ thế kỷ XIII đến XV, chữ được cấu tạo bằng các nét riêng với nhiều lần nhấc bút; những lối viết thảo cho phép chuyển động liên tục hơn. Sự khác biệt này giải thích vì sao chữ trong tài liệu lịch sử có thể góc cạnh, dày đặc hoặc nối liền: cấu tạo của chúng thể hiện cả quá trình viết lẫn lựa chọn về hình thức [5].

Con chữ rời và hệ thống in của Gutenberg

Kỹ thuật in cho phép chuyển dấu từ một bề mặt đã chuẩn bị sẵn, thay vì viết riêng trên từng bản. Với in mộc bản, cả trang có thể được khắc vào một khối gỗ, phủ mực rồi ép lên giấy. Chữ rời chia nội dung thành các ký tự có thể dùng lại, được sắp cho văn bản này rồi tháo ra để sắp cho văn bản khác. Hướng dẫn lịch sử của Đại học Bang Florida xác định công việc về chữ rời của Bi Sheng, thường được gọi là Tất Thăng trong tiếng Việt, ở Trung Quốc vào khoảng 1041–1048, trước công việc của Gutenberg ở châu Âu vài thế kỷ [6].

Chữ rời bằng kim loại cũng xuất hiện trước Gutenberg. Quyển thứ hai còn lưu giữ của sách Phật giáo Triều Tiên Jikji, được in tại chùa Heungdeoksa ở Cheongju năm 1377 và hiện thuộc Thư viện Quốc gia Pháp, là cuốn sách cổ nhất còn tồn tại được biết đến là in bằng chữ rời kim loại. Nhận định này nói về chứng cứ còn lưu lại, không có nghĩa là kỹ thuật in bằng chữ kim loại chưa từng xuất hiện sớm hơn [7].

Đóng góp của Johannes Gutenberg là phát triển một hệ thống sản xuất có thể vận hành ở châu Âu, tại Mainz vào khoảng giữa thế kỷ XV. Thiết bị của ông kết hợp con chữ kim loại dùng lại, phương pháp chế tạo chúng với số lượng lớn, mực phù hợp và máy ép. Cần xem đây là một hệ thống, vì một bộ chữ kim loại sẽ ít hữu dụng nếu thiếu cách đúc, sắp chữ, phủ mực và ép in ổn định [8].

Trong quá trình đúc, một chữ nổi được khắc trên chày khắc chữ bằng thép, hay punch, rồi đóng vào kim loại mềm hơn để tạo ra khuôn âm, hay matrix. Khuôn âm được đặt trong khuôn đúc thủ công; kim loại nóng chảy rót vào sẽ tạo thành con chữ có mặt in nổi. Lặp lại việc đúc cung cấp nhiều bản của cùng một ký tự. Thợ sắp chữ ghép các con chữ thành dòng và trang, với mặt chữ đảo ngược để dấu in đọc đúng chiều; mực và lực ép sau đó chuyển nội dung đã sắp lên giấy. Tài liệu của thành phố Mainz về thiết bị Gutenberg mô tả cách khuôn đúc và máy ép hỗ trợ quy trình lặp lại này [9].

Kinh Thánh Gutenberg thể hiện cả thay đổi trong sản xuất lẫn sự tiếp nối của nghề làm bản thảo. Thư viện Quốc hội Mỹ xác định sách được in ở Mainz vào năm 1454 hoặc 1455 và cho biết các chuyên viên sau đó thêm tiêu đề màu cùng chữ cái đầu bằng tay. Như vậy, trang in chưa loại bỏ mọi công đoạn thủ công trong làm sách. Những hình chữ dày đặc cũng thuộc văn hóa sách của thời kỳ đó, thay vì báo trước lối chữ không chân gắn với nhiều thương hiệu hiện đại [10].

Con chữ dùng lại khiến tính nhất quán trở thành yêu cầu thực tế. Một trang cần nhiều bản của các chữ thường gặp, chiều cao tương thích và khoảng cách có thể dự đoán; một cuốn sách còn đòi hỏi chúng chịu được nhiều lần sắp và in. Công việc thiết kế vì vậy vượt ra ngoài một chữ riêng lẻ đẹp mắt để hình thành hệ thống chữ có thể kết hợp trong lượng văn bản lớn. Yêu cầu này vẫn còn khi font kỹ thuật số cung cấp chữ cho tên gọi, thời khóa biểu và đoạn văn.

Sắp chữ thủ công, cơ giới và quang học

Chữ in không dừng ở những hình dáng Gutenberg sử dụng. Các nhà in phát triển thiết kế cho nhiều ngôn ngữ, thói quen đọc và khổ sách. Tại nhà in của Aldus Manutius ở Venice, chữ nghiêng gọn giúp thực hiện những cuốn sách nhỏ hơn vào đầu thế kỷ XVI. Tài liệu Stanford về bộ sưu tập sách lịch sử liên hệ hình chữ nghiêng với chữ viết tay và giải thích mối quan hệ với việc tiết kiệm giấy. Do đó, tùy chọn chữ nghiêng trong trình đơn font ngày nay có nguồn gốc trong sản xuất sách, dù thiết kế chữ nghiêng hiện đại rất đa dạng [11].

Trong phần lớn lịch sử chữ kim loại, sắp chữ đòi hỏi đặt từng con chữ bằng tay. Cơ giới hóa thay đổi tốc độ chuẩn bị văn bản: Linotype của Ottmar Mergenthaler, ra mắt năm 1886, dùng bàn phím để lựa chọn chữ và cơ chế đúc tạo cả dòng thành một khối. Science Museum Group lưu giữ những mẫu vật thể hiện các bước của quy trình này. Tốc độ sắp chữ cao hơn đặc biệt có ý nghĩa khi cần in lượng lớn nội dung thường xuyên thay đổi, như báo chí [12].

Sắp chữ quang học, hay phototypesetting, sau đó cho phép tạo chữ bằng ánh sáng thay cho mặt in kim loại nổi. Trong các hệ thống này, mẫu ký tự có thể được phơi lên vật liệu nhạy sáng để chuẩn bị trang in. Bộ sưu tập kỹ thuật Rudolf Hell mô tả bước chuyển từ mẫu hình chụp sang sản xuất điều khiển bằng dữ liệu số, trong đó có hệ thống Digiset được phát triển năm 1965. Thiết bị dùng ống tia âm cực tạo ký tự từ thông tin số đã lưu, rồi phơi chúng lên vật liệu ảnh [13].

Những bước phát triển này cũng giải thích vì sao một tên kiểu chữ quen thuộc có thể chỉ nhiều phiên bản liên quan. Khi chuyển thiết kế từ chữ kim loại sang quang học hoặc kỹ thuật số, khoảng cách và hình dáng có thể cần thay đổi theo điều kiện tái tạo. Lịch sử Helvetica ở phần dưới đi qua các công nghệ đó; không nên xem đây là một tập tin duy nhất giữ nguyên từ năm 1957 [14].

Chữ trên máy tính thời kỳ đầu và font kỹ thuật số

Không có một câu trả lời duy nhất, không kèm điều kiện, cho câu hỏi “Font đầu tiên trên máy tính là gì?”. Máy tính thời kỳ đầu có thể hiển thị chữ, hệ thống vẽ có thể mô tả ký tự bằng toán học, còn thiết bị sắp chữ thương mại có thể lưu bảng chữ để in, nhưng đó là những cách thực hiện khác nhau. Bảo tàng Lịch sử Máy tính mô tả Whirlwind, hoạt động từ năm 1951, có thể là máy tính đầu tiên hiển thị văn bản và đồ họa trên màn hình đầu cuối. Một ký tự xuất hiện trên thiết bị ấy chưa chắc là tập tin font được phân phối riêng như những tập tin tải về ngày nay [15].

Một cách tiếp cận chữ trên máy tính được ghi nhận sớm nằm trong Calligraphy for Computers của A. V. Hershey, báo cáo năm 1967 từ Phòng thí nghiệm Vũ khí Hải quân Mỹ. Hershey mô tả các bộ ký tự dành cho đầu ra do máy tính điều khiển, gồm chữ của nhiều hệ thống viết và ký hiệu khoa học. Công việc này giải quyết cách tạo hình chữ bằng chỉ dẫn cho máy, vượt ra ngoài việc hiển thị một bảng chữ cái giới hạn [16].

Sắp chữ kỹ thuật số thương mại đi theo một hướng có liên quan nhưng riêng biệt. Bộ sưu tập Hell ghi lại cách Digiset tạo ký tự bằng điều khiển số, còn tài liệu hiện nay của Linotype mô tả Digi Grotesk, do Hell Design Studio thiết kế, là một trong những kiểu chữ kỹ thuật số đầu tiên. Đây là ví dụ có tên cụ thể giúp tìm hiểu typography kỹ thuật số thời kỳ đầu, dù nguồn không xác lập nó là cách tạo chữ trên máy tính đầu tiên trong mọi trường hợp. Họ Digi Grotesk hiện nay được cấp phép thương mại; giá trị lịch sử không khiến phần mềm font trở thành tài nguyên được tự do phân phối lại [13], [17].

![Ba cách thể hiện chữ A: bitmap minh họa theo lưới năm cột bảy hàng, chữ vẽ từ tọa độ đường thẳng và đường viền thật của IBM Plex Sans.](/blog/n3g8y2lp.svg)

Hình 3. Những cách thể hiện một chữ bằng dữ liệu số. Hai cấu trúc đầu là sơ đồ giải thích, không tái dựng ký tự của Whirlwind, Hershey hoặc Digiset; ví dụ đường viền sử dụng IBM Plex Sans thật. Font đường viền cũng được chuyển thành điểm ảnh khi hiển thị trên màn hình [18].

Bitmap, hay ảnh dạng lưới điểm ảnh, lưu mẫu ô được tô và để trống ở một độ phân giải cụ thể. Cách thể hiện bằng nét lưu chỉ dẫn vẽ đường, còn cách thể hiện bằng đường viền mô tả ranh giới của hình có thể tô kín. Không nên xem đây là một chuỗi đơn giản trong đó cách mới lập tức thay thế mọi cách cũ, vì mức độ phù hợp còn tùy thiết bị xuất và công việc. Đường viền có thể được đổi kích thước trước khi chuyển thành điểm ảnh mà màn hình cần, trong khi phóng lớn bitmap nhỏ cũng phóng lớn mẫu ô ban đầu [18].

Macintosh đời đầu đưa chữ được thiết kế cẩn thận cho màn hình vào giao diện máy tính cá nhân. Trong lời kể trực tiếp của mình, Susan Kare mô tả quá trình phát triển các font đầu tiên, gồm kiểu chữ hệ thống đậm sau này được đặt tên Chicago, với cấu tạo tránh những nét chéo răng cưa. Chicago, Geneva, New York và Monaco trở thành ví dụ về việc thiết kế chữ cho vai trò giao diện và giới hạn màn hình cụ thể. Kare còn mô tả một thiết kế cố tình không đều mang tên San Francisco; kiểu chữ Macintosh này khác với họ San Francisco hiện đại mà Apple giới thiệu nhiều thập niên sau [19].

Đường viền co giãn, font web và typography hiện nay

Khi máy tính trở thành công cụ chuẩn bị trang in, chữ phải hoạt động trên màn hình và máy in có độ phân giải khác nhau. PostScript của Adobe, được giới thiệu năm 1984, là ngôn ngữ mô tả trang, bao gồm văn bản và đồ họa. Ngôn ngữ mô tả trang không phải một kiểu chữ; nó cung cấp chỉ dẫn để hệ thống đầu ra diễn giải và tạo ra trang. Điều này góp phần hình thành quy trình trong đó máy tính xác định một bố cục để tái tạo trên nhiều thiết bị [20].

TrueType, do Apple phát triển, cung cấp một cách khác để tạo đường viền font có thể thay đổi kích thước. Tổng quan kỹ thuật của Microsoft giải thích cách bộ chuyển thành điểm ảnh điều chỉnh tỷ lệ đường viền đã lưu, căn nó theo lưới của thiết bị rồi tô các điểm ảnh tương ứng. Những chỉ dẫn gọi là hinting giúp kiểm soát sự căn chỉnh ở cỡ nhỏ, nơi chỉ một phần điểm ảnh cũng có thể thay đổi độ dày hoặc độ rõ nhìn thấy của nét. Thiết kế có thể co giãn vì vậy vẫn cần tính đến hình ảnh cuối cùng; nó thay đổi nơi các điều chỉnh được thực hiện [18].

OpenType, do Microsoft và Adobe phát triển, với đặc tả đầu tiên công bố năm 1997, mở rộng công nghệ font trước đó. Ngoài đường viền, font có thể chứa thông tin thay thế và định vị glyph, chẳng hạn tổ hợp chữ nối hoặc hình chữ số khác. Điều này có ý nghĩa vì viết chữ không phải lúc nào cũng chỉ đặt một hình độc lập cạnh hình kế tiếp: một số hệ thống viết cần hình chữ thay đổi theo ngữ cảnh, và một kiểu chữ có thể cung cấp nhiều glyph cho cùng một ký tự. Khả năng hỗ trợ ngôn ngữ và tính năng thực tế phụ thuộc vào nội dung font, không chỉ tên định dạng [21].

Font web đưa phần mềm font có thể tải về vào quá trình dàn trang của trình duyệt. CSS cho phép website khai báo font cho nội dung, còn những định dạng như WOFF2 đóng gói dữ liệu font dưới dạng nén để truyền qua mạng. Sau khi nhận tập tin, trình duyệt vẫn cần chọn, định vị và hiển thị các glyph phù hợp. Lựa chọn chữ cho website vì vậy liên quan đến cả hình thức lẫn dung lượng tải, ký tự có sẵn và font dự phòng [1], [22].

Font biến thiên, hay variable font, lưu các thiết kế có thể điều chỉnh trong một tập tin, cho phép ứng dụng chọn vị trí trên những thông số được hỗ trợ, như độ đậm hoặc độ rộng. Các thông số này gọi là trục, hay axis, và khoảng điều chỉnh có sẵn phụ thuộc vào từng font [23]. Thiết kế biến thiên có thể cung cấp độ đậm trung gian hoặc hình chữ hẹp hơn mà không cần tập tin riêng cho mỗi lựa chọn, nhưng không tự động bao gồm mọi kiểu hoặc ngôn ngữ.

Quá trình lịch sử này liên hệ trực tiếp với nhận diện thương hiệu. Chữ vẽ tay có thể tạo bố cục riêng cho tên cố định; con chữ dùng lại phục vụ nội dung thay đổi; các họ chữ kỹ thuật số mở rộng sự nhất quán đó sang website, ứng dụng và nhiều kích thước màn hình. Những ví dụ tiếp theo xem xét cách các tổ chức sử dụng các khả năng này, bắt đầu với Helvetica từ thời chữ kim loại, rồi đến việc Microsoft phân phối Arial và Apple phát triển font hệ thống hiện nay.

Helvetica và quá trình phát triển tại Haas

Helvetica bắt nguồn từ xưởng chữ Haas ở Münchenstein, Thụy Sĩ, nơi giám đốc điều hành Eduard Hoffmann giao Max Miedinger phát triển một thiết kế không chân mới vào năm 1956. Hoffmann định hướng công việc, còn Miedinger vẽ chữ; phiên bản đầu tiên ra mắt năm 1957 với tên Neue Haas Grotesk, mang nghĩa “kiểu chữ không chân Haas mới”. Trong ngữ cảnh này, grotesk là tên gọi lịch sử của chữ không chân, không phải nhận xét rằng chữ xấu. Thiết kế bước vào một thị trường đã có những kiểu tương tự, trong đó có Akzidenz-Grotesk của Berthold [24], [14].

![Bìa sách mẫu Neue Haas Grotesk lịch sử do MyFonts giới thiệu, với chữ không chân màu vàng lớn trên nền tối.](/blog/p7d3m9ka.png)

Hình 4. Sách mẫu Neue Haas Grotesk trong bài lịch sử của MyFonts. Nguồn hình: MyFonts / Monotype. Bìa giữ lại tên trước khi đổi thành Helvetica; đây là mẫu chữ lịch sử, không phải nội dung được dựng lại bằng font thay thế [14].

Khi xưởng chữ Stempel ở Đức tiếp thị thiết kế ra ngoài nhóm khách hàng sẵn có của Haas, tên đổi thành Helvetica, bắt nguồn từ Helvetia, tên Latin của Thụy Sĩ. Việc phát triển tiếp tục khi sản xuất chuyển từ sắp chữ kim loại thủ công sang sắp chữ bằng máy, quang học và font kỹ thuật số. Các bước chuyển làm thay đổi tỷ lệ và khoảng cách, nên tên gọi này chỉ một lịch sử những thiết kế có liên hệ, thay vì một bộ đường viền giữ nguyên [24].

Neue Helvetica, được vẽ năm 1983, tổ chức lại họ chữ thành hệ thống độ đậm và kiểu nhất quán hơn; Helvetica Now ra đời sau đó bổ sung những tinh chỉnh và thiết kế phù hợp từng cỡ đọc. Sự phân biệt này liên quan đến lịch sử Apple, vì Helvetica Neue mà hãng sử dụng thuộc thế hệ sau, không phải bộ chữ kim loại ban đầu năm 1957. MyFonts cũng lưu ý rằng thay một thế hệ Helvetica bằng thế hệ khác có thể đổi khoảng cách, độ đậm và chi tiết cấu tạo, ảnh hưởng đến bố cục đang dùng [14].

Khả năng sử dụng: font sở hữu độc quyền, cấp phép thương mại. Helvetica cùng các họ liên quan được cung cấp theo giấy phép thương mại. Việc có sẵn trong hệ điều hành hoặc ứng dụng không biến chúng thành font nguồn mở; mục đích khác, như lưu phần mềm font trên website để người đọc tải khi xem trang, cần quyền sử dụng tương ứng [25].

Arial, Monotype và việc Microsoft đưa vào Windows

Arial được thiết kế tại Monotype, không phải trong nội bộ Microsoft. Theo tài liệu của Microsoft, thiết kế gốc năm 1982 thuộc về Robin Nicholas, người phát triển nó cho máy in laser có độ phân giải thấp; tài liệu cũng mô tả việc ông cùng Patricia Saunders mở rộng thành một họ chữ. Microsoft mua quyền sử dụng Arial cho Windows 3.1 năm 1992, đưa font đến người dùng thông qua hệ điều hành thay vì yêu cầu mỗi người tự mua một bộ riêng [26].

![Mẫu Arial do Microsoft công bố có chữ a thường, G hoa mang dấu, số 5, dấu câu và ký tự của những hệ thống viết khác.](/blog/c8w2n5rt.png)

Hình 5. Ký tự Arial thật trong mẫu do Microsoft công bố. Hình: Microsoft. Chữ a thường, G mang dấu và chữ số cho thấy họ chữ phục vụ nội dung thông thường lẫn tên gọi nổi bật; mẫu còn có những hệ thống viết khác [26].

Microsoft mô tả đường cong Arial tương đối mềm và đầy, với đầu nét được cắt chéo, cho thấy cần xem đây là một thiết kế riêng dù thoạt nhìn gần giống các họ không chân khác. Mối liên hệ với Microsoft xuất phát từ việc cấp phép và phân phối, còn tác giả thiết kế thuộc Monotype [26].

Khả năng sử dụng: font sở hữu độc quyền, đi kèm những sản phẩm Microsoft có áp dụng. Hướng dẫn Microsoft cho phép tạo sản phẩm in và đồ họa thông thường bằng font đi kèm Windows theo điều khoản của ứng dụng, nhưng không cấp quyền chung để sao chép tập tin font lên website hoặc phân phối lại. Vì vậy, Arial có thể dùng để làm áp phích ở trường trên máy Windows có bản quyền, mà không trở thành bộ font miễn phí được phép chia sẻ tùy ý [27].

Coca-Cola và logo chữ được vẽ riêng

Coca-Cola ghi nhận tên gọi cùng nét chữ ban đầu là công việc của Frank M. Robinson, người làm kế toán gắn với John S. Pemberton, và liên hệ thiết kế với thời điểm công ty ra đời năm 1886. Tài liệu lịch sử của hãng xác định đó là lối chữ Spencerian, một cách viết tay phổ biến vào cuối thế kỷ XIX. Spencerian chỉ truyền thống đứng sau bản vẽ, không phải tên một font chính thức có thể tái tạo logo bằng thao tác gõ chữ thông thường [28].

![Chữ Coca-Cola chính thức được viết liền nét cạnh tên khu vực Bỉ và Luxembourg trong bộ nhận diện của hãng.](/blog/k2r7p9vd.png)

Hình 6. Chữ Coca-Cola thật trong bộ nhận diện khu vực. Hình: The Coca-Cola Company; đã thêm lề trắng. Có thể so sánh chữ viết liền nét với các chữ rời trong tên khu vực [28].

Những chữ C lớn, nét nối và đường cong kéo dài thuộc bố cục được phát triển quanh một tên gọi cố định. Tỷ lệ cùng mối nối giúp phân biệt logo này với nội dung được gõ bằng một font viết tay có vẻ tương tự, vốn phải đáp ứng nhiều từ khác nhau. Khi thiết kế nhận diện, sự khác biệt này có ý nghĩa: cách trình bày tên cố định có thể giữ những nét cầu kỳ hoặc nối sát, còn nội dung thay đổi như ngày giờ và địa điểm cần chữ sử dụng được trong nhiều tổ hợp hơn.

Trên áp phích sự kiện, tên đơn vị tổ chức có thể giữ vai trò cố định ấy mà không quyết định cách trình bày mọi dòng bên dưới. Khi đó, nhận diện dựa một phần vào tên được lặp lại, còn chữ bổ trợ đáp ứng thông tin cần truyền tải. Chữ Coca-Cola cho thấy mối quan hệ giữa một dấu hiệu dễ nhận ra và những nội dung khác xuất hiện bên cạnh.

Khả năng sử dụng: chữ nhận diện thuộc sở hữu thương hiệu. Tài liệu lịch sử được dẫn không cung cấp giấy phép font dùng cho mọi mục đích, và không nên xem Spencerian là font Coca-Cola chính thức có thể tải về [28].

Google và bước chuyển từ chữ tên sản phẩm sang chữ giao diện

Google giới thiệu nhận diện không chân mang tính hình học vào năm 2015, với chữ được tổ chức quanh những hình cơ bản, đặc biệt là hình tròn. Thiết kế Product Sans đi kèm hỗ trợ bố cục kết hợp tên Google với tên sản phẩm. Dù hình học giữ vai trò chính, nhóm thiết kế còn mô tả việc chỉnh chữ G thu gọn để phần tròn và nét ngang trông cân bằng, một ví dụ về điều chỉnh thị giác dựa trên hình ảnh nhìn thấy, thay vì chỉ dựa vào độ chính xác toán học [29].

![Các chữ thường từ a đến h và số từ 1 đến 8 bằng Product Sans thật, màu trắng trên nền xanh.](/blog/a7d2g5mh.png)

Hình 7. Chữ và số Product Sans, cắt từ trang 4 của tài liệu mẫu Google năm 2015. Hình: Google. Có thể quan sát phần tròn của b, d và chữ a một tầng, với một khoảng trống kín chính [29].

Trong tài liệu về phát triển font sau đó, Google nêu một giới hạn của Product Sans: thiết kế dành cho tên sản phẩm nổi bật chưa phù hợp tương đương với đoạn dài và chữ nhỏ trên điện thoại. Google Sans, giới thiệu năm 2018, đáp ứng phạm vi sử dụng rộng hơn, rồi tiếp tục được phát triển cho chữ nhỏ. Hãng cũng mô tả quyết định đưa Google Sans và Google Sans Flex thành nguồn mở vào năm 2025 [30].

![Google Sans và Google Sans Flex trình bày cùng một câu, các cặp chữ hoa và thường, cùng chữ số.](/blog/e4s9h2vc.svg)

Hình 8. Google Sans và Google Sans Flex thật trình bày “People and machines.” cùng một mẫu chữ và số ngắn ở cùng cỡ thiết lập. Mẫu do tác giả thực hiện từ các tập tin font được phân phối [31], [32].

Quá trình này cho thấy sự khác biệt giữa chữ dùng để nhấn mạnh, hay display text, dành cho nội dung ngắn nổi bật như tên và tiêu đề, với chữ nội dung, hay body text, phục vụ việc đọc liên tục. Một thiết kế trông cân bằng trong tên lớn có thể cần tỷ lệ hoặc khoảng cách khác khi dùng trong câu nhỏ. Trên áp phích ở trường, tên chương trình và đoạn giải thích cách vào cửa vì vậy cần được kiểm tra riêng, dù chữ thuộc những họ có liên hệ.

Khả năng sử dụng: Product Sans bị giới hạn và không phải nguồn mở; Google Sans cùng Google Sans Flex miễn phí theo SIL Open Font License 1.1. Giấy phép mở cho phép sử dụng cá nhân và thương mại theo điều kiện đi kèm, còn Product Sans có quy định riêng về khả năng sử dụng [31], [32], [33].

IBM Plex và những họ chữ có liên hệ

IBM Plex được phát triển cùng nhà thiết kế IBM Mike Abbink và xưởng chữ Bold Monday. Tài liệu của Bold Monday ghi thời gian dự án từ 2016 đến 2023 và mô tả mối quan hệ giữa con người với máy móc là một ảnh hưởng chính. Xưởng chữ, hay foundry, là tổ chức sản xuất kiểu chữ; tên gọi bắt nguồn từ việc đúc con chữ vật lý. IBM phân phối các thiết kế Sans, Serif, Mono và Sans Condensed trong Plex, cung cấp hình dáng liên quan cho nhiều loại nội dung [34], [2].

![IBM Plex Sans, Serif và Mono trình bày cùng một câu và chuỗi số trong ba dòng có nhãn.](/blog/t4m9c2rx.svg)

Hình 9. IBM Plex Sans, Serif và Mono thật trình bày cùng câu và chuỗi số. Mẫu do tác giả thực hiện từ tập tin font. Mở hình kích thước đầy đủ để so sánh từng chữ [2].

Mẫu cho thấy sự khác biệt mà không đổi câu chữ. Serif có nét chân vắng mặt ở Sans, còn Mono dành khoảng ngang bằng nhau cho từng ký tự, tạo nhịp khác quanh chữ hẹp như i và chữ rộng như m. Bold Monday xác định chữ của máy đánh chữ lịch sử là một trong những nguồn ảnh hưởng của họ này; Mono thể hiện liên hệ đó qua khoảng cách ký tự bằng nhau, trong khi các thiết kế có độ rộng thay đổi phục vụ những nhu cầu đọc khác [34].

Các họ có liên hệ cho phép nhận diện biến đổi theo nội dung được trình bày. Ký tự thẳng cột có thể hữu ích trong ví dụ mã lập trình, còn đoạn giải thích có yêu cầu khoảng cách khác; một dự án có thể giao vai trò cho từng cách trình bày mà vẫn giữ liên hệ thị giác trên trang. Plex vì vậy thích hợp để học cách nhiều thiết kế cùng thuộc một nhận diện mà không phải áp dụng giống hệt cho mọi loại văn bản.

Khả năng sử dụng: miễn phí theo SIL Open Font License 1.1. Giấy phép cho phép sử dụng thương mại, nhưng khi phân phối lại phải giữ các thông báo bắt buộc, và bản font sửa đổi phải tuân thủ quy định về tên được dành riêng “Plex” [35].

Apple sử dụng Helvetica Neue và San Francisco

Typography giao diện của Apple từng dùng Helvetica Neue, rồi đến họ San Francisco do hãng phát triển. Trong OS X Yosemite ra mắt năm 2014, Helvetica Neue thay Lucida Grande làm font hệ thống trên Mac, ảnh hưởng đến những thành phần lặp lại như tiêu đề cửa sổ và nút điều khiển. Bài đánh giá trải nghiệm thực tế của John Siracusa lúc đó ghi nhận thay đổi và cho thấy cùng một nội dung có thể chiếm chiều rộng khác dưới thiết kế mới [36]. Font hệ thống phục vụ các nhãn giao diện thường xuyên thay đổi, một công việc khác với vẽ logo cố định của công ty.

Năm 2015, Apple công bố San Francisco là font hệ thống mới cho OS X El Capitan; tài liệu của WebKit về bước chuyển này xác định font được dùng trong cả iOS 9 và OS X 10.11. Bài viết WebKit còn giải thích cách nội dung web yêu cầu font hệ thống của nền tảng, để đi theo typography của hệ điều hành thay vì phụ thuộc tên font nội bộ [37], [38]. San Francisco qua đó trở thành một phần giao diện, chứ không chỉ là lối chữ gắn với một sản phẩm.

San Francisco, viết tắt SF, được Apple thiết kế theo yêu cầu của các nền tảng của hãng. Họ hiện nay gồm SF Pro cho chữ giao diện có độ rộng thay đổi theo ký tự, SF Compact cho cỡ nhỏ và cột hẹp, cùng SF Mono cho môi trường lập trình cần chiều rộng ký tự bằng nhau để căn cột. New York là họ chữ có chân đi cùng, không phải một biến thể không chân khác của SF [39].

![Hình San Francisco chính thức của Apple có hello và lời chào bằng nhiều ngôn ngữ, với độ đậm và độ rộng khác nhau.](/blog/w5c8t1na.png)

Hình 10. Hình San Francisco do Apple công bố, đặt trên nền đen để dễ quan sát. Hình: Apple. Có thể so sánh “hello” với “xin chào” dạng hẹp và những ví dụ ngôn ngữ khác. Đây là hình của đơn vị phát hành; không sử dụng tập tin font Apple để tạo hình [40].

Sự phát triển của San Francisco giải thích vì sao font màn hình có thể cần nhiều hơn một bản vẽ của mỗi chữ. SF Text ban đầu được thiết kế cho cỡ dưới 20 point, còn SF Display dành cho từ 20 point trở lên, với khác biệt về khoảng cách và tỷ lệ theo chiều đứng giúp chữ nhỏ giữ kích thước nhìn thấy cùng sự tách biệt. Đây là thiết kế theo cỡ đọc, hay optical size, được điều chỉnh cho quy mô đọc dự kiến thay vì chỉ phóng to hoặc thu nhỏ một đường viền cố định [41].

Trong bài trình bày typography năm 2020, Apple mô tả bước chuyển sang font biến thiên kết hợp thiết kế theo cỡ đọc với độ đậm, cho phép chữ thích ứng trong một khoảng thay vì chỉ dựa vào các tập tin Text và Display riêng. Với người mới học, cần phân biệt tăng cỡ chữ với thay đổi thiết kế dành cho cỡ ấy: thao tác đầu thay đổi tỷ lệ, còn thao tác sau chỉnh chi tiết và khoảng cách trong cùng tỷ lệ. Phần mềm hệ thống Apple phối hợp các điều chỉnh này khi dùng font hệ thống của hãng [41].

Họ chữ sau đó mở rộng cả về chiều ngang lẫn độ đậm. Tại WWDC22, Apple giới thiệu các kiểu Condensed, Compressed và Expanded bên cạnh độ rộng thông thường, minh họa cách dùng trong tiêu đề Photos, tin News và nhãn Maps. Tiêu đề hẹp có thể chiếm ít dòng hơn, còn nhãn bản đồ rộng tạo một cách thể hiện khác; tất cả vẫn thuộc cùng họ, với mức độ phù hợp do nhu cầu đọc quyết định. Bài trình bày cũng lưu ý kiểu Compressed dày đặc có thể quá chật cho đoạn dài [39].

Hướng dẫn Dynamic Type của Apple giải quyết một yêu cầu khác: người đọc có thể chọn chữ lớn hơn, và giao diện phải đáp ứng thay đổi về diện tích. Nút có thể cần thêm chiều cao hoặc dòng chữ phải xuống dòng, nên trải nghiệm đọc phụ thuộc cả font lẫn bố cục chứa nó. Kiểm tra thông báo với chữ phóng lớn hoặc tên được dịch dài hơn có thể phát hiện chồng lấn và thông tin bị che, vốn không xuất hiện trong mẫu ngắn ở cỡ mặc định [42].

Khả năng sử dụng: tải về không mất phí theo điều khoản giới hạn của Apple, không phải giấy phép nguồn mở. Thỏa thuận San Francisco được công bố giới hạn việc sử dụng cho các bản mô phỏng giao diện nền tảng Apple được nêu trong điều khoản, không cấp quyền chung để dùng trong nội dung website hoặc nhúng font; có thể tải về vì vậy không đồng nghĩa được dùng cho một áp phích hay website không liên quan [40].

Netflix Sans cho quảng bá và nội dung đọc

Dalton Maag mô tả Netflix Sans là họ chữ riêng được phát triển cùng các nhóm tiếp thị và sản phẩm của Netflix, với thời gian dự án từ 2017 đến 2023 và phạm vi sử dụng từ bảng quảng cáo đến phụ đề nhỏ. Các hệ thống viết được liệt kê gồm Latin, phần mở rộng tiếng Việt, Hy Lạp và Cyrillic, thể hiện nhu cầu vượt ra ngoài bảng chữ cái tiếng Anh [43].

![Mẫu Netflix Sans thật của Dalton Maag trình bày Entertainment, New releases, On-demand và Streaming revolution.](/blog/z9m4b6qs.svg)

Hình 11. Netflix Sans thật trong mẫu do nhà thiết kế công bố. Hình: Dalton Maag / Netflix, giữ nguyên. Bốn cụm từ thể hiện độ đậm, độ rộng và hình chữ nghiêng khác nhau [43].

Mẫu công bố trình bày nhiều cách thể hiện trong cùng họ: dòng đầu đậm, dòng hai viết hoa và dòng cuối hẹp hơn tạo những hình khối thị giác khác nhau. Độ rộng quyết định diện tích ngang mà thiết kế cần, còn kiểu hoa hoặc thường, hay case, phân biệt chữ hoa với chữ thường. Những thuộc tính này có thể tạo mức nhấn mạnh hoặc giúp nội dung vừa khổ trình bày, nhưng kiểu hẹp vẫn cần được kiểm tra ở cỡ và điều kiện đọc thực tế.

Vấn đề tương tự xuất hiện khi nhận diện sự kiện được chuyển từ áp phích sang vé nhỏ. Tiêu đề và thông tin cần thiết cỡ nhỏ có thể cần cách trình bày riêng, nên họ chữ được chọn phải có các kiểu đảm nhiệm được những vai trò ấy khi nội dung thay đổi. Netflix Sans minh họa yêu cầu này qua họ chữ riêng được phát triển cho cả quảng bá nổi bật lẫn định dạng đọc nhỏ.

Khả năng sử dụng: font thuộc sở hữu riêng và dành riêng cho Netflix. Trang dự án của Dalton Maag không cung cấp bản tải miễn phí cho công chúng hoặc giấy phép bán lẻ cho họ chữ này [43].

Spotify Mix và thiết kế biến thiên

Spotify công bố Spotify Mix ngày 22 tháng 5 năm 2024, mô tả kiểu chữ riêng được phát triển cùng Dinamo để thay font trong ứng dụng và trải nghiệm trên máy tính. Tài liệu của Dinamo xác định một dải độ đậm và độ rộng lớn, các hình ký tự thay thế cùng ảnh hưởng từ nhiều truyền thống tạo chữ, liên hệ sự đa dạng đó với các thể loại âm nhạc và nội dung âm thanh Spotify cung cấp [44], [45].

![Bảng ký tự Spotify Mix của Dinamo có bảng chữ cái, chữ mang dấu, chữ số, các hình G thay thế và nhiều bộ số.](/blog/j3f6u8lx.png)

Hình 12. Spotify Mix thật trong bảng ký tự do Dinamo công bố. Hình: Dinamo / Spotify. Cột bên phải có các hình G thay thế và ba cách thiết kế chữ số. Mở bảng kích thước đầy đủ để xem chi tiết [45].

Hình thay thế, hay alternate, là một hình vẽ khác có sẵn cho cùng ký tự, như những hình G trong bảng. Mẫu còn có chữ mang dấu, dấu câu và nhiều cách thiết kế số, cho thấy bộ ký tự mở rộng ra ngoài bảng chữ cái cơ bản. Các biến thể thuộc cách tiếp cận nhận diện mà nhà thiết kế nêu; tài liệu công bố không cung cấp kết quả đo cho thấy một hình cụ thể làm thay đổi phản ứng của người xem.

Spotify Mix là font biến thiên, với các thông số điều chỉnh gọi là trục. Trục độ đậm thay đổi độ dày nét, còn trục độ rộng thay đổi tỷ lệ chữ trong khoảng thiết kế cung cấp [23], [45]. Khả năng linh hoạt giúp một họ phục vụ nhiều cách trình bày, nhưng hệ thống typography vẫn cần thiết lập lặp lại được cho từng vai trò. Kiểu tiêu đề dùng xuyên suốt nhiều thông báo tạo cơ sở chỉnh sửa nhất quán hơn việc chọn độ rộng và độ đậm không liên quan cho từng dòng.

Khả năng sử dụng: font riêng thuộc sở hữu Spotify. Spotify mô tả Mix là độc quyền, và các tài liệu được dẫn không cung cấp bản tải công khai hoặc giấy phép bán lẻ [44], [45].

Khả năng sử dụng font và giấy phép

Chọn font bao gồm cả sự phù hợp của thiết kế lẫn quyền sử dụng phần mềm. Miễn phí nói về giá, còn nguồn mở nói về những quyền được cấp theo giấy phép mở; vì vậy, một bản tải không mất tiền vẫn có thể bị giới hạn. Font sở hữu độc quyền được cung cấp theo điều khoản của chủ sở hữu thay vì giấy phép mở, và một số họ được thiết kế riêng chỉ dành cho tổ chức đặt hàng.

Chữ nhận diện hoặc họ chữKhả năng sử dụngÁp dụng cho dự án cá nhân
Helvetica / Neue HelveticaSở hữu độc quyền, cấp phép thương mạiDùng theo giấy phép đi kèm họ chữ hoặc sản phẩm; không phải bản tải nguồn mở [25]
ArialSở hữu độc quyền, đi kèm sản phẩm Microsoft có áp dụngCho phép sản phẩm áp phích hoặc đồ họa thông thường theo điều khoản; phân phối tập tin font và lưu font trên web cần quyền riêng [26], [27]
Chữ Coca-ColaDấu hiệu nhận diện thuộc sở hữu thương hiệuBản vẽ để nghiên cứu; không có font chính thức dùng cho mọi mục đích được cung cấp [28]
Product SansBị giới hạn, không phải nguồn mởKhông phải font Google Fonts miễn phí có thể tải về [33]
Google Sans / Google Sans FlexMiễn phí, SIL OFL 1.1Sử dụng cá nhân và thương mại theo giấy phép [31], [32]
IBM PlexMiễn phí, SIL OFL 1.1Sử dụng cá nhân và thương mại theo giấy phép [35]
Apple San FranciscoKhông mất phí, giấy phép Apple có giới hạnCác bản mô phỏng giao diện nền tảng Apple được quy định; không phải giấy phép chung cho nội dung website [40]
Netflix SansSở hữu riêng, dành riêng cho NetflixTrang nhà thiết kế không cung cấp giấy phép font chung cho công chúng [43]
Spotify MixSở hữu riêng, dành riêng cho SpotifyCác nguồn được dẫn không cung cấp bản tải công khai hoặc giấy phép bán lẻ [44], [45]

SIL Open Font License, viết tắt OFL, có những điều kiện về phân phối lại và sửa đổi phần mềm font. Làm một áp phích bằng font và phân phối tập tin font là hai hoạt động khác nhau, nên cần giữ lại giấy phép đi kèm bản tải và xem điều khoản khi chia sẻ hoặc sửa đổi phần mềm [31], [32], [35]. Hình của các họ bị giới hạn trong bài là mẫu đã được công bố, giúp quan sát nét chữ mà không cung cấp tập tin font bên dưới.

IBM Plex là lựa chọn phù hợp cho bài thực hành ở phần sau vì có thể so sánh những thiết kế sẵn có với hình mẫu và lấy font từ nguồn phân phối chính thức. Phần mềm đã có họ này có thể sử dụng trực tiếp; nếu chưa có, tập tin có thể được cài qua chức năng cài font của máy tính hoặc chức năng nhập font được phần mềm hướng dẫn. Kiểm tra đủ kiểu thường, đậm và các kiểu cần thiết trước khi dàn trang giúp tránh để một kiểu bị thiếu quyết định thiết kế cuối cùng [2], [35].

Font miễn phí cho tiếng Việt, tiếng Hoa và tiếng Nhật

Với dự án cần quyền sử dụng rộng mà không phải mua giấy phép font, font nguồn mở là một lựa chọn thiết thực bên cạnh những họ thương mại có giới hạn. Các font dưới đây vẫn được bảo hộ bản quyền, nhưng SIL Open Font License cho phép thiết kế cá nhân và thương mại, gồm logo, áp phích, sách, website, video và ứng dụng. Sản phẩm thiết kế tạo ra không phải áp dụng giấy phép của font. Khi phân phối phần mềm font, cần giữ thông báo bản quyền và giấy phép; bản sửa đổi phải tuân thủ điều khoản, kể cả quy định về tên được dành riêng, và không được bán riêng font như một sản phẩm độc lập [46].

Khả năng hỗ trợ ngôn ngữ cần được kiểm tra ở bản tải cụ thể. CJK chỉ tiếng Hoa, tiếng Nhật và tiếng Hàn, còn SC, TC và JP xác định các phiên bản chữ Hoa giản thể, chữ Hoa phồn thể và tiếng Nhật. Noto phân phối họ CJK riêng với các họ Latin thông thường; Google Fonts liệt kê phiên bản theo khu vực dưới những tên như Noto Sans SC, Noto Sans TC và Noto Sans JP [47]. Vì vậy, cài Noto Sans thông thường không có nghĩa là đã cài mọi hệ thống chữ của Noto.

Bảng xếp hạng dưới đây dựa trên khả năng cung cấp glyph cho những ngôn ngữ cần so sánh, với tiếng Anh được tính cùng tiếng Việt. Các lựa chọn hạng 1 hỗ trợ những ngôn ngữ này khi cài đủ họ đi kèm được nêu; lựa chọn hạng 2 cần bổ sung một họ CJK. Đồng hạng là chủ ý, vì các nguồn hiện có chưa xác lập một lựa chọn vượt trội có ý nghĩa giữa những bộ phối hợp đã đủ ngôn ngữ. Đây là xếp hạng phạm vi hỗ trợ, không phải xếp hạng vẻ đẹp hoặc hiệu quả đọc đã được đo.

Hạng hỗ trợFont hoặc bộ họ chữ phối hợpPhạm vi glyphTiếng ViệtTiếng Hoa giản thể / phồn thểTiếng Nhật
1, đồng hạngNoto Sans + Noto Sans CJKLatin mở rộng, Hy Lạp và Cyrillic trong họ thông thường; chữ Hán và kana tiếng Nhật trong các họ CJK đi kèmCó, dùng bản Noto Sans hỗ trợ tiếng ViệtCó, dùng họ SC / TC đi kèmCó, dùng JP [47], [48]
1, đồng hạngNoto Serif + Noto Serif CJKLựa chọn có chân với Latin mở rộng, Hy Lạp và Cyrillic; họ CJK đi kèm cho chữ Đông ÁCó, dùng Noto SerifCó, dùng họ SC / TC đi kèmCó, dùng JP [47], [49]
1, đồng hạngSource Sans 3 + Source Han SansLatin mở rộng, Hy Lạp và Cyrillic trong Source Sans 3; phạm vi CJK đa ngôn ngữ trong Source Han SansCó, dùng Source Sans 3Có, dùng cấu hình Source Han phù hợp khu vựcCó, dùng cấu hình tiếng Nhật [50], [51]
1, đồng hạngSource Serif 4 + Source Han SerifLatin mở rộng, Hy Lạp và Cyrillic trong Source Serif 4; phạm vi CJK đa ngôn ngữ trong Source Han SerifCó, dùng Source Serif 4Có, dùng cấu hình Source Han phù hợp khu vựcCó, dùng cấu hình tiếng Nhật [52], [53]
1, đồng hạngIBM Plex Sans + các họ theo khu vựcLatin mở rộng, Hy Lạp và Cyrillic trong họ cơ bản; các gói tiếng Hoa và tiếng Nhật riêngCó, dùng bản cơ bản hỗ trợ tiếng ViệtCó, dùng IBM Plex Sans Chinese SC / TCCó, dùng IBM Plex Sans Japanese [2], [54]
2InterLatin mở rộng, Hy Lạp và Cyrillic; các phần ký tự được liệt kê không cung cấp chữ Hán hoặc kana tiếng NhậtCóCần họ đi kèm như Noto Sans SC / TCCần họ đi kèm như Noto Sans JP [55]

Cả sáu lựa chọn đều dùng OFL; các phần ký tự theo ngôn ngữ và gói font được ghi trong nguồn gắn với từng dòng. Với dự án đầu tiên dùng nhiều ngôn ngữ này, Noto Sans cùng các họ theo khu vực cần thiết là cách bắt đầu dễ triển khai. Nếu cần chữ có chân, có thể dùng bộ Noto Serif tương ứng; Source và Plex cung cấp lựa chọn khác khi hình dáng của chúng phù hợp với nhận diện.

Chỉ nhìn số lượng glyph có thể gây hiểu lầm về phạm vi hỗ trợ. Font có thể chứa nhiều hình thay thế cho cùng ký tự, trong khi một bộ ký tự theo khu vực có thể chủ động bỏ các ký tự cần ở nơi khác. Hướng dẫn tải Noto phân biệt font theo ngôn ngữ có phạm vi đầy đủ với các bản rút gọn nhỏ hơn theo khu vực, đồng thời giải thích việc chọn ngôn ngữ có thể chọn hình chữ phù hợp [56]. Tiếng Hoa và tiếng Nhật dùng chung nhiều ký tự, nhưng hình thức viết được ưu tiên có thể khác nhau; dùng font tiếng Nhật cho mọi đoạn tiếng Hoa chỉ vì nó có ký tự tương ứng có thể dẫn đến hình chữ không đúng vùng. Trong phần mềm soạn thảo, chọn họ phù hợp khu vực; trên website, xác định ngôn ngữ từng đoạn để các tính năng dàn chữ được hỗ trợ có thể chọn hình bản địa phù hợp [56].

Tiếng Việt dùng bảng chữ cái Latin với các chữ bổ sung và dấu thanh, nên một mẫu chỉ có tiếng Anh chưa đủ để xác định font phù hợp. Cần thử font đã cài với cả chữ hoa lẫn chữ thường, gồm những chữ mang nhiều dấu, rồi quan sát khoảng trống trên và dưới dòng. Các chuỗi dưới đây dùng để kiểm tra phạm vi ký tự bằng cách dán vào phần mềm rồi chọn font cần thử; hình thức hiển thị ở đây không phải mẫu của từng họ được đề xuất:

Tiếng Việt: Ă Â Ê Ô Ơ Ư Đ — ắ ằ ẵ ặ ấ ề ễ ộ ớ ừ ữ ự
简体中文:字体设计与品牌
繁體中文:字體設計與品牌
日本語:文字とブランドのデザイン

Các mẫu này kiểm tra một số hình hữu ích, không phải toàn bộ kho ký tự. Dự án có tên ít gặp, ký hiệu chuyên ngành hoặc chữ lịch sử cần thử bằng nội dung thật. Khi tải, có thể dùng Google Fonts cho những họ Latin và các bản Noto theo khu vực, hoặc các trang phát hành chính thức của Noto CJK, Adobe Source Han và IBM Plex được nêu trong tài liệu tham khảo; giữ lại tập tin giấy phép đi kèm gói [2], [47], [50], [52].

Kerning, tracking và khoảng cách dòng

Cách sắp xếp chữ vẫn quan trọng sau khi đã chọn kiểu chữ. Kerning điều chỉnh khoảng cách giữa những glyph cụ thể, tính đến khoảng trống có hình dáng khác nhau trong các tổ hợp như AV và HH. Tracking, còn gọi là giãn chữ, thay đổi khoảng cách trong cả một đoạn chữ thay vì chỉ xử lý một cặp riêng. Font và hệ thống dàn chữ xem đây là các thông số khác nhau vì chúng giải quyết những vấn đề khoảng cách khác nhau [23], [57].

![IBM Plex Sans trình bày FORM với cách sắp chữ thông thường, tăng khoảng cách chữ và đường viền bị ép hẹp bằng thao tác cơ học.](/blog/b6q1z8wk.svg)

Hình 13. Cùng một từ bằng IBM Plex Sans. Dòng giữa thêm tám đơn vị vẽ giữa các chữ; dòng cuối thu đường viền còn 75% chiều rộng, làm chính hình chữ hẹp lại. Minh họa do tác giả thực hiện, không phải font condensed được thiết kế thật.

Ở dòng giữa, tăng khoảng cách thay đổi khe hở nhưng giữ nguyên đường viền chữ. Dòng cuối lại thu hẹp chính đường viền theo chiều ngang, khác với thiết kế condensed được vẽ với tỷ lệ hẹp hơn. Phân biệt các thao tác giúp xác định tiêu đề chật cần đổi khoảng cách, dùng một kiểu hẹp được thiết kế sẵn hay sắp xếp lại trên nhiều dòng.

Khoảng cách được xem xét qua các hình trống giữa chữ ở cỡ đọc dự kiến, vì khoảng cách đo bằng nhau có thể trông không đều khi bị bao quanh bởi những hình khác nhau. Khe hở thu hút sự chú ý có thể cần chỉnh một cặp cụ thể, còn giãn chữ rộng phù hợp tên viết hoa ngắn có thể phá nhịp một câu dài. Nội dung xung quanh vì vậy tạo điều kiện để đánh giá việc điều chỉnh.

Khoảng cách dòng là khoảng cách giữa các đường chân chữ liên tiếp, trong phần mềm thiết kế còn gọi là leading, thuật ngữ liên quan đến những dải chì từng dùng để ngăn các dòng chữ vật lý [3]. Những dòng chật có thể cần chỉnh khoảng cách này thay vì thay font, nhất là khi đoạn văn có thân chữ thường lớn nhưng ít khoảng trống theo chiều đứng.

Độ rõ của ký tự, khả năng đọc và hỗ trợ ngôn ngữ

Legibility nói về khả năng nhận ra ký tự, gồm việc phân biệt những hình gần giống nhau như I, l và 1; còn readability nói về khả năng theo dõi toàn bộ nội dung. Chữ riêng lẻ rõ vẫn có thể tạo thành đoạn khó đọc nếu các dòng chật, chiều dài dòng chưa phù hợp hoặc bố cục liên tục làm gián đoạn trình tự đọc. Vì vậy, cỡ chữ, khoảng cách dòng, nền và lượng nội dung cần được xem cùng nhau.

Độ tương phản giữa chữ với nền đặc biệt liên quan đến người có thị lực giảm. Hướng dẫn tiếp cận nội dung web của W3C quy định mức AA với tỷ lệ tương phản tối thiểu 4,5:1 cho chữ thông thường và 3:1 cho chữ lớn đáp ứng tiêu chí, được tính từ màu thực tế [58]. Nền sáng đơn giản với chữ tối giúp kiểm tra dễ hơn, còn chữ trên ảnh phải nhìn rõ qua các vùng sáng tối khác nhau phía sau nét chữ.

Khả năng hỗ trợ ngôn ngữ cũng ảnh hưởng kết quả: font có “hello” có thể thiếu một số ký tự cần cho “xin chào”. Tùy phần mềm, ký tự thiếu có thể xuất hiện thành ô trống hoặc được lấy từ font khác, đưa một hình dáng khác vào dòng [1]. Hình của Apple và phạm vi ngôn ngữ Netflix liệt kê cho thấy cần đưa ngôn ngữ dự định sử dụng vào nội dung thử ban đầu, thay vì chỉ bổ sung sau khi thiết kế đã hoàn tất [40], [43].

Nhận diện câu lạc bộ phim trên ba định dạng

Dự án giả định Frame Film Club áp dụng các nguyên tắc này cho áp phích A4, vé vào cửa nhỏ và thông báo hẹp trên điện thoại. Thông tin được giữ cố định: đơn vị tổ chức là Frame Film Club, sự kiện là Short Film Night, bắt đầu lúc 16:30 thứ Sáu tại hội trường trường học và vào cửa miễn phí. Đây cũng là các thông tin trong Hình 1, giúp tập trung vào cách sắp xếp thay vì tạo thêm nội dung.

Xác lập thứ bậc thông tin

Phiên bản đầu có thể chỉ dùng IBM Plex Sans, với cỡ chữ, độ đậm và khoảng trống phân biệt đơn vị tổ chức, tiêu đề và chi tiết cần thiết. Trên áp phích, tên chương trình có thể được nhấn mạnh nhất, sau đó là thời gian và địa điểm; trên vé, tên chương trình và thông tin vào cửa vẫn phải nhận ra được trong diện tích nhỏ hơn. Thông báo trên điện thoại có thêm điều kiện vì người xem có thể chỉ thấy phần đầu trước khi cuộn, nên vị trí thông tin thiết yếu là một phần của thiết kế.

Hình 1 cung cấp một cách sắp xếp áp phích, với thứ bậc chủ yếu đến từ kích thước và cách gom nhóm. Bố cục khác có thể nhấn mạnh khác, nhưng vẫn cần mối quan hệ dễ hiểu giữa thông tin và diện tích có sẵn. Bắt đầu bằng một họ chữ giúp kiểm tra mối quan hệ này dễ hơn, vì khác biệt kiểu chữ chưa cạnh tranh với khác biệt về kích thước và vị trí.

So sánh kiểu chữ trong cùng bố cục

Có thể bắt đầu so sánh có kiểm soát bằng chi tiết ở độ đậm thường và tiêu đề đậm hơn, rồi làm một phiên bản đảo lại hai lựa chọn. Giữ câu chữ và vị trí ổn định giúp xem tác động của độ đậm qua mức nổi bật của tiêu đề và độ rõ của chữ nhỏ. Phiên bản tiếp theo có thể chỉ thay tiêu đề bằng IBM Plex Serif, giữ chi tiết trong Sans; lúc đó, việc so sánh tập trung vào thay đổi có tạo sự phân biệt hữu ích cho sự kiện hay không.

Vai trò mà họ chữ thứ hai đảm nhiệm xác lập lý do sử dụng nó. Một tiêu đề cần tách biệt rõ có thể phù hợp với chữ có chân, trong khi chi tiết giữ kiểu dùng trên vé; có thêm font sẵn không tự giải thích vì sao chúng nên xuất hiện trong bố cục. Ghi lại lý do lựa chọn giúp đánh giá quyết định khi nội dung thay đổi.

Điều chỉnh nhận diện theo định dạng

Vé và thông báo trên điện thoại có thể lặp lại cách trình bày tên đơn vị tổ chức cùng mối quan hệ giữa tiêu đề và chi tiết, trong khi đổi bố cục cho vừa khổ. Tiêu đề lớn trên áp phích có thể chiếm hai dòng trên điện thoại, giữ vai trò mà không giữ nguyên vị trí hoặc con số cỡ chữ. Thay “Short Film Night” bằng “Student Documentary Screening” tạo tiêu đề dài hơn để kiểm tra khả năng xuống dòng và đáp ứng diện tích bị thu hẹp.

Sự điều chỉnh này là nền tảng của hệ thống typography: một tập hợp lựa chọn có thể lặp lại cho các vai trò xác định, đi kèm ví dụ sử dụng. Kiểu tiêu đề, kiểu chi tiết và cách trình bày tên tổ chức cho người thiết kế tiếp theo nhiều thông tin hơn danh sách tên họ chữ đơn thuần. Nếu tiêu đề dài không còn vừa, có thể so sánh phương án thêm dòng với kiểu hẹp đã được thiết kế trước khi dùng thao tác ép ngang hình chữ.

Kiểm tra thông tin và sự nhất quán thị giác

Một lượt xem thử không chính thức có thể nhờ người khác tìm thời gian, địa điểm và thông tin vào cửa mà không giải thích bố cục, sau đó hỏi riêng họ có thấy ba định dạng liên quan với nhau hay không. Các yêu cầu này xem xét những mặt khác nhau: người đọc có thể nhận ra cách làm tiêu đề lặp lại nhưng bỏ sót thời gian, hoặc dễ tìm chi tiết cần thiết nhưng thấy ít nhất quán giữa các định dạng.

Đặt các phiên bản cạnh nhau và mỗi lần chỉ thay một quyết định giúp hiểu rõ kết quả chỉnh sửa. Tăng cỡ ngày tháng nhưng giữ nguyên kiểu và vị trí cho phép so sánh rõ hơn việc vừa thay họ chữ vừa dời địa điểm. Bài thực hành tạo ra những quan sát về bố cục này và người đọc của nó, chứ không phải bằng chứng một font tốt hơn mọi font khác trong mọi tình huống.

Thử hệ thống typography khi nội dung thay đổi

Có thể kiểm tra sâu hơn bằng cách thêm đoạn mô tả sự kiện, viết ngày tháng dài hơn, bổ sung ngôn ngữ thứ hai có liên quan, tăng cỡ chữ và tạo bản đen trắng. Mỗi thay đổi bộc lộ một giới hạn khác: đoạn văn đặt ra yêu cầu khoảng cách dòng, tiêu đề được dịch kiểm tra ký tự cùng việc xuống dòng, còn bản thang xám cho thấy sự phân biệt quan trọng có phụ thuộc hoàn toàn vào màu hay không.

Khi họ biến thiên có trục độ rộng và độ đậm, có thể so sánh tác động của từng trục trong khi giữ trục còn lại cố định. Ghi các thiết lập thực hiện tốt một vai trò giúp lặp lại chúng, thay vì chọn từ đầu cho mỗi thông báo [23]. Chữ số thay đổi đặt ra một vấn đề khác: chữ số có độ rộng bằng nhau, hay tabular figures, dành cùng khoảng ngang cho từng số để căn cột. Tính năng này có thể có trong font với bảng chữ cái mang độ rộng khác nhau, không khiến toàn bộ font trở thành đơn cách [3].

Một trang mẫu gồm tên tổ chức, tiêu đề ngắn và dài, các chi tiết cần thiết cùng một đoạn văn có thể ghi lại hệ thống bên cạnh tên họ chữ và nguồn giấy phép. Giá trị của trang mẫu tùy vào việc người khác có thể làm thông báo tiếp theo dựa trên những ví dụ ấy hay không. Bài toán thiết kế tiếp tục nằm ở cách đáp ứng nội dung dài hơn, định dạng hẹp hơn và nhu cầu đọc khác nhau, đồng thời giữ những đặc điểm giúp nhận ra tổ chức.

Tài liệu tham khảo

[1] W3C, "CSS Fonts Module Level 3," W3C Recommendation, Sep. 20, 2018. Accessed: Oct. 27, 2026. [Online]. Available: https://www.w3.org/TR/css-fonts-3/

[2] IBM, “IBM Plex,” GitHub repository. Accessed: Oct. 27, 2026. [Online]. Available: https://github.com/IBM/plex

[3] Monotype, "Typography terms and definitions." Accessed: Oct. 27, 2026. [Online]. Available: https://www.monotype.com/resources/expertise/typography-terms-and-definitions

[4] E. Knott, "Alphabet Origins: From Kipling to Sinai," The Metropolitan Museum of Art, Dec. 22, 2014. Accessed: Oct. 28, 2026. [Online]. Available: https://www.metmuseum.org/exhibitions/listings/2014/assyria-to-iberia/blog/posts/alphabet

[5] Harvard University, "Types of Script," Geoffrey Chaucer's Website. Accessed: Oct. 28, 2026. [Online]. Available: https://chaucer.fas.harvard.edu/types-script

[6] Florida State University Libraries, "Early Asian movable type," History of Text Technologies. Accessed: Oct. 27, 2026. [Online]. Available: https://guides.lib.fsu.edu/hott/printing/earlyasian

[7] Bibliothèque nationale de France, "Jikji, a treasure of the world of printing," Accessed: Oct. 28, 2026. [Online]. Available: https://www.bnf.fr/en/jikji-treasure-world-printing

[8] Gutenberg-Gesellschaft, "Gutenberg's invention." Accessed: Oct. 27, 2026. [Online]. Available: https://www.gutenberg-gesellschaft.de/en/johannes-gutenberg/gutenbergs-invention/seite

[9] City of Mainz, "Gutenberg's invention," Accessed: Oct. 28, 2026. [Online]. Available: https://www.gutenberg.de/en/erfindung/

[10] Library of Congress, "The Gutenberg Bible at the Library of Congress: A Resource Guide," Accessed: Oct. 28, 2026. [Online]. Available: https://guides.loc.gov/gutenberg

[11] Stanford Humanities Center, "Rare Books Chronicle the Evolution of the Printed Word," Oct. 31, 2011. Accessed: Oct. 28, 2026. [Online]. Available: https://shc.stanford.edu/stanford-humanities-center/news/rare-books-chronicle-evolution-printed-word-0

[12] Science Museum Group, "Three small printing formes representing various phases of Linotype," Collection object 1928-1067. Accessed: Oct. 28, 2026. [Online]. Available: https://collection.sciencemuseumgroup.org.uk/objects/co37926/three-small-printing-formes-representing-various-phases-of-linotype

[13] Rudolf Hell Technical Collection, "Typesetting technology," Accessed: Oct. 28, 2026. [Online]. Available: https://www.hell-kiel.de/en/hell-development/typesetting-technology

[14] MyFonts, "Manual: Making Helvetica Choices." Accessed: Oct. 27, 2026. [Online]. Available: https://www.myfonts.com/a/font/content/the-font-manual/making-helvetica-choices/

[15] Computer History Museum, "Video Displays," Revolution: The First 2000 Years of Computing. Accessed: Oct. 28, 2026. [Online]. Available: https://www.computerhistory.org/revolution/input-output/14/349

[16] A. V. Hershey, "Calligraphy for Computers," U.S. Naval Weapons Laboratory, Technical Report 2101, Aug. 1, 1967; original report transcribed on Wikisource. Accessed: Oct. 28, 2026. [Online]. Available: https://en.wikisource.org/wiki/Calligraphy_for_Computers

[17] Linotype, "Digi Grotesk," MyFonts. Accessed: Oct. 28, 2026. [Online]. Available: https://www.myfonts.com/collections/digi-grotesk-font-linotype

[18] Microsoft, "TrueType overview," Microsoft Learn. Accessed: Oct. 28, 2026. [Online]. Available: https://learn.microsoft.com/en-us/typography/truetype/

[19] S. Kare, "World Class Cities," Folklore.org; firsthand recollection of early Macintosh font development. Accessed: Oct. 28, 2026. [Online]. Available: https://folklore.org/World_Class_Cities.html?sort=date%3Fsort%3Ddate

[20] Adobe, "Adobe PostScript," Accessed: Oct. 28, 2026. [Online]. Available: https://www.adobe.com/products/postscript.html

[21] Microsoft, "OpenType overview," Microsoft Learn. Accessed: Oct. 28, 2026. [Online]. Available: https://learn.microsoft.com/en-us/typography/opentype/

[22] W3C, "WOFF File Format 2.0," Accessed: Oct. 28, 2026. [Online]. Available: https://www.w3.org/TR/WOFF2/

[23] W3C, “CSS Fonts Module Level 4.” Accessed: Oct. 27, 2026. [Online]. Available: https://www.w3.org/TR/css-fonts-4/

[24] A. Haley, “Helvetica: the Prequel,” Fonts.com, Jun. 6, 2011, preserved by MyFonts. Accessed: Oct. 28, 2026. [Online]. Available: https://www.myfonts.com/pages/fontscom-2011-06-06-helvetica-the-prequel

[25] MyFonts, “Neue Helvetica,” Linotype family and licensing information. Accessed: Oct. 28, 2026. [Online]. Available: https://www.myfonts.com/collections/neue-helvetica-font-linotype

[26] Microsoft, “Arial font family,” Microsoft Learn. Accessed: Oct. 28, 2026. [Online]. Available: https://learn.microsoft.com/en-us/typography/font-list/arial

[27] Microsoft, “Font redistribution FAQ (Frequently Asked Questions) for Windows,” Microsoft Learn. Accessed: Oct. 28, 2026. [Online]. Available: https://learn.microsoft.com/en-us/typography/fonts/font-faq

[28] The Coca-Cola Company, “Wie heeft de naam en het logo van Coca-Cola bedacht?” Accessed: Oct. 27, 2026. [Online]. Available: https://www.coca-cola.com/be/nl/about-us/faq/wie-heeft-de-naam-en-het-logo-vancocacolabedacht

[29] Google Design, “Evolving the Google identity,” Sep. 1, 2015. Accessed: Oct. 27, 2026. [Online]. Available: https://design.google/library/evolving-google-identity

[30] Google Design, “Making Google Sans Flex.” Accessed: Oct. 27, 2026. [Online]. Available: https://design.google/library/google-sans-flex-font

[31] The Google Sans Project Authors, “SIL Open Font License, Version 1.1,” Google Fonts, 2025. Accessed: Oct. 27, 2026. [Online]. Available: https://github.com/google/fonts/blob/ddf386ba1b9fbc6b2c818f1ddcd9148f54ced94b/ofl/googlesans/OFL.txt

[32] The Google Sans Flex Authors, “SIL Open Font License, Version 1.1,” Google Fonts, 2015. Accessed: Oct. 27, 2026. [Online]. Available: https://github.com/google/fonts/blob/ddf386ba1b9fbc6b2c818f1ddcd9148f54ced94b/ofl/googlesansflex/OFL.txt

[33] Google Fonts, “Product Sans license.” Accessed: Oct. 27, 2026. [Online]. Available: https://fonts.google.com/license/productsans

[34] Bold Monday, “IBM.” Accessed: Oct. 27, 2026. [Online]. Available: https://boldmonday.com/custom/ibm/

[35] IBM, “SIL Open Font License, Version 1.1,” IBM Plex, 2017. Accessed: Oct. 27, 2026. [Online]. Available: https://github.com/IBM/plex/blob/master/LICENSE.txt

[36] J. Siracusa, “OS X 10.10 Yosemite: The Ars Technica Review,” Ars Technica, Oct. 16, 2014. Accessed: Oct. 28, 2026. [Online]. Available: https://arstechnica.com/gadgets/2014/10/os-x-10-10/

[37] Apple, “Apple Announces OS X El Capitan with Refined Experience & Improved Performance,” Jun. 8, 2015. Accessed: Oct. 28, 2026. [Online]. Available: https://www.apple.com/newsroom/2015/06/08Apple-Announces-OS-X-El-Capitan-with-Refined-Experience-Improved-Performance/

[38] M. Maxfield, “Using the System Font in Web Content,” WebKit, Jul. 27, 2015. Accessed: Oct. 28, 2026. [Online]. Available: https://webkit.org/blog/3709/using-the-system-font-in-web-content/

[39] Apple, “Meet the expanded San Francisco font family,” WWDC22, 2022. Accessed: Oct. 28, 2026. [Online]. Available: https://developer.apple.com/videos/play/wwdc2022/110381/

[40] Apple, “Fonts,” Apple Developer. Accessed: Oct. 27, 2026. [Online]. Available: https://developer.apple.com/fonts/

[41] Apple, “The details of UI typography,” WWDC20, 2020. Accessed: Oct. 28, 2026. [Online]. Available: https://developer.apple.com/videos/play/wwdc2020/10175/

[42] Apple, “Get started with Dynamic Type,” WWDC24, 2024. Accessed: Oct. 27, 2026. [Online]. Available: https://developer.apple.com/videos/play/wwdc2024/10074/

[43] Dalton Maag, “Netflix Sans.” Accessed: Oct. 27, 2026. [Online]. Available: https://www.daltonmaag.com/portfolio/custom-fonts/netflix-sans.html

[44] Spotify, “Introducing Spotify Mix, our new and exclusive font,” For the Record, May 22, 2024. Accessed: Oct. 27, 2026. [Online]. Available: https://newsroom.spotify.com/2024-05-22/introducing-spotify-mix-our-new-and-exclusive-font/

[45] Dinamo, “The Dinamo Update: New Spotify Custom Typeface.” Accessed: Oct. 27, 2026. [Online]. Available: https://abcdinamo.com/newsletter/the-dinamo-update-new-spotify-custom-typeface

[46] SIL International, "OFL-FAQ, version 1.1-update7," Nov. 2023. Accessed: Oct. 28, 2026. [Online]. Available: https://openfontlicense.org/ofl-faq/

[47] The Noto Project, "Noto CJK fonts," Accessed: Oct. 28, 2026. [Online]. Available: https://github.com/notofonts/noto-cjk

[48] Google Fonts, "Noto Sans metadata," Accessed: Oct. 28, 2026. [Online]. Available: https://raw.githubusercontent.com/google/fonts/main/ofl/notosans/METADATA.pb

[49] Google Fonts, "Noto Serif metadata," Accessed: Oct. 28, 2026. [Online]. Available: https://raw.githubusercontent.com/google/fonts/main/ofl/notoserif/METADATA.pb

[50] Adobe, "Source Han Sans," Accessed: Oct. 28, 2026. [Online]. Available: https://github.com/adobe-fonts/source-han-sans

[51] Google Fonts, "Source Sans 3 metadata," Accessed: Oct. 28, 2026. [Online]. Available: https://raw.githubusercontent.com/google/fonts/main/ofl/sourcesans3/METADATA.pb

[52] Adobe, "Source Han Serif," Accessed: Oct. 28, 2026. [Online]. Available: https://github.com/adobe-fonts/source-han-serif

[53] Google Fonts, "Source Serif 4 metadata," Accessed: Oct. 28, 2026. [Online]. Available: https://raw.githubusercontent.com/google/fonts/main/ofl/sourceserif4/METADATA.pb

[54] Google Fonts, "IBM Plex Sans metadata," Accessed: Oct. 28, 2026. [Online]. Available: https://raw.githubusercontent.com/google/fonts/main/ofl/ibmplexsans/METADATA.pb

[55] Google Fonts, "Inter metadata," Accessed: Oct. 28, 2026. [Online]. Available: https://raw.githubusercontent.com/google/fonts/main/ofl/inter/METADATA.pb

[56] The Noto Project, "Downloading Noto Sans CJK," Accessed: Oct. 28, 2026. [Online]. Available: https://raw.githubusercontent.com/notofonts/noto-cjk/main/Sans/README.md

[57] W3C, “CSS Text Module Level 3,” sec. 7.2, “Tracking: the letter-spacing property.” Accessed: Oct. 27, 2026. [Online]. Available: https://www.w3.org/TR/css-text-3/#letter-spacing-property

[58] W3C, "Understanding SC 1.4.3: Contrast (Minimum)," WCAG 2.2 Understanding Docs. Accessed: Oct. 27, 2026. [Online]. Available: https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html