Elemen embed dan object

<embed> menyematkan konten eksternal menggunakan pengaya peramban atau penangan bawaan peramban. Atribut type menentukan tipe MIME-nya; src adalah URL sumber daya. Elemen ini merupakan elemen kosong tanpa anak atau konten cadangan.

<object> lebih fleksibel daripada embed. Atribut data-nya menunjuk ke sumber daya; type menentukan tipe MIME. Elemen turunannya menjadi konten cadangan jika object tidak dapat dimuat—termasuk object bersarang atau teks deskriptif.

Sisipkan konten cadangan: <object data="file.pdf" type="application/pdf"><a href="file.pdf">Download PDF</a></object>. Jika peramban tidak dapat merender PDF secara sebaris, peramban akan menampilkan tautan unduhan sebagai gantinya. Konten cadangan adalah keunggulan utama object dibandingkan embed.

Sematkan file PDF dengan object atau embed: <object data="doc.pdf" type="application/pdf" width="100%" height="600">. Dukungan peramban bervariasi—Chrome dan Firefox merender PDF secara bawaan; peramban lain mungkin menampilkan permintaan pengunduhan. Sediakan tautan cadangan.

Untuk menyematkan dokumen HTML: pilih iframe (dirancang untuk tujuan ini dengan model keamanan yang jelas). Untuk pengaya media: embed (Flash lama, perenderan SVG). Untuk dokumen dengan konten cadangan: object. Dalam pengembangan modern, sebagian besar kasus penggunaan pengaya ditangani oleh elemen HTML5 bawaan (video, audio, canvas).

Baik embed maupun object dapat menjalankan konten pengaya (dahulu Flash), yang merupakan permukaan serangan utama. Peramban modern telah menghapus dukungan pengaya. Hanya konten tepercaya yang boleh disematkan. Konten embed/object lintas asal tidak dapat diprogram seperti konten dengan asal yang sama.

Menyematkan SVG dengan object: <object data="image.svg" type="image/svg+xml" width="200" height="200">. Tidak seperti tag img, SVG di dalam object dapat menjalankan skripnya sendiri dan merespons CSS eksternal (jika berasal dari asal yang sama). Gunakan cara ini untuk SVG interaktif saat SVG sebaris tidak praktis.

Teruskan parameter ke pengaya object menggunakan elemen <param name="autoplay" value="true"> bersarang. Ini adalah cara standar untuk mengonfigurasi object Flash. Penggunaan modernnya jarang karena dukungan pengaya telah dihapus dari peramban.

object dapat bekerja dengan usemap untuk membuat peta gambar—wilayah yang dapat diklik pada gambar yang disematkan. Tentukan wilayah dalam elemen <map> dengan turunan <area>. SVG modern dengan href pada elemen merupakan pendekatan yang lebih baik untuk wilayah gambar interaktif.

Tambahkan atribut title ke embed dan object agar dapat dikenali oleh pembaca layar. object menerima aria-label. Tidak satu pun elemen tersebut menyediakan semantik aksesibilitas sekaya elemen HTML5 bawaan. Untuk konten media, elemen video dan audio bawaan dengan teks takarir selalu lebih disarankan.

embed dan object sebagian besar merupakan elemen lama. Kasus penggunaan utamanya (Flash) sudah tidak ada. Penggunaan yang masih sah: dokumen PDF sebaris (dengan konten cadangan), penyematan SVG interaktif, dan konten lama yang tidak dapat dimodernisasi. Proyek baru sebaiknya mengutamakan elemen HTML5 bawaan untuk semua kebutuhan media.

Apa keunggulan utama penggunaan object dibandingkan embed untuk konten yang disematkan?

embed dan object adalah elemen lama untuk menyematkan konten non-HTML. object lebih disarankan jika konten cadangan diperlukan. Keduanya menerima spesifikasi tipe MIME dan meneruskan parameter. Padanan modern (video, audio, canvas, SVG sebaris) lebih disarankan untuk proyek baru. Penyematan PDF melalui object tetap menjadi kasus penggunaan umum, dengan iframe sebagai alternatif.