Thứ sáu, ngày 28 tháng 8 năm 2009

Giới thiệu Người Tập Viết 6.0

Người Tập Viết 6 với chủ đề "Cherry Blossom"

Người Tập Viết 6 với chủ đề "Cherry Blossom"

Những ai theo dõi Người Tập Viết từ những năm đầu tiên đến nay có lẽ đều biết đến truyền thống giới thiệu giao diện mới mỗi năm của Người Tập Viết. Mặc dù mỗi lần thiết kế lại là một thử nghiệm thú vị về những gì tớ học được sau mỗi năm về thiết kế web, quá trình này đòi hỏi ngày càng nhiều sự đầu tư về thời gian – một điều mà khi còn là sinh viên không phải là một vấn đề lớn nhưng sẽ khó hơn trong tương lai.

Với suy nghĩ đó, dù chưa đến hẹn (phiên bản 5.0 chỉ mới được ra mắt cách đây gần 7 tháng), tranh thủ thời gian còn được nghỉ sau khi tốt nghiệp tớ quyết định một lần nữa thiết kế lại Người Tập Viết. Giao diện lần này được thiết kế với mục đích sử dụng trong một thời gian dài và vì vậy đã được tớ đầu tư khá kỹ lưỡng. Bên cạnh những thay đổi về giao diện, tớ cũng tái cấu trúc và đơn giản hóa hệ thống các phân mục bài viết với hi vọng sẽ giúp việc tìm các bài viết cũ dễ dàng hơn. Bài viết này sẽ giới thiệu về giao diện mới, cũng như về những thay đổi đó.

Chủ đề thiết kế mới: “Cherry Blossom”

Chủ đề của thiết kế lần này là hoa anh đào (một loài hoa rất thường thấy trong phim Hàn) với tông màu nhẹ nhàng và lãng mạn. Giao diện mới vẫn lấy bố cục 3 cột và theo mặc định được  canh lề trái như trong phiên bản trước nhưng với hệ thống lưới được cải thiện đáng kể. Người Tập  Viết 5.0 có thể nói là lần đầu tiên tớ thử ứng dụng hệ thống lưới vào thiết kế của mình, nhưng mặc dù nói là sử dụng hệ thống lưới, hiệu quả của ứng dụng đó vẫn không rõ ràng.

Hệ thống lưới là một công cụ hỗ trợ, nhưng nó không bảo đảm [một thiết kế sẽ thành công]. Nó cung cấp một số cách sử dụng nhất định mà mỗi người làm thiết kế có thể tìm cách sử dụng để phù hợp với phong cách riêng của anh ta. Một người thiết kế phải học cách để sử dụng hệ thống lưới; đó là một nghệ thuật đòi hỏi sự rèn luyện.

(Josef Muller-Brockmann1)

Trong khoảng thời gian từ đó đến nay, tớ đã đọc, tìm hiểu cũng như thử sử dụng hệ thống lưới này trong một vài thiết kế khác nhau và có thể nói cũng đã biết thêm được đôi điều để áp dụng trong thiết kế lần này. Chủ đề về thiết kế sử dụng hệ thống lưới quả thật nằm ngoài phạm vi của bài viết và một lần nữa tớ phải hẹn sẽ viết trong một dịp khác, nhưng các bạn có lẽ cũng sẽ cảm nhận được sự cân bằng trong thiết kế lần này (Bạn cũng có thể xem hệ thống lưới đằng sau giao diện lần này bằng cách nhấn tổ hợp phím Ctrl+G).

Trong thiết kế lần này tớ cũng thử ứng dụng tính năng mới của CSS 3 cho phép đính kèm font chữ tùy biến. Một trong những vấn đề trong lĩnh vực thiết kế web hiện tại là sự giới hạn của số lượng kiểu chữ được cài đặt sẵn trên các máy tính. Người thiết kế thường bị giới hạn trong một số font chữ được cài đặt mặc định theo các hệ điều hành (Windows/Mac) như Arial/Helvetica, Georgia, Times New Roman,…2. Những người làm thiết kế web Việt Nam còn gặp nhiều khó khăn hơn nữa khi số lượng font chữ Unicode hỗ trợ tiếng Việt chỉ có thể được đếm trên đầu ngón tay, bao gồm: Arial, Times New Roman, Verdana và Tahoma3. Phiên bản CSS 3 hỗ trợ thẻ font-face cho phép người thiết kế web có thể đưa font chữ mình muốn trực tiếp lên máy chủ và trình duyệt sẽ tải về máy người dùng kèm theo các trang web, giải phóng họ khỏi những giới hạn trên. Rất đáng tiếc, hiện tại chỉ có một vài trình duyệt mới nhất hỗ trợ tính năng này4. Nếu bạn sử dụng trình duyệt FF3.5 hoặc Safari 3.1 trở lên, bạn sẽ thấy nội dung Người Tập Viết với font chữ Chelthm như trong hình chụp ở dưới5.

Kiểu chữ Chelthm trên Mac OS X với Firefox 3.5

Kiểu chữ Chelthm trên Mac OS X với Firefox 3.5

Cuối cùng, những ai sử dụng Firefox, Safari hay IE8 sẽ có thể chọn chế độ canh lề của khung nội dung.

Tái cấu trúc nội dung

Một mục tiêu khác của phiên bản lần này là tái cấu trúc lại nội dung. Kể từ khi Wordpress bắt đầu hỗ trợ tính năng sử dụng thẻ chủ đề (”tag”), việc sử dụng hệ thống phân mục và hệ thống thẻ trở nên rất khó để phân biệt. Nhân lần cập nhật này, tớ đã duyệt lại tất cả các bài viết, cập nhật lại thẻ chủ đề cho những bài viết cũ, đồng thời tinh giản hệ thống phân mục bài viết. Hệ thống lưu trữ bài viết cũng được cập nhật lại để giúp việc đọc các bài viết cũ được dễ dàng hơn theo phân mục, chủ đề hoặc thời gian (bạn có thể xem danh sách đầy đủ hoặc xem chi tiết). Và cuối cùng, để tiện cho những ai mới ghé thăm Người Tập Viết lần đầu tiên, trang Tìm Kiếm bài viết cũng bao gồm một danh sách những bài viết mà tớ cho là đáng chú ý mỗi năm.

Đợi phản hồi của các bạn

Như đã nói ở đầu bài viết, giao diện lần này được thiết kế với mục đích sử dụng lâu dài và sẽ tiếp tục được hoàn thiện thông qua những phản hồi của các bạn. Cá nhân tớ rất hài lòng với thiết kế mới và tớ hi vọng rằng các bạn cũng sẽ thích nó.

Chú thích trong bài:

  1. Josef Muller-Brockmann là một nhà thiết kế nổi tiếng người Thụy Sĩ, là tác giả của nhiều cuốn sách nổi tiếng về thiết kế sử dụng hệ thống lưới Grid Systems in Graphic Design [↩]
  2. danh sách các font chữ cài đặt mặc định trên các máy tính PC và Mac có thể tìm thấy ở đây [↩]
  3. thực tế là số lượng font chữ Unicode hỗ trợ tiếng Việt không thiếu, nhưng vấn đề là chúng không được cài đặt sẵn trên máy người sử dụng [↩]
  4. Danh sách các trình duyệt hỗ trợ thẻ font-face có thể tìm thấy ở đây [↩]
  5. Một điều khá thất vọng là vì công nghệ làm nét (”anti-alias”) của Windows không thật sự hoàn hảo nên font chữ nhìn không được sắt nét (trên Mac nhìn tuyệt). Mặc dù vậy, tớ vẫn muốn thử để xem mọi người thấy thế nào. [↩]

Phân mục Thiết kế
Chủ đề bài viết gồm ,

Phản hồi về bài viết

Chú ý: Bạn có thể dụng định dạng @ + tên + ':' để trả lời cho người khác tham gia trong phần thảo luận (người đó sẽ nhận được thông báo bằng email về phản hồi của bạn). Ví dụ, nếu Nguyen A có tham gia trong cuộc thảo luận và bạn muốn trả lời cho ý của A, bạn có thể dùng "@Nguyen A: nội dung".