Typography là gì và, bằng cách mở rộng, thiết kế typographic? Để sử dụng giải thích cơ bản nhất, typography là thiết kế và sử dụng kiểu chữ như một phương tiện giao tiếp. Nhiều người cho rằng kiểu chữ đã bắt đầu với Gutenberg và sự phát triển của loại di chuyển, nhưng kiểu chữ quay trở lại xa hơn thế. Chi nhánh thiết kế này thực sự có nguồn gốc từ các dạng chữ viết tay. Typography bao gồm tất cả mọi thứ từ thư pháp thông qua các loại kỹ thuật số mà chúng ta thấy ngày hôm nay trên các trang web của tất cả các loại. Nghệ thuật kiểu chữ cũng bao gồm các nhà thiết kế kiểu người tạo ra các dạng chữ mới sau đó được chuyển thành các tệp phông chữ mà các thiết kế khác có thể sử dụng trong công việc của họ, từ các tác phẩm in đến các trang web nói trên. Khác với những tác phẩm đó, các khái niệm cơ bản về kiểu chữ đều nhấn mạnh tất cả.
Các yếu tố của Typography
Kiểu chữ và phông chữ: Nếu bạn đã từng nói với một thiết kế sử dụng kiểu chữ trong tác phẩm của họ, bạn có thể đã nghe các cụm từ "kiểu chữ" và / hoặc "phông chữ". Nhiều người sử dụng hai thuật ngữ này thay thế cho nhau, nhưng thực sự có một số khác biệt giữa hai mục này.
"Typeface" là các từ dành cho một nhóm phông chữ (như Helvetica Regular, Helvetica Italic, Helvetica Black và Helvetica Bold ). Tất cả các phiên bản khác nhau của Helvetica tạo nên kiểu chữ hoàn chỉnh.
"Font" là thuật ngữ được sử dụng khi ai đó đang đề cập đến chỉ một trọng lượng hoặc phong cách trong gia đình đó (chẳng hạn như Helvetica Bold). Vì vậy, nhiều kiểu chữ bao gồm một số phông chữ riêng lẻ, tất cả đều giống nhau và có liên quan nhưng khác nhau theo một cách nào đó. Một số kiểu chữ chỉ có thể bao gồm một phông chữ duy nhất, trong khi các kiểu chữ khác có thể bao gồm nhiều biến thể của các dạng chữ tạo nên phông chữ.
Điều này có vẻ hơi khó hiểu không? Nếu vậy, đừng lo lắng. Trong thực tế, nếu ai đó không phải là chuyên gia về kiểu chữ, họ có thể sử dụng thuật ngữ "font" bất kể một trong những thuật ngữ này thực sự có ý nghĩa gì - và thậm chí nhiều nhà thiết kế chuyên nghiệp sử dụng hai thuật ngữ này thay thế nhau. Trừ khi bạn đang nói chuyện với một nhà thiết kế kiểu thuần túy về cơ chế của nghề thủ công, bạn có thể khá an toàn khi sử dụng bất kỳ điều nào trong hai thuật ngữ mà bạn muốn. Điều đó đang được nói, nếu bạn hiểu sự khác biệt và có thể sử dụng đúng các thuật ngữ chính xác, điều đó không bao giờ là điều xấu!
Phân loại phông chữ : Đôi khi được gọi là "họ phông chữ chung" , đây là các nhóm phông chữ lớn dựa trên một số phân loại chung mà các phông chữ khác nhau rơi vào .. Trên các trang Web , có sáu loại phân loại phông chữ mà bạn có thể thấy:
- serif
- sans serif
- đơn điệu
- chữ thảo
- tưởng tượng
- kịch bản
Ngoài ra còn có một số phân loại phông chữ khác được offshoots này. Ví dụ, phông chữ "slab serif" tương tự như serif, nhưng tất cả chúng đều có thiết kế dễ nhận biết với các phông chữ dày, chunky trên các dạng chữ.
Một trang web ngày nay, serif và sans-serif là hai phân loại phông chữ phổ biến nhất được sử dụng.
Typeface Anatomy: Mỗi kiểu chữ được tạo thành từ các yếu tố khác nhau phân biệt nó với các kiểu chữ khác. Trừ khi bạn đặc biệt sẽ đi vào thiết kế kiểu và tìm cách để tạo ra các phông chữ mới, các nhà thiết kế web thường không cần biết các chi tiết cụ thể về giải phẫu kiểu chữ. Nếu bạn quan tâm đến việc tìm hiểu thêm về các khối xây dựng kiểu chữ và dạng chữ này, có một bài viết tuyệt vời về giải phẫu kiểu chữ trên trang web xuất bản máy tính để bàn About.com.
Ở cấp độ cơ bản, các yếu tố giải phẫu kiểu chữ mà bạn cần biết là:
- Cap và x-height: Đây là chiều cao của các chữ in hoa trong kiểu chữ và chiều cao của chữ cái x. Nó cho bạn biết các chữ cái lớn nhất sẽ cao bao nhiêu, cũng như các chữ thường lớn nhất sẽ như thế nào. Phông chữ có kích thước dựa trên hai đặc điểm này.
- Decenders and ascenders: Đây là các phần của các chữ cái nằm bên dưới và trên dòng x-height . Những thông tin này thường đề cập đến các chữ thường. Ví dụ, chữ cái "b" có chữ ascender (mảnh ghép "lên" từ chữ cái) trong khi chữ cái "p" có phần nhỏ (các phần nhỏ xuống "từ chữ").
Khoảng cách xung quanh chữ cái
Có một số điều chỉnh có thể được thực hiện giữa và xung quanh các chữ cái ảnh hưởng đến kiểu chữ. Phông chữ kỹ thuật số được tạo ra với nhiều đặc điểm này tại chỗ và trên các trang web, chúng tôi có khả năng hạn chế thay đổi các khía cạnh này của phông chữ. Điều này thường là một điều tốt vì cách mặc định phông chữ được hiển thị thường là thích hợp hơn.
- kerning - không gian ngang giữa các chữ cái riêng lẻ
- theo dõi - khoảng cách giữa các nhóm chữ cái
- hàng đầu - không gian dọc giữa các dòng của loại (điều này được gọi là chiều cao dòng trong điều khoản trang web)
- đo lường - độ dài của dòng văn bản
- căn chỉnh - đặt văn bản trực quan sang trái, phải, căn giữa hoặc chính xác
- ligatures - các chữ cái được di chuyển gần nhau sao cho các giải phẫu của chúng được kết hợp, về cơ bản đang chảy một chữ cái vào một chữ cái khác
Các yếu tố Typography khác
Typography không chỉ là kiểu chữ được sử dụng và khoảng trắng xung quanh chúng. Ngoài ra còn có một số điều khác bạn nên ghi nhớ khi tạo ra một hệ thống typographic tốt cho bất kỳ thiết kế nào:
Gạch nối: Gạch nối là dấu gạch ngang (-) ở cuối dòng để giúp ngăn chặn các vấn đề dễ đọc hoặc làm cho việc biện minh tốt hơn. Trong khi thường được tìm thấy trong các tài liệu in, hầu hết các nhà thiết kế web bỏ qua hyphenation và không sử dụng nó trong công việc của họ bởi vì nó không phải là một cái gì đó được xử lý tốt tự động bởi các trình duyệt web.
Rag: Cạnh thẳng đứng không đồng đều của một khối văn bản được gọi là giẻ rách. Khi chú ý đến kiểu chữ, bạn nên xem xét toàn bộ khối văn bản để đảm bảo rằng rag không ảnh hưởng đến thiết kế. Nếu rag quá lởm chởm hoặc không đồng đều, nó có thể ảnh hưởng đến khả năng đọc của khối văn bản và làm cho nó mất tập trung. Đây là một cái gì đó được tự động xử lý bởi trình duyệt về cách nó raps loại từ dòng này sang dòng khác.
Góa phụ và trẻ mồ côi: Một từ duy nhất ở cuối cột là góa phụ và nếu nó ở trên cùng của một cột mới thì đó là một đứa trẻ mồ côi. Góa phụ và trẻ mồ côi trông xấu và có thể khó đọc.
Bắt các dòng văn bản của bạn hiển thị hoàn hảo trong trình duyệt web là một đề xuất mệt mỏi, đặc biệt khi bạn có trang web đáp ứng và các màn hình khác nhau cho các kích thước màn hình khác nhau.Bạn nên xem xét trang web ở các kích thước khác nhau để cố tạo giao diện đẹp nhất có thể, trong khi chấp nhận điều đó trong một số trường hợp, nội dung của bạn sẽ có cửa sổ, trẻ mồ côi hoặc các màn hình ít lý tưởng khác. Mục tiêu của bạn nên là giảm thiểu các khía cạnh này trong thiết kế của một loại, trong khi cũng thực tế trong thực tế là bạn không thể đạt được sự hoàn hảo cho mọi kích thước màn hình và hiển thị.
Các bước để kiểm tra Typography của bạn
- Chọn kiểu chữ một cách cẩn thận, nhìn vào giải phẫu của loại cũng như loại gia đình của nó.
- Nếu bạn xây dựng thiết kế bằng văn bản trình giữ chỗ , không chấp nhận thiết kế cuối cùng cho đến khi bạn thấy văn bản thực trong thiết kế.
- Chú ý đến các chi tiết nhỏ của kiểu chữ .
- Nhìn vào từng khối văn bản như thể nó không có từ nào trong đó. Văn bản tạo ra hình dạng gì trên trang? Đảm bảo rằng các hình dạng đó mang toàn bộ thiết kế trang về phía trước.
Bài báo gốc của Jennifer Krynin. Biên tập bởi Jeremy Girard vào 7/5/17