"Tốt gỗ hơn tốt nước sơn" - Càng nghĩ càng thấy câu tục ngữ rất có ý nghĩa, bởi vì thiết kế giao diện chỉ là 1 phần rất nhỏ và tốn rất ít thời gian trong thiết kế website. Chỉ cần gỗ tốt, bạn có thể sơn cho nó một nước sơn mới bất kỳ lúc nào!
Cùng một loại website như nhau, cùng một hình thức bố cục giao diện, cùng chức năng, nhưng mức độ chuyên nghiệp và chất lượng website lại khác nhau. Bởi vì các tiêu chí để đánh giá một website tốt không dựa trên cái nhìn trực quan mà dựa trên các phương diện kỹ thuật thực hiện website đó. Các tiêu chí bao gồm:
1. Chất lượng mã (code) (x)HTML + CSS theo chuẩn web (Web standards)
- Mã (x)HTML phải sử dụng đúng Doctype, đúng charset (mã ngôn ngữ).
- Mã (x)HTML và CSS phải hợp lệ, đúng chuẩn. Có thể kiểm tra tại http://validator.w3.org/
- Mã (x)HTML không sử dụng các element, id hoặc class thừa trong cấu trúc DOM, không phức tạp hóa cấu trúc DOM.
- Website không có liên kết (link) hỏng.
- Website có kích thước trang nhỏ, tốc độ tải cao. Có thể hiển thị mã (x)HTML để biết được điều này.
- Website không được có lỗi JavaScript.
HTML Layout (giao diện HTML) cần được chăm chút kỹ:
- HTML (Hypertext Markup Language) là ngôn ngữ đánh dấu siêu văn bản, được sử dụng để dàn layout cho website. Hầu hết các nhà thiết kế web sử dụng thẻ <TABLE> của HTML để đưa các thành phần website đúng vị trí của nó và dùng CSS để tùy chỉnh khi cần thiết. Đây là cách làm cổ điển còn rất nhiều hạn chế: không linh động, tốc động load chậm...
- Từ khi CSS2 ra đời, đã hướng công nghệ Web sang một hướng đi mới đó là Web++ hay Web2.0 sử dụng thẻ <DIV> + CSS2 để dàn layout đẩy tốc độ load web tăng lên đáng kể, đồng thời khả năng chỉnh sửa, mở rộng về sau trở nên dễ dàng hơn rất nhiều. Và từ đó layout <DIV> + CSS2 trở thành một tiêu chí đầu tiên đồng thời là tiêu chí không thể thiếu khi đánh giá chất lượng website.
2. Độ tách biệt giữa nội dung và giao diện
- Cần phải sử dụng CSS cho tất cả các khía cạnh của giao diện (như font, màu, khoảng trống, đường viền...), nếu trực tiếp đưa các tùy chỉnh này vào (x)HTML sẽ làm dung lượng trang web tăng lên và tốc độ load giảm xuống.
- Hình ảnh trang trí phải được thể hiện trong CSS, không được đưa vào trong mã (x)HTML
3. Tính thuận tiện cho người truy cập
- Tất cả hình ảnh minh họa đều phải dùng mã "alt".
- Kích thước font chữ cần phải lấy theo đơn vị tương đối, giúp cho người truy cập có thể thay đổi kích thước font ưu nhìn nhất của họ dựa trên tính năng được các trình duyệt web hỗ trợ sẵn
- Giao diện không được bể vỡ, mất cân đối, lồi lõm không có chủ đích.
- Có sử dụng neo cho các nội dung dài, thuận tiện cho người truy cập xem từng phần nội dung của bạn.
- Website có sử dụng các form, bảng dữ liệu một cách hợp lý. Chú ý: bảng (mã <TABLE> trong (x)HTML) chỉ hợp lý để trình bày dữ liệu dạng bảng như bảng điểm, bảng phân công... nếu sử dụng bảng để bố cục giao diện thì sẽ ảnh hưởng đến tốc độ load của website, đồng thời do tính rời rạc của các thẻ con trong bảng sẽ phức tạp hóa nội dung cấu trúc DOM, gây khó khăn cho việc phát triển website. Sử dụng bảng để bố cục giao diện tuy có nhiều hạn chế như thế nhưng đa số các cty thiết kế web đều qua mặt khách hàng để sử dụng nó. Lý do là cách làm cổ điển này dễ thực hiện (không yêu cầu kiến thức chuyên sâu về (x)HTML + CSS dùng DIV).
- Độ tương phản, độ sáng của website phải phù hợp, không gây mỏi hoặc chói mắt người truy cập.
- Có điểm nhấn thể hiện các nội dung quan trọng với các màu sắc để người mù màu vẫn có thể nhìn thấy.
- Các menu thả xuống cần có một thời gian trễ để hiển thị.
- Không lạm dụng hình ảnh nhảy nhót, cử động làm mất tập trung vào nội dung chính. Đừng bao giờ quan niệm "chạy chạy cho đẹp" vì mục đích đó không đáng được đầu tư và đó không phải là mục đích thành lập website. Chỉ sử dụng các hiệu ứng này tại điểm nhấn, khu vực kích thích tầm mắt, và nội dung quang trọng... Webdesigner giỏi phải biết kết hợp giữa mục đích chính đáng khi thực hiện ảnh động và mỹ thuật của website.
4. Thuận tiện khi hiển thị trên các thiết bị khác nhau
- Website hiển thị tốt trên các phiên bản trình duyệt? Kể cả cũ và mới.
- Website hiển thị tốt ngay cả khi trình duyệt không hỗ trợ CSS.
- Website hiển thị tốt ngay cả khi trình duyệt không cho phép hiển thị hình ảnh.
- Website hiển thị tốt trên bản in.
- Website hiển thị tốt trên các thiết bị nhỏ (điện thoạt di động, PocketPC...)
- Website có đầy đủ thông tin về Metadata
- Website hiển thị tốt trên các kích thước trình duyệt khác nhau hoặc khi thay đổi kích thước trình duyệt
5. Tính hữu dụng
- Website có cấu trúc phân cấp tốt
- Các tiêu đề trên các trang phải dễ nhận ra
- Di chuyển, điều hướng (= navigation, menu, tab) trong website dễ dàng, cách di chuyển trong website phù hợp
- Website sử dụng ngôn ngữ đúng và phù hợp
- Website cần có trang bản đồ site (site map) và trang liên hệ, chúng phải dễ thấy
- Trang cần có công cụ tìm kiếm (dành cho website lớn)
- Cần có link về trang chủ trên toàn bộ các trang
- Các link đều được gạch chân, hoặc khác màu
- Các link đã được click đều được xác định rõ ràng
6. Quản trị website
- Website cần có trang báo lỗi (lỗi 404 - lỗi không truy cập được). Nội dung trang phải rõ ràng, ý nghĩa hữu dụng
- Website cần sử dụng URL thân thiện, giúp dễ truy cập nhanh và tốt cho SEO (được google và các công cụ tìm kiếm đánh giá cao)
- Website phải truy cập được, dù cho người dùng có gõ hay không gõ www
- Website cần phải có favicon (biểu tượng nhỏ của site), biểu tượng này dễ thấy bên trái thanh địa chỉ
Một dịch vụ thiết kế website mà dè dẹt trước các yêu cầu như trên (nhất là tiêu chí 1) thì quý khách không nên trông chờ một website tốt từ họ. Vietmeta Co.,Ltd sẵn sàn thực hiện bất kỳ yêu cầu nào của quý khách!
