Xem Part 01 - Tính năng website
Xem Part 02 - Giao diện website
Xem Part 03 - Kích thước website
Part 04 - Typography trong thiết kế web (Bạn đang ở đây)
Typography là một đặc tính nâng cao của gói thiết kế web chuẩn, không phải là đặc tính thông dụng.
Typography trong nghệ thuật
Typography là nghệ thuật sử dụng các phông chữ, cỡ chữ khác nhau và những cách điệu cần thiết từ chữ cái, con số kết hợp với công cụ kỹ thuật số để tạo ra những hình ảnh có hiệu quả thẩm mỹ hoặc chuyển tải một ý nghĩa nhất định. Dưới đây là một số tác phẩm typography.
Typography trong thiết kế web
Trong lĩnh vực thiết kế website, typography ám chỉ những định dạng (format) của văn bản. Điểm khác biệt của những định dạng này so với định dạng văn bản thông thường là nó không chỉ chứa đựng nội dung thông tin nhưng còn diễn đạt nội dung mỹ thuật, giúp tô điểm cho website, làm cho thiết kế website của bạn thêm màu sắc và cá tính.
Typography cho website đã bắt đầu từ những năm đầu tiên mà www ra đời bởi Tim Berners-Lee, ngay từ những ngày của IE phiên bản 1, web typography tốt hầu như chỉ là những từ sử dụng "phép nghịch hợp" như ánh sáng tối, nhạc cổ điển mới, người chết đang sống, thực tại ảo, ...
Ngày nay, mọi thứ đã thay đổi đáng kể, các trình duyệt hiện đại không chỉ hỗ trợ hình ảnh nhưng với những hiệu ứng CSS3 / HTML5 hỗ trợ, ta có thể sử dụng typography để biến website thành những thiết kế sống động, không chỉ đơn thuần là những dòng chữ bình thường, đơn điệu.
Nên lưu ý Typography bao gồm nhiều khía cạnh, trong đó có việc phải chọn font chữ, cỡ chữ và typeface (tập hợp các font, size đi với nhau) để tạo nên nét 'cá tính' cho trang web của mình. Tuy nhiên, chỉ dừng lại ở font chữ thôi thì chưa đủ mà nó còn cần nhiều hơn thế, theo 1 'tin hành lang' thì thậm chí những con khỉ được đào tạo có thể xác định font Helvetica một cách dễ dàng (90%).
Đúng thế, Typography không chỉ đơn thuần là font chữ nhưng là sự tổng hợp của 7 yếu tố
- Font (font chữ)
- Colors - Icons (màu sắc và icons)
- Contrast (độ tương phản)
- Size (kích cỡ)
- Hierarchy (cấu trúc)
- Space (không gian)
Sau khi đã xác định những yếu tố này và những mẫu Typography thích hợp được tạo ra, chúng sẽ được gắn vào những thẻ HTML thông dụng cũng như những CSS classes chuyên biệt để webmaster (quản trị web) có thể sử dụng dễ dàng trong các web text editor (trình soạn thảo văn bản web).
Ví dụ, trong web4u.vn, đoạn text dưới đây tạo nên sự tương phản
thiet ke web Sunrise
Đoạn text typography trên khá đơn giản nhưng nếu kết hợp với bố cục giao diện nền đen sang trọng của web4u.vn có thể tạo nên sự tương phản nhất định và đoạn hiệu ứng typo này được đóng gói lại thành 1 option trong web text editor để giúp việc soạn thảo văn bản web dễ dàng hơn.
Typography được đóng gói thành style article-body-highlight giúp việc soạn thảo văn bản được dễ dàng hơn.
| < Prev | Next > |
|---|