Menggunakan Elemen DOCTYPE dalam Mode Quirks

Tinggalkan Doctype untuk Menempatkan Peramban ke Mode Quirks

Jika Anda telah mendesain halaman web selama lebih dari beberapa bulan, Anda kemungkinan besar menyadari kesulitan dalam menulis halaman yang tampak sama di semua browser . Pada kenyataannya, itu tidak mungkin. Banyak browser ditulis dengan fitur-fitur khusus yang hanya bisa mereka tangani. Atau mereka memiliki cara khusus menangani hal-hal yang berbeda dari cara peramban lain menangani mereka. Sebagai contoh:

Masalah bagi pengembang peramban adalah mereka harus membuat peramban web yang kompatibel dengan laman web yang dibuat untuk peramban yang lebih lama. Untuk mengatasi masalah ini, pembuat peramban menciptakan mode untuk mengoperasikan peramban. Mode ini ditentukan oleh ada atau tidaknya elemen DOCTYPE dan apa yang DOCTYPE panggil.

DOCTYPE Berpindah dan "Mode Quirks"

Jika Anda memasukkan DOCTYPE berikut di halaman web Anda:

Peramban modern (Android 1+, Chrome 1+, IE 6+, iOS 1+, Firefox 1+, Netscape 6+, Opera 6+, Safari 1+) akan menafsirkan ini dengan cara berikut:

  1. Karena ada DOCTYPE yang ditulis dengan benar, ini memicu mode standar.
  2. Ini adalah dokumen Transisi HTML 4.01
  3. Karena dalam mode standar, sebagian besar peramban akan menjadikan konten sesuai (atau sebagian besar sesuai) dengan HTML 4.01 Transisi

Dan jika Anda menempatkan DOCTYPE ini di dokumen Anda:

Ini memberitahu browser modern bahwa Anda ingin menampilkan halaman HTML 4.01 Anda secara ketat sesuai dengan DTD.

Browser ini akan masuk ke mode "ketat" atau "standar" dan merender laman sesuai dengan standar. (Jadi, untuk dokumen ini, tag seperti mungkin sepenuhnya diabaikan oleh browser, karena elemen FONT telah ditinggalkan dalam HTML 4.01 Strict.)

Jika Anda meninggalkan DOCTYPE sepenuhnya, browser secara otomatis akan ditendang ke mode "quirks".

Tabel di bawah ini menunjukkan apa yang umum dilakukan browser ketika disajikan dengan deklarasi DOCTYPE umum yang berbeda.

Microsoft Membuatnya Lebih Keras

Internet Explorer 6 juga memiliki fitur bahwa jika Anda memasukkan sesuatu di atas deklarasi DOCTYPE, mereka akan masuk ke mode quirks. Jadi, kedua contoh ini akan menempatkan IE 6 ke dalam mode quirks, meskipun deklarasi DOCTYPE mengatakan berada dalam mode standar yang ketat:

dan XHTML 1.1 DOCTYPE:

Plus, jika Anda berhasil melewati IE6, maka Anda memiliki "fitur" yang ditambahkan Microsoft di IE8 dan IE9: switching elemen META dan daftar hitam situs web. Faktanya, kedua versi browser ini sekarang memiliki hingga tujuh (!) Mode yang berbeda:

IE 8 juga memperkenalkan "Mode Kompatibilitas" di mana pengguna dapat memilih untuk mengubah model rendering kembali ke mode IE 7. Sehingga bahkan jika Anda mengatur mode yang ingin Anda atur menggunakan kedua elemen DOCTYPE dan META, halaman Anda masih bisa didorong kembali ke mode yang kurang standar-compliant.

Apa itu Mode Quirks?

Mode quirks dibuat untuk membantu menangani semua perenderan aneh dan dukungan peramban yang tidak sesuai dan peretasan yang digunakan perancang web untuk menangani hal-hal tersebut. Perhatian yang dimiliki oleh produsen browser adalah jika mereka mengalihkan browser mereka ke spesifikasi lengkap, desainer web akan tertinggal.

Dengan mengatur pengalihan DOCTYPE dan "Mode Quirks" ini memungkinkan perancang web untuk memilih bagaimana mereka ingin browser untuk membuat HTML mereka.

Efek Mode Quirks

Ada beberapa efek yang digunakan sebagian besar browser dalam Mode Quirks:

Ada juga perbedaan dalam "Hampir Standar Mode:"

Cara Memilih DOCTYPE

Saya membahas lebih detail dalam daftar DOCTYPE artikel saya, tetapi berikut ini beberapa aturan umum:

  1. Selalu pilih mode standar dulu. Dan standar saat ini yang harus Anda gunakan adalah HTML5:
    Kecuali Anda memiliki alasan khusus untuk menghindari penggunaan HTML5 DOCTYPE, inilah yang seharusnya Anda gunakan.
  2. Masuk ke HTML 4.01 yang ketat jika Anda perlu memvalidasi elemen lama atau ingin menghindari fitur baru karena beberapa alasan:
  3. Jika Anda telah memotong gambar dalam tabel dan tidak ingin memperbaikinya, buka Transitional HTML 4.01:
  4. Jangan menulis halaman dengan sengaja dalam mode quirks. Selalu gunakan DOCTYPE. Ini akan menghemat waktu pengembangan Anda di masa depan, dan benar-benar tidak bermanfaat. IE6 dengan cepat kehilangan popularitas dan dengan merancang untuk browser ini (yang pada dasarnya apa yang merancang dalam mode quirks) Anda membatasi diri Anda sendiri, pembaca Anda, dan halaman Anda. Jika Anda harus menulis untuk IE 6 atau 7, gunakan komentar kondisional untuk mendukung mereka, daripada memaksa browser modern ke mode quirks.

Mengapa Gunakan DOCTYPE

Setelah Anda mengetahui jenis pengalihan DOCTYPE ini, Anda dapat memengaruhi halaman web Anda secara lebih langsung dengan menggunakan DOCTYPE yang menunjukkan apa yang diharapkan oleh browser dari halaman Anda. Juga, setelah Anda mulai menggunakan DOCTYPE, Anda akan menulis HTML yang lebih mendekati valid (Anda masih harus memvalidasi). Dan dengan menulis XHTML yang valid, Anda mendorong pembuat browser untuk membangun browser yang sesuai standar.

Versi Peramban dan Mode Quirks

DOCTYPE Android
Chrome
Firefox
IE 8+
iOS
Opera 7.5+
Safari
IE 6
IE 7
Opera 7
Netscape 6
Tidak ada Mode Quirks Mode Quirks Mode Quirks
HTML 3.2
Mode Quirks Mode Quirks Mode Quirks
HTML 4.01
Transisi Mode Standar * Mode Standar * Mode Standar
Transisi Mode Quirks Mode Quirks Mode Quirks
Ketat Mode Standar Mode Standar * Mode Standar
Ketat Mode Standar Mode Standar * Mode Standar
HTML5
Mode Standar Mode Standar * Mode Quirks
* Dengan DOCTYPE ini, browser mendekati standar, tetapi memiliki beberapa masalah — pastikan untuk menguji. Ini juga dikenal sebagai "Hampir Modus Standar."