Apa itu DOCTYPE?

174
  • Apa itu DOCTYPE dan mengapa saya ingin menggunakannya?
  • Apa perbedaan DOCTYPE yang dapat saya gunakan?
  • Apa perbedaan antara mode standar dan kebiasaan, dan beberapa kebiasaan yang mungkin saya temui dengan set DOCTYPE yang berbeda?

Terakhir, apa DOCTYPE yang tepat yang harus saya gunakan?

Bob
sumber
9
Bukankah ini wiki?
Alex

Jawaban:

76

Pada dasarnya, DOCTYPE menjelaskan HTML yang akan digunakan di halaman Anda.

Peramban juga menggunakan DOCTYPE untuk menentukan cara merender halaman. Tidak termasuk DOCTYPE atau termasuk yang salah dapat memicu mode kebiasaan.

Kicker di sini adalah, bahwa mode quirks di Internet Explorer sangat berbeda dari mode quirks di Firefox (dan browser lainnya); yang berarti bahwa Anda akan memiliki banyak pekerjaan yang sulit, mencoba untuk memastikan halaman Anda merender konsisten dengan semua browser jika modus kebiasaan dipicu, daripada Anda akan jika diberikan dalam modus standar.

Wikipedia memiliki ringkasan yang lebih mendalam tentang perbedaan rendering saat menggunakan berbagai DOCTYPEs . XHTML diaktifkan oleh DOCTYPE tertentu, dan ada sedikit perdebatan tentang penggunaan XHTML yang tercakup dengan baik dalam XHTML - mitos dan kenyataan .

Ada perbedaan halus antara "rendering standar" rendering DOCTYPE yang berbeda, seperti HTML5 DOCTYPE ( <!DOCTYPE html>, sebelum HTML5, hanya dikenal sebagai "skinny doctype" yang tidak memicu render standar di browser lama) dan DOCTYPE lain seperti ini untuk HTML 4.01 transisi:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Walter Rumsby
sumber
39
Hari ini saya menyukai HTML5 DOCTYPE: <! DOCTYPE html> ini berfungsi di semua browser modern, termasuk IE6.
Walter Rumsby
53
IE6 ∉ browser modern
26

DOCTYPE memberi tahu agen pengguna yang mengonsumsi (browser web, perayap web, alat validasi) jenis dokumen apa file tersebut. Menggunakannya memastikan bahwa konsumen mem-parsing HTML dengan benar seperti yang Anda inginkan.

Ada beberapa DOCTYPES berbeda untuk HTML, XHTML, dan Framesets dan masing-masing memiliki dua mode Strict dan Transitional. Strict mengatakan bahwa markup Anda menggunakan standar yang ditentukan dengan tepat. Lihat halaman DTD W3C untuk detail lebih lanjut.

Quirksmode pada dasarnya adalah metode tata letak dari perang browser hari-hari ketika standar jauh lebih tidak dihormati dan didefinisikan. Umumnya halaman mode standar, yang valid, akan tata letak lebih konsisten di berbagai browser, tetapi mungkin kekurangan fitur tertentu yang Anda butuhkan. Salah satu fitur tersebut adalah atribut target anchor tag. Situs Quirksmode adalah sumber yang bagus untuk perbedaan-perbedaan ini.

Satu pemikiran terakhir adalah bahwa standar HTML5 baru mengusulkan menggunakan DOCTYPE yang sangat sederhana:

<!DOCTYPE html>

Menggunakan DOCTYPE ini adalah cara yang kompatibel ke depan untuk menentukan bahwa halaman Anda dalam mode standar, dan adalah HTML. Ini adalah metode yang digunakan Google, dan cukup mudah diingat. Saya sarankan menggunakan DOCTYPE ini kecuali Anda berencana untuk menggunakan XHTML.

rampok
sumber
2
Apakah tag HTML DOCTYPE? Jika demikian, mengapa kita perlu memulainya?
CuriousMind
2
@vipinkoul tag DOCTYPE menentukan jenis dokumen HTML apa yang Anda kirimkan sebagai User-Agent. Itu bisa HTML atau XHTML atau Frameset. Dan itu bisa berupa HTML / XHTML / Frameset Ketat atau Transisi HTML / XHTML / Frameset. Sebagian besar efek ini bagaimana parser bereaksi ketika menemukan kesalahan.
Rob
6

Doctype menentukan versi HTML / XHTML yang digunakan oleh dokumen Anda. Anda ingin menggunakan DOCTYPE sehingga ketika Anda menjalankan kode Anda melalui validator, validator tahu versi HTML / XHTML mana yang harus diperiksa. Halaman ini memberikan gambaran yang bagus:

Jangan lupa untuk menambahkan DOCTYPE

DOCTYPE umum yang dapat Anda gunakan tercantum di sini:

Daftar DTD yang direkomendasikan

Doctype yang harus Anda gunakan tergantung pada kode yang Anda gunakan, tetapi untuk mendapatkan ide, coba jalankan kode Anda melalui validator W3C dan gunakan menu tarik-turun Document Type di menu "More Options" untuk mencoba berbagai jenis dokumen .

Layanan Validasi Markup W3C


sumber
3

Dalam HTML (termasuk XHTML) seperti yang digunakan pada halaman web, DOCTYPE adalah string yang memicu salah satu dari beberapa mode browser (mode quirks, mode standar, mode hampir standar), tergantung pada ejaan yang tepat dari DOCTYPE. Anda ingin menggunakannya untuk memilih mode browser yang paling sesuai dengan halaman Anda.

Secara formal, dalam SGML dan XML, deklarasi DOCTYPE adalah referensi ke Document Type Definition (DTD), yang menentukan aturan sintaksis formal dari bahasa markup. Tidak ada browser yang pernah menggunakan DTD untuk apa pun atau bahkan mengaksesnya. Namun, mereka digunakan oleh validator markup SGML dan XML seperti W3C Markup Validator , kecuali dalam mode HTML5. Oleh karena itu, pilihan DOCTYPE menentukan cara kerja validator jika dokumen diserahkan kepadanya. Namun, mode operasi validator juga dapat dipilih dalam antarmuka penggunanya. (Prosesor SGML dan XML dapat menggunakan DOCTYPE dengan cara lain yang berbeda juga, tetapi pertanyaannya tampaknya dibatasi pada konteks HTML dan untuk browser web dan perangkat lunak yang terkait erat.)

Tidak ada daftar DOCTYPE yang resmi. Setiap spesifikasi atau konsep HTML menentukan DOCTYPE sendiri, atau DOCTYPE. Himpunan DOCTYPE yang dikenali oleh browser saat memilih mode bervariasi menurut browser. Dalam praktiknya, tidak ada alasan untuk menggunakan DOCTYPE selain <DOCTYPE html> sebagaimana didefinisikan dalam HTML5 , meskipun HTML5 juga mencantumkan beberapa "DOCTYPE lawas". Anda dapat menggunakan DOCTYPE itu jika Anda menginginkan mode standar (disarankan untuk halaman baru) dan tidak menggunakan DOCTYPE jika Anda menginginkan mode quirks (yang mungkin Anda perlukan untuk halaman lawas).

"Mode standar" umumnya berarti mode operasi di mana browser mengikuti HTML, CSS, DOM, dan spesifikasi lainnya sebaik mungkin. Itu biasanya tidak berarti kepatuhan penuh. "Mode quirks" berbeda di browser yang berbeda, tetapi umumnya itu berarti upaya meniru perilaku browser yang sangat lama seperti IE 5. Tujuannya adalah untuk menjaga halaman lama tetap berfungsi, dengan asumsi bahwa mereka dapat mengandalkan fitur dan bug di browser lama. Lihat deskripsi Apa yang terjadi dalam Mode Quirks? Perhatikan bahwa ada konsep "quirks mode" yang agak berbeda dan lebih terbatas dalam HTML5, yang sangat mirip dengan dokumen yang disebut Quirks Mode Living Standard .

Masalah khas adalah bahwa lebar elemen dihitung secara berbeda dalam mode kebiasaan dan dalam mode standar. Ini berarti bahwa tata letak halaman mungkin lebih atau kurang berubah atau bahkan benar-benar kacau, jika halaman yang dirancang untuk bekerja dalam mode quirks dilihat dalam mode standar (atau sebaliknya).

Jadi Anda harus menggunakan <!DOCTYPE html>halaman baru dan menyimpan DOCTYPE apa pun (jika ada) yang telah Anda gunakan untuk halaman lama.

Namun, mode quirks berarti, di beberapa browser, banyak fitur baru CSS yang tidak didukung. Ini berarti bahwa jika Anda ingin meningkatkan halaman lama dengan beberapa fitur CSS3, mungkin perlu untuk beralih ke DOCTYPE yang memicu mode standar. Dalam kasus seperti itu, Anda perlu meninjau dan menguji halaman untuk melihat apakah itu akan berjalan dalam mode standar.

Jukka K. Korpela
sumber
Terima kasih atas perincian ekstra, khususnya yang ini: «Tidak ada browser yang pernah menggunakan DTD untuk apa pun atau bahkan mengaksesnya» dan «tidak ada alasan untuk menggunakan DOCTYPE selain <DOCTYPE html>sebagaimana didefinisikan dalam HTML5 ».
Armfoot
2

DOCTYPE memberitahu browser dalam bahasa apa halaman itu ditulis, apakah itu HTML atau XHTML. Sebagai contoh,

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

beri tahu browser untuk merender halaman sebagai HTML4 strict. Browser yang lebih lama digunakan untuk membuat halaman salah dan karenanya browser yang lebih baru mensimulasikan kesalahan dari browser yang lebih tua ketika mereka menemukan doctype yang lama.

Hari ini Anda harus menggunakan setidaknya HTML4 atau XHTML yang lebih baik.

Entri blog tentang doctypes adalah Perbaiki Situs Anda Dengan DOCTYPE yang Tepat! (dari A List Apart ).

Georg Schölly
sumber
1

Pertama-tama tidak ada satu doctype yang harus Anda gunakan, tetapi sebagian besar desainer mencoba membuatnya bekerja dalam XHTML 1.0 Strict.

DOCTYPE tidak lebih dari deklarasi tag apa yang dapat Anda gunakan dalam html Anda (meskipun browser dapat menggunakan lebih atau kurang dari apa yang didefinisikan) Anda sebenarnya dapat membuka file doctype dan mulai membaca ( XHTML 1.0 Strict )

Jika Anda tidak menentukan DOCTYPE, browser akan mencoba yang terbaik untuk menebak tetapi tidak selalu mengenai jenis yang benar.

Mode quirks hanyalah sebuah teknik yang digunakan oleh browser untuk kompatibel ke belakang, contoh yang bagus dari mode quirks adalah bagaimana IE membuat kotak

Ólafur Waage
sumber
1

DOCTYPE adalah dokumen yang menggambarkan bagaimana isi dokumen seperti xhtml dapat terlihat (seperti halaman web). Catatan: ini hanya mendefinisikan sintaks dari halaman tersebut, rendering halaman TIDAK didefinisikan oleh DTD!

Sebagai contoh, suatu DOCTYPE dapat mendefinisikan bagaimana <table>-tag dapat terlihat seperti - atribut mana yang diterimanya, dan nilai / tipe nilai yang diterima untuk setiap atribut. Anggap saja sebagai leksikon untuk halaman web Anda saat ini.

Wikipedia memiliki halaman informatif tentang berbagai Doctypes yang umum digunakan. Pikiran Anda - tidak ada yang menghentikan Anda dari membuat DOCTYPE Anda sendiri. Namun, kemungkinan peramban itu mungkin tidak tahu cara merender dokumen Anda.

DTD mana yang akan digunakan tergantung pada apa yang akan Anda tulis. XHTML memiliki DTD yang sama sekali berbeda dari HTML, misalnya.

Henrik Paul
sumber
1

Di web, DOCTYPE tidak melakukan apa-apa selain memberitahu browser jika Anda ingin mode standar, hampir standar, atau kebiasaan.

Perubahan dalam mode quirks tergantung pada browser: Firefox, Opera, Safari, dan Chrome menerapkan seperangkat quirks yang terbatas, seperti menghapus ruang untuk teks descenders dalam kode seperti <table><tr><td><img></td></tr></table>(solusi td img { vertical-align:bottom; }:). IE, di sisi lain, kembali ke mesin rendering di IE5.5. Itu berarti bahwa Anda tidak akan dapat menggunakan salah satu fitur baru yang diterapkan sejak tahun 2000.

Untuk memicu mode standar, saya sarankan menggunakan doctype HTML5 <doctype html>, karena ini adalah yang paling mudah diingat.

Ms2ger
sumber