Web Stardards: ước mơ chuẩn hóa thế giới Web (phần 2)

Đây là phần 2 của loạt bài về Web Standards (xem phần 1). Tôi hy vọng nó sẽ hữu ích cho các bạn hiện là Web designer hoặc developer hoặc quan tâm về lĩnh vực này.

3. Thành phần làm nên Web Standards

Vẫn có một số hiểu lầm rằng WaSP đã tạo ra các ngôn ngữ, công nghệ được khuyên dùng trong Web Standards. Trên thực tế, WaSP chỉ khuyến khích việc sử dụng các ngôn ngữ này (vốn được phát triển bởi W3C và các tổ chức khác) và làm thế nào sử dụng chúng một cách tối ưu nhất. Những chuẩn nền tảng nhất mà một Web developer cần phải biết bao gồm:

• HTML - HyperText Markup Language
  Đây là ngôn ngữ lâu đời và (do đó) được sử dụng phổ biến nhất trên Web. Mục đích chính của HTML là thiết lập cấu trúc cho các tài liệu Web. Điểm yếu của ngôn ngữ lâu đời này thiếu đi tính nhất quán trong cú pháp (ví dụ: có thẻ mở mà không cần thẻ đóng), và trộn lẫn cả những yếu tố định dạng văn bản (màu sắc, kiểu chữ). Vì vậy, nó có xu hướng được thay thế dần bằng XHTML và CSS.
• XML - Extensible Markup Language
  Cũng là một ngôn ngữ đánh dấu như HTML, nhưng thay vì chỉ có một số lượng thẻ nhất định, XML cho phép bạn tạo ra và định nghĩa thẻ của mình, hoặc dùng lại các thẻ của người khác. Đặc tính đó giúp XML uyển chuyển hơn HTML trong việc lưu trữ và tìm kiếm thông tin với khối lượng lớn. Tuy nhiên, vì sự hỗ trợ XML của các trình duyệt vẫn còn khá kém, nên hiện tại XML chủ yếu được dùng trong database và search engine. Để hiển thị thông tin cho người đọc, xHTML và CSS là lựa chọn tốt nhất ở thời điểm này.
• XHTML - Extensible HyperText Markup Language
  XHTML là một sự kết hợp giữa sự chặt chẽ trong cấu trúc của XML và sự phổ biến của HTML. Tất cả các trình duyệt hiện tại đều hỗ trợ XHTML khá tốt, kể cả các trình duyệt của di động và PDA. Việc chuyển đổi thông tin từ XHTML sang các dạng khác (XML) cũng dễ dàng hơn so với HTML do cấu trúc logic của nó.
• CSS - Cascading Style Sheets
  Một xu hướng quan trọng trong phát triển web hiện nay là sự tách biệt giữa cấu trúc, định dạng và hành vi. XHTML xây dựng nên cấu trúc, CSS giúp thay đổi “bề mặt” của website theo đúng ý tưởng thẩm mỹ của designer. Đây chính là “mảnh đất dụng võ” của designer. Trong trường hợp lý tưởng (designer hiểu và đánh giá cao lợi ích của Web Standards)tất cả những yếu tố liên quan đến design như màu sắc, font chữ, hình ảnh background đều được định dạng bằng CSS. Sử dụng CSS cũng giúp tiết kiệm thời gian và công sức của designer rất nhiều khi có thể kiểm soát được thiết kế của toàn bộ site. Ví dụ: nếu cần thay đổi một chi tiết nào đó, hoặc thậm chí thiết kế lại toàn bộ giao diện của site, designer chỉ đơn giản thay đổi các thuộc tính CSS mà không cần đụng chạm vào cấu trúc (X)HTML. Nếu file CSS được tách riêng thì designer chỉ cần sửa chữa trong file đó mà không phải sửa từng file (X)HTML một.
• DOM - Document Object Model
  Có thể coi DOM như một công cụ giúp developer điều khiển đến tất cả đối tượng trên trang web, từ các thành phần cấu trúc đến định dạng và cả nội dung được tạo ra bởi (X)HTML và CSS. Nói một các chính xác, DOfM mô hình hóa tất cả các đối tượng (Object) của văn bản (Document) dưới dạng một mô hình cây phân nhánh (tưởng tượng như một sơ đồ tổ chức nhân sự của các cơ quan). Tóm lại, DOM cung cấp một cách thức đơn giản giúp developer “chộp” bất cứ thành phần nào trên trang web. Sau khi đã “chộp” được, designer có thể sử dụng và thao tác chúng bằng các ngôn ngữ khác, chẳng hạn như JavaScript, PHP hoặc XML.
• ECMA Standards
  Có lẽ đây là một trong số những chuẩn mà bạn chưa từng nghe. Nhưng về bản chất, đó là một trong số những ngôn ngữ quen thuộc nhất của web developer: JavaScript. Sở dĩ có tên là ECMA vì European Computer Manufacturers Association đã kết hợp ngôn ngữ kịch bản JavaScript của Netscape và JScript của Microsoft lại thành một chuẩn thống nhất, gọi là ECMAScript. Tuy vậy, các developer trên thế giới vẫn gọi đó là JavaScript, vì cái tên đó đã trở nên quá quen thuộc với họ.Do vậy, kể từ nay trên SonnyMotives, chúng ta sẽ vẫn gọi JavaScript là… JavaScript.
  JavaScript được tạo ra nhằm làm cho trang Web “sống động” hơn. Vì JavaScript chạy trên máy khách, nó có thể tương tác tức thì với các hành vi của người dùng (click chuột, kéo và thả). Để làm được điều này, designer sử dụng JavaScript để điều khiển các đối tượng trên trang Web đã được xác định bởi DOM. Những đối tượng đó có thể bị dời đi, xóa, sửa và tạo mới tùy thích. Những ứng dụng phổ biến nhất của JavaScript là các hiệu ứng như chữ chạy lăng quăng trên trang web, thay đổi hình khi trỏ chuột vào (rollover), và nổi nhất gần đây là AJAX.

Trên đây chỉ là khái niệm sơ đẳng nhất về các thành phần quan trọng của Web Standards. Có thể nói mỗi thành phần lại là cả một thế giới riêng với vô số kỹ thuật, ứng dụng khác nhau. Nhưng tôi tin rằng, để trở thành một web designer thực sự, 4 thành phần quan trọng thiết yếu mà chúng ta cần phải biết, theo thứ tự ưu tiên là:

• XHTML: tạo cấu trúc văn bản.
• CSS: định dạng văn bản.
• DOM: mô hình của các đối tượng, tạo bởi XHTML và CSS. Sở dĩ tôi đặt DOM trước JavaScript là vì bạn có thể sử dụng DOM với các ngôn ngữ lập trình khác, PHP hay ASP đều được. Mặc khác, nếu bạn học JavaScript trước, rất có “nguy cơ” là bạn sẽ viết JavaScript một cách tùy tiện, gây khó khăn trong việc kiểm tra, sửa lỗi và phát triển sau này. Nếu các bạn chú ý, bất kỳ một cuốn sách về JavaScript “tử tế” nào đều dành một phần đáng kể để giới thiệu về DOM trước. Nhắc đến sách, cuốn sách hay nhất theo tôi về DOM và JavaScript là Dom Scripting của Jeremy Keith, người đã làm sống lại việc sử dụng DOM cũng như đưa ra ý tưởng tách biệt hành vi và cấu trúc trên trang Web.
• JavaScript: định nghĩa hành vi của các đối tượng trên trang web, giúp chúng tương tác với người dùng.