Sử dụng phần tử DOCTYPE trong chế độ Quirks

Loại bỏ Doctype để đưa trình duyệt vào chế độ Quirks

Nếu bạn đã thiết kế trang web trong hơn một vài tháng, rất có thể bạn sẽ nhận thấy khó khăn khi viết một trang trông giống nhau trong tất cả các trình duyệt . Trong thực tế, điều đó là không thể. Nhiều trình duyệt được viết với các tính năng đặc biệt mà chỉ họ mới có thể xử lý. Hoặc họ có cách xử lý đặc biệt những thứ khác với cách các trình duyệt khác xử lý chúng. Ví dụ:

Vấn đề đối với các nhà phát triển trình duyệt là họ phải tạo các trình duyệt web tương thích ngược với các trang web được xây dựng cho các trình duyệt cũ hơn. Để giải quyết vấn đề này, các nhà sản xuất trình duyệt đã tạo các chế độ cho các trình duyệt hoạt động. Các chế độ này được xác định bởi sự hiện diện hoặc vắng mặt của phần tử DOCTYPE và những gì DOCTYPE gọi.

Chuyển đổi DOCTYPE và "Chế độ Quirks"

Nếu bạn đặt DOCTYPE sau vào trang web của mình:

Các trình duyệt hiện đại (Android 1+, Chrome 1+, IE 6+, iOS 1+, Firefox 1+, Netscape 6+, Opera 6+, Safari 1+) sẽ giải thích điều này theo cách sau:

  1. Bởi vì có một DOCTYPE được viết chính xác, điều này kích hoạt chế độ tiêu chuẩn.
  2. Đó là một tài liệu chuyển tiếp 4.01 HTML
  3. Vì ở chế độ tiêu chuẩn, hầu hết các trình duyệt sẽ hiển thị nội dung tuân thủ (hoặc chủ yếu là tuân thủ) với HTML 4.01 Chuyển tiếp

Và nếu bạn đặt DOCTYPE này trong tài liệu của mình:

Điều này cho các trình duyệt hiện đại biết rằng bạn muốn hiển thị trang HTML 4.01 của bạn tuân thủ nghiêm ngặt DTD.

Các trình duyệt này sẽ chuyển sang chế độ "nghiêm ngặt" hoặc "tiêu chuẩn" và hiển thị trang tuân thủ các tiêu chuẩn. (Vì vậy, đối với tài liệu này, các thẻ như có thể bị bỏ qua hoàn toàn bởi trình duyệt, vì phần tử FONT đã không được chấp nhận trong HTML 4.01 Nghiêm ngặt.)

Nếu bạn để DOCTYPE hoàn toàn, các trình duyệt sẽ tự động được chuyển sang chế độ "quirks".

Bảng dưới đây cho thấy những gì các trình duyệt phổ biến làm khi trình bày với các khai báo DOCTYPE phổ biến khác nhau.

Microsoft làm cho nó khó hơn

Internet Explorer 6 cũng có tính năng mà nếu bạn đặt bất cứ điều gì ở trên tất cả các tuyên bố DOCTYPE, họ sẽ đi vào chế độ quirks. Vì vậy, cả hai ví dụ này sẽ đưa IE 6 vào chế độ quirks, mặc dù các khai báo DOCTYPE nói ở chế độ tiêu chuẩn nghiêm ngặt:

và DOCTYPE XHTML 1.1:

Thêm vào đó, nếu bạn vượt qua IE6, thì bạn có “tính năng” mà Microsoft đã thêm vào trong IE8 và IE9: chuyển đổi phần tử META và danh sách đen trang web. Trên thực tế, hai phiên bản trình duyệt này hiện có tối đa bảy (!) Chế độ khác nhau:

IE 8 cũng giới thiệu “Chế độ tương thích”, nơi người dùng có thể chọn thay đổi mô hình hiển thị trở lại chế độ IE 7. Vì vậy, ngay cả khi bạn đặt chế độ bạn muốn đặt bằng cả hai phần tử DOCTYPE và META, trang của bạn vẫn có thể bị đẩy trở lại chế độ tuân thủ ít tiêu chuẩn hơn.

Chế độ Quirks là gì?

Chế độ Quirks được tạo ra để giúp đối phó với tất cả các kết xuất lạ và hỗ trợ trình duyệt không tuân thủ và các nhà thiết kế web đang sử dụng để xử lý những thứ đó. Mối quan tâm mà các nhà sản xuất trình duyệt đã có là nếu họ chuyển trình duyệt của họ sang tuân thủ đầy đủ đặc điểm kỹ thuật, các nhà thiết kế web sẽ bị bỏ lại phía sau.

Bằng cách thiết lập chuyển đổi DOCTYPE và “Chế độ Quirks”, điều này cho phép nhà thiết kế web chọn cách họ muốn trình duyệt hiển thị HTML của họ.

Hiệu ứng chế độ Quirks

Có một số hiệu ứng mà hầu hết các trình duyệt sử dụng trong chế độ Quirks:

Ngoài ra còn có một sự khác biệt trong "Hầu hết các chế độ tiêu chuẩn:"

Cách chọn DOCTYPE

Tôi đi vào chi tiết hơn trong bài viết DOCTYPE của tôi, nhưng đây là một số quy tắc chung của ngón tay cái:

  1. Luôn chọn chế độ tiêu chuẩn trước. Và tiêu chuẩn hiện tại bạn nên sử dụng là HTML5:
    Trừ khi bạn có lý do cụ thể để tránh sử dụng DOCTYPE HTML5, đây là những gì bạn nên sử dụng.
  2. Chuyển đến HTML 4.01 nghiêm ngặt nếu bạn cần xác thực các yếu tố cũ hoặc muốn tránh các tính năng mới vì một số lý do:
  3. Nếu bạn đã cắt lát hình ảnh trong một bảng và không muốn sửa chúng, hãy chuyển đến HTML chuyển tiếp 4.01:
  4. Không viết các trang cố tình trong chế độ quirks. Luôn sử dụng DOCTYPE. Điều này sẽ giúp bạn tiết kiệm thời gian phát triển trong tương lai và thực sự không có lợi ích. IE6 nhanh chóng bị mất phổ biến và bằng cách thiết kế cho trình duyệt này (mà về cơ bản là những gì thiết kế trong chế độ quirks là) bạn đang giới hạn bản thân, độc giả của bạn, và các trang của bạn. Nếu bạn phải viết cho IE 6 hoặc 7, thì hãy sử dụng các chú thích có điều kiện để hỗ trợ chúng, thay vì buộc các trình duyệt hiện đại vào chế độ quirks.

Tại sao nên sử dụng DOCTYPE

Khi bạn biết loại chuyển đổi DOCTYPE này đang diễn ra, bạn có thể ảnh hưởng trực tiếp đến các trang web của mình hơn bằng cách sử dụng DOCTYPE cho biết trình duyệt có thể mong đợi gì từ trang của bạn. Ngoài ra, một khi bạn bắt đầu sử dụng DOCTYPE, bạn sẽ viết HTML gần hơn là hợp lệ (bạn vẫn nên xác thực nó). Và bằng cách viết XHTML hợp lệ, bạn khuyến khích các nhà sản xuất trình duyệt xây dựng các trình duyệt tuân thủ tiêu chuẩn.

Phiên bản trình duyệt và chế độ Quirks

DOCTYPE Android
Chrome
Firefox
IE 8+
iOS
Opera 7.5+
Safari
IE 6
IE 7
Opera 7
Netscape 6
không ai Chế độ quirks Chế độ quirks Chế độ quirks
HTML 3.2
Chế độ quirks Chế độ quirks Chế độ quirks
HTML 4,01
Chuyển tiếp Chế độ tiêu chuẩn * Chế độ tiêu chuẩn * Chế độ tiêu chuẩn
Chuyển tiếp Chế độ quirks Chế độ quirks Chế độ quirks
Nghiêm khắc Chế độ tiêu chuẩn Chế độ tiêu chuẩn * Chế độ tiêu chuẩn
Nghiêm khắc Chế độ tiêu chuẩn Chế độ tiêu chuẩn * Chế độ tiêu chuẩn
HTML5
Chế độ tiêu chuẩn Chế độ tiêu chuẩn * Chế độ quirks
* Với DOCTYPE này, các trình duyệt gần tuân thủ các tiêu chuẩn, nhưng có một số vấn đề - hãy chắc chắn kiểm tra. Điều này còn được gọi là "Chế độ tiêu chuẩn gần như".