Tag IFRAME dapat membuat bingkai tertanam di halaman web, yang memanggil konten dokumen halaman web lain dengan menentukan atribut SRC. Seperti Frameset, ini digunakan untuk membagi struktur halaman web untuk menjaga beberapa bagian halaman web publik, tetapi dibandingkan dengan struktur kerangka kerja Frameset yang membagi seluruh halaman web, iframe lebih fleksibel dan dapat disematkan di mana saja di halaman web. Karena fitur penggunaan iframe ini, telah banyak digunakan di beberapa halaman web, yang juga menyebabkan beberapa penyalahgunaan yang tidak pantas. Desain web akan menganalisis beberapa cara umum untuk menggunakan elemen web iframe.
- Membuat komponen halaman respons bebas refresh sebagai solusi untuk pertukaran data yang tidak sinkron. Ini adalah metode alternatif untuk mengirim permintaan secara tidak sinkron tanpa menggunakan Ajax di masa -masa awal. Dengan mengatur elemen iframe yang tidak terlihat pada halaman dan mengarahkan atribut SRC ke alamat halaman tempat permintaan perlu dikirim, permintaan dapat dikirim. Dalam domain yang sama, halaman yang dikembalikan dapat diuraikan untuk mendapatkan data. Keuntungan lain adalah bahwa ia mem-bypass model keamanan kotak pasir AJAX dan dapat berhasil mengirim permintaan lintas domain untuk mendapatkan data, tetapi dalam hal ini, objek dokumen iframe tidak dapat diambil. Karena karakteristiknya, itu masih berlaku di beberapa halaman web yang membutuhkan permintaan lintas domain. Jenis yang bebas refresh ini berarti bahwa halaman induk tidak menyegarkan selama proses pertukaran data dan terus merespons operasi pengguna. Pertukaran data aktual dikunci oleh halaman iframe yang tertanam pada halaman induk. Halaman iframe tertanam ini dapat diatur agar terlihat atau tidak terlihat sesuai kebutuhan dan tidak akan mempengaruhi respons elemen lain di halaman induk kepada pengguna. Efek ini mirip dengan Ajax yang bebas refresh, tetapi dapat dilihat bahwa mekanismenya sama sekali berbeda. Meskipun Gmail adalah model untuk aplikasi AJAX, ia menggabungkan banyak iframe untuk mencapai kinerja dan pengalaman pengguna yang unggul.
- Cara untuk mengoptimalkan halaman. Gunakan iframe untuk memuat skrip secara paralel untuk menyelesaikan masalah pemuatan konten pihak ketiga yang memuat lambat seperti ikon dan iklan. Platform iklan Google Adsense berarti menggunakan IFRAME untuk berbagi pendapatan di situs web pengguna. Anda juga dapat melihat teknologi semacam ini dengan melihat dan menganalisis kode iklan di beranda portal domestik. Anda juga dapat menggunakan iframe tersembunyi untuk memuat file yang lebih besar untuk cache ketika jaringan berada di bawah tekanan jaringan rendah, sehingga halaman lain dapat menggunakannya. Konsep preload dapat dianalisis menggunakan Firebug untuk Beranda Google. Anda dapat melihat di tag tubuh:
onload = document.fqfocus (); if (document.images) gambar baru (). src = '/images/nav_logo4.png'
Dengan kode seperti itu, gambar yang dimuat nav_logo4.png tidak digunakan di beranda, tetapi ketika menggunakan gambar ini di halaman lain seperti daftar hasil pencarian, Anda hanya perlu membacanya dari cache dan tidak perlu mengunduhnya lagi.
- Sebagai metode peretasan untuk lapisan mengambang di browser IE6 untuk memblokir kontrol terpilih dan elemen flash. Di era Web2.0, teknologi LightBox (atau Blickbox) telah menjadi efek populer dengan pengalaman yang baik dan pengalaman visual yang segar. Teknologi ini sebenarnya menggunakan lapisan mengambang yang benar-benar diposisikan untuk menutupi halaman asli untuk menyajikan informasi teks, gambar, formulir, atau elemen halaman sewenang-wenang lainnya, mengganti cara dalam pengembangan web awal yang digunakan oleh Pop-up Browser Windows atau Pesan dan Kontrol Input Browser sendiri yang sering digunakan untuk berinteraksi dengan pengguna. Dengan cara lama, skrip yang muncul jendela baru sering dicegat oleh sistem pemblokiran iklan browser, dan kontrol pesan browser sendiri dikritik oleh peneliti pengalaman pengguna karena mereka mengganggu proses browser, yang menghasilkan seluruh halaman dan halaman web lainnya menjelajahi beberapa tag yang dikunci. Sebagai pengembang front-end barisan depan dengan persyaratan ketat pada diri Anda, Anda pasti akan menghadapi masalah ini dalam proses menerapkan efek Lightbox. Lapisan penentuan posisi absolut tidak dapat menutupi kontrol dan flash terpilih pada halaman web di IE6, dan bahkan jika gaya diatur ke nilai indeks z yang lebih tinggi, itu tidak akan berguna. Ini karena elemen pilih adalah elemen tingkat bentuk di IE6, dan prioritasnya jauh lebih tinggi daripada semua tag HTML lainnya. Hanya iframes dari tingkat bentuk yang sama yang dapat menutupinya. Oleh karena itu, pengembang telah menemukan bahwa menempatkan lapisan mengambang ke dalam iframe atau menempatkan iframe di lapisan mengambang dapat menyelesaikan masalah ini. Untungnya, masalah ini telah diperbaiki dalam versi peningkatan IE setelah IE6, tetapi untuk IE6, yang masih memiliki pangsa pasar 50%+ (statistik pada saat publikasi), solusi ini masih memiliki signifikansi praktis.
Selain tiga aplikasi di atas, beberapa aplikasi yang tidak tepat juga umum untuk elemen iframe. Misalnya, embed terlalu banyak bingkai iframe di halaman, dan perbarui iframe ketika diklik dengan menentukan atribut target tag tautan di luar bingkai. Penggunaan ini mirip dengan Frameset, mencapai tujuan berbagi navigasi. Niat aslinya baik, tetapi tidak ada keraguan tentang kerugiannya. Ini akan menyebabkan terlalu banyak permintaan untuk satu halaman. Artikel "Praktik Terbaik untuk Mempercepat Situs Web Anda" yang disebutkan di atas dengan jelas menyatakan bahwa mengoptimalkan halaman memerlukan meminimalkan jumlah iframe, dan merangkum tiga kelemahan:
- Bahkan jika kontennya kosong, itu akan menyebabkan kehilangan sumber daya (termasuk klien dan server);
- Blok halaman Onload Acara Pemicu (Blok Halaman Onload, dan diterjemahkan karena akan mencegah halaman memuat, ada keraguan di sini)
- Tidak ada semantik (SEO adalah bagian penting dari pemasaran situs web)
Dalam versi berikutnya dari HTML5 dari XHTML1.0, tidak ada dukungan untuk tag frameset karena dampak negatif pada ketersediaan halaman web, yang juga menjelaskan beberapa masalah dari samping.
Selain itu, karena iframe tertanam tidak dapat secara otomatis beradaptasi dengan ukuran konten internal, untuk mempertahankan integritas tampilan halaman, juga perlu untuk menulis skrip JavaScript untuk langsung menyesuaikan ukurannya sesuai dengan perubahan dalam konten iframe. Beberapa permintaan yang tersebar, ditambah dengan kebutuhan skrip JavaScript untuk memperbaiki, meningkatkan risiko beberapa halaman iframe halaman yang menjalankan sistem. Jadi, apakah ada cara yang baik untuk mengawasi konten halaman? Sisi server telah lama memberi kami solusi. Termasuk dalam ASP dan metode yang memerlukan dalam PHP semuanya digunakan untuk memasukkan sepotong kode yang ada ke dalam program. Ini juga dapat memungkinkan bagian tertentu dari halaman (seperti menu navigasi, footer) untuk menjadi publik. Namun, setelah berjalan, ini adalah output sebagai halaman lengkap, secara efektif mengurangi permintaan klien, dan tidak ada masalah adaptasi tinggi iframe.