Nguyên tắc thiết kế web hiện đại

Một điều làm đau đầu các Web Designer nhất và thiết kế web chuyên nghiệp cũng là vấn đề cố hữu nhất của lĩnh vực thiết kế web là việc tương thích giữa các trình duyệt. Trong bài này, chúng ta sẽ không bàn về làm cách nào để trang web tương thích với mọi trình duyệt mà tôi chỉ tập trung nói về hai nguyên tắc cơ bản mà mỗi người làm web nào cũng nên để tâm tới.

Thuật ngữ Grateful Degradation được áp dụng trong nhiều lĩnh vực đặc biệt là trong cơ học và điện tử học. Nguyên tắc của nó là khi làm ra một sản phẩm thì làm cho những thứ tốt nhất và phổ thông nhất, thiet ke website cong ty hay nói cách khác là tập trung phát triển cho số đông trước khi mới quay lại hỗ trợ cho phần còn lại. Còn trong lĩnh vực thiết kế web thì bạn có thể làm sao cho trang web của mình hiển thị tốt nhất trên những trình duyệt hiện đại và không có lỗi. Bạn cũng có thể áp dụng những khái niệm mới về CSS3, HTML5 để cung cấp cho những trình duyệt hiện đại như Chrome và Safari.

Nguyên tắc thiết kế web hiện đại

Progressive enhancement

Sau khi đã tạo ra những hiệu ứng mong muốn, bạn sẽ quay lại những trình duyệt cũ hơn và giáng cấp nó từ từ. Thuật ngữ này được giới thiệu muộn hơn nhiều, khoảng năm 2003. Nó ngược lại với thuật ngữ trên là chúng ta thiết kế website  xây dựng trang web cho những trình duyệt kém hỗ trợ nhất sau đó từ từ bổ sung những tính năng mới cho những trình duyệt hiện đại hơn.

Có cần phải hoàn hảo đến từng chi tiết

Đây là câu hỏi mà câu trả lời còn phải phụ thuộc vào nhiều yếu tố như thiết kế, nhóm người đọc, độ phức tạp của code v.v… nhưng tựu chung người ta chỉ yêu cầu bạn làm sao cho trang web ở mức cơ bản nhất như là không có hình ảnh, không có CSS và cả JavaScript vẫn có thể sử dụng được tuy không đẹp bằng phiên bản đầy đủ.

Tất nhiên vì yêu cầu công việc dich vu thiet ke website  hoặc đặc thù của một trang web mà người ta vẫn muốn trang web phải đẹp dù với những trình duyệt cũ. Nhưng bạn không phải chính xác đến từng pixel. Bạn khó có thể làm một trang web nhìn giống nhau đến từng Pixel trên các trình duyệt khác nhau được. Nói ví dụ như padding bên IE 6 hụt mất 2 px so với Firefox, hoặc menu lại có gạch chân ở cuối cùng danh sách với IE 6 v.v. những khác biệt nhỏ như thế không ảnh hưởng đến toàn bộ giao diện.

Progressive enhancement

Đôi khi bạn cũng phải tự hỏi có cần thiết phải sử dụng cả một “quân thể code” chỉ để sửa một lỗi là cái border của list item không? Những thứ không trực tiếp ảnh hưởng đến tính khả dụng của trang web đối với những trình duyệt cũ thiết kế web công ty thì bạn không nên quá khắt khe làm gì.

Kết luận

Hai khái niệm trên là những nguyên lý rất hay mà những người làm web có kinh nghiệm hay làm theo. Áp dụng nó như thế nào và ở mức độ nào là tùy thuộc vào bạn và tùy thuộc vào Project mà bạn đang làm. Nhưng đừng tập trung quá vào những trình duyệt hiện đại mà bỏ đi những trình duyệt kém hơn. Hoặc đừng quá quan tâm tại sao trang web của mình lại lệch sang phải 3 px ở IE 6 so với Firefox.