5.1.Khái niệm
Mỗi tiêu chuẩn HTML và XHTML đều có một DOCTYPE (Document Type Declaration) để khai báo khi được kiểm tra rằng phiên bản HTML hoặc XHTML đang được sử dụng. DOCTYPE, thường được đặt ở đầu mỗi Web Document, là thành phần chính của các Web Document chuẩn mực. Thiếu DOCTYPE, các thành phần đánh dấu và định dạng sẽ không được kiểm duyệt.
Một DOCTYPE thường gồm một đường dẫn cụ thể để khai báo với trình duyệt các quy chuẩn mà trình duyệt sẽ dựa vào đó để dịch và hiển thị các mã HTML hoặc XHTML, CSS một cách đúng đắn và thống nhất.
Không chọn hoặc chọn nhầm DOCTYPE sẽ khiến các trình duyệt xem như là các web documents được viết theo kiểu tự do, gọi chung là "Quirks" mode. Theo đó, các trình duyệt sẽ xử lý trang web làm sao đó để nó tương thích ngược với các phiên bản của mỗi trình duyệt, và làm theo cách riêng của chúng. Vì thế, web documents sẽ được hiển thị khác nhau trên các trình duyệt khác nhau, đôi lúc có thể làm hỏng bố cục các web documents.
5.2.Khai báo
Các DOCTYPE được xây dựng bởi W3C, do đó các DOCTYPE được cung cấp trên website của W3C. Tuy nhiên mã DOCTYPE thường khó nhớ và dài dòng (trừ HTML5), thông thường trong các IDE hỗ trợ soạn thảo code HTML như Adobe Dreamweaver hay Komodo Edit đều có tạo sẵn DOCTYPE.
DOCTYPE thường được khai báo dưới dạng <!DOCTYPE …>, tuy nhiên nó không phải là một thẻ HTML.
DOCTYPE luôn được khai báo ở ngay đầu trang soạn thảo trang web, trước cả thẻ <html>
5.2.1.HTML 4.01
Có 3 phiên bản DOCTYPE của HTML 4.01
a)HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
DOCTYPE này quy định văn bản HTML không được phép sử dụng một số thẻ đánh dấu, các thuộc tính dạng trình bày, không sử dụng frame.
Các thẻ không sử dụng trong HTML 4.01 Strict
Thẻ Mô tả
<applet> Xác định applet (nhúng JAVA).
<basefont /> Xác định font, màu sắc, hay kích cỡ mặc định của text trong trang. <center> Canh giữa text.
Thẻ Mô tả
<font> Xác định font, màu sắc, và kích cỡ cho text. <isindex> Hiển thị một hộp thoại để nhập văn bản. <menu> Xác định danh sách menu.
<s> Hiển thị gạch ngang text. <strike> Hiển thị gạch ngang text. <u> Hiển thị gạch dưới text.
Các thuộc tính dạng trình bày không sử dụng trong HTML 4.01 Strict
ALIGN : xác định vị trí của phần tử
BACKGROUND : xác định hình nền của phần tử.
BGCOLOR : xác định màu nền của phần tử.
BORDER : xác định viền của phần tử.
TEXT : màu chữ của nội dung của phần tử thẻ <body>
TYPE : kiểu bullet của danh sách (thuộc thẻ <li>)
HEIGHT, WIDTH : chiều cao, chiều rộng của đối tượng.
b)HTML 4.01 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
DOCTYPE này quy định văn bản HTML được phép sử dụng một số thẻ đánh dấu, các thuộc tính dạng trình bày, không sử dụng frame.
c)HTML 4.01 Frameset
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
DOCTYPE này có đầy đủ tính chất như HTML 4.01 Transitional nhưng được sử dụng thêm frame.
5.2.2.XHTML 1.0
DOCTYPE của XHTML 1.0 cũng có 3 phiên bản tương tự và có cùng tính chất như HTML 4.01 là XHTML 1.0 Strict, XHTML 1.0 Transitional, XHTML 1.0 Frameset
a)XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
b)XHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
c)XHTML 1.0 Frameset
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
5.2.3.XHTML 1.1
DOCTYPE của XHTML 1.1 tương đương với đặc điểm và tính chất của XHTML 1.0 Strict nhưng có thêm một số module
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
5.2.4.HTML5
Do HTML5 không dựa trên ngôn ngữ SGML nên không có tham chiếu DOCTYPE, do đó đối với HTML5, W3C đề nghị tạm thời khai báo như sau
<!DOCTYPE html>
6.XHTML
6.1.Khái niệm
XHTML (Extensible HyperText Markup Language – Ngôn ngữ đánh dấu siêu văn bản mở rộng) là một ngôn ngữ đánh dấu có cùng các khả năng như HTML 4.01, nhưng có cú pháp chặt chẽ hơn. XHTML 1.0 là khuyến cáo của W3C vào ngày 26 tháng 2, 2000.
Một số lý do để sử dụng XHTML
Quy tắc ngữ pháp trong XHTML ít tùy ý hơn so với HTML. Do đó, trang web sẽ ít lỗi hơn và ít tốn thời gian hơn để sữa chữa.
XHTML rất thích hợp với nhiều yêu cầu do được tổ chức như một ứng dụng của XML, vì thế nó trở thành một lựa chọn tuyệt với cho những nhà thiết kế và phát triển Web
Học tập và giảng dạy XHTML dễ dàng hơn do nó có các quy tắc chặt chẽ hơn.
Đặc điểm mở rộng sẽ cung cấp cho nhu cầu về tính linh động lâu dài.
Một điểm đáng chú ý nữa là XHTML có thể hiển thị chính xác trên mọi trình duyệt trên máy tính và kể cả trên các thiết bị di động. XHTML cần ít thời gian tải hơn so với HTML, qua đó cải thiện được vị trí trang web trên các trang web xếp hạng cũng như các hệ thống Search engine.
6.2.Các thay đổi về cú pháp trong XHTML so với HTML
Trang web được viết bằng XHTML phải có đặc tả dạng chuẩn (well-form) theo W3C
Phải có khai báo DOCTYPE
XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset
XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Tài liệu XHTML chỉ có duy nhất 1 phần tử gốc (chỉ có 1 cặp <html>…</html>)
Phải có các thẻ cơ bản <html>, <head>, <title>, <body>
Phải có khai báo namespace cho thẻ <html>
<html xmlns="http://www.w3.org/1999/xhtml">
Tên thẻ và thuộc tính phải được viết thường
Ví dụ:
Trong HTML có thể viết
<IMG SRC="logo.gif" alt="Logo" />
Nhưng với XHTML phải viết
<img src="logo.gif" alt="Logo" />
Các thẻ phải đi theo cặp (mở-đóng) và lồng nhau đúng cách (như của XML)
Ví dụ:
Trong HTML có thể viết
<strong><i>Chữ đậm và nghiêng</strong></i>
Nhưng với XHTML phải viết
<strong><i>Chữ đậm và nghiêng</i></strong>
Các phần tử sau khi được mở phải được đóng
Ví dụ:
Trong HTML có thể viết
<p>Đây là một đoạn văn bản <input type="text">
Nhưng với XHTML phải viết
<p>Đây là một đoạn văn bản</p>
<input type="text" /> --> Thẻ rỗng cũng phải được đóng
Giá trị của thuộc tính phải được đặt trong cặp dấu " "
Ví dụ:
Trong HTML có thể viết
<input type=password value=1234 />
Nhưng với XHTML phải viết
<input type="password" value="1234" />
Không ghi tối giản thuộc tính
Ví dụ:
Trong HTML có thể viết
<option selected>Value</option>
Nhưng với XHTML phải viết