Hairum FellayatiKetika mendesain sebuah website, iFrame adalah salah satu istilah yang pasti akan Anda temui. Tool satu ini bisa dibilang sebagai salah satu elemen yang cukup berpengaruh di dunia desain web.
Tak hanya pengertiannya, di artikel kali ini, Rumahweb juga akan membahas manfaat, konsep, beserta contoh script dari iFrame. Mari disimak!
Apa itu iFrame?
Inline Frame, atau lebih dikenal dengan singkatan iFrame adalah sebuah komponen file HTML yang memungkinkan Anda menyematkan teks, foto, video, atau file lain ke dalam sebuah halaman website.
File yang disematkan pun bisa berasal dari mana saja. Bisa dari website Anda sendiri maupun dari website lain, seperti ketika Anda menyematkan video YouTube ke dalam website.
Menyematkan file dengan teknik ini disebut embed iFrame. Biasanya, penggunaan iFrame pada sebuah file HTML ditandai dengan adanya tag <iFrame>.
Manfaat iFrame
Sebenarnya, Anda bisa mengunggah file yang dibutuhkan di website dengan mudah. Namun banyak yang memilih untuk menggunakan iFrame karena manfaat atau kelebihan yang ditawarkan oleh iFrame. Beberapa kelebihan atau manfaat penggunaan iFrame adalah sebagai berikut:
1. Menghemat Penggunaan Storage
Seperti yang sudah disinggung sebelumnya, teknik iFrame adalah menyematkan file ke dalam website. Artinya, Anda tidak perlu mengunggah file tersebut di media library.
Dengan embed iFrame, otomatis file tidak tersimpan di server Anda, sehingga akan menghemat penggunaan storage (media penyimpanan). Apalagi, jika file yang ingin disematkan memiliki ukuran yang besar. Anda tidak perlu khawatir kekurangan storage jika menggunakan iFrame.
2. Menghindari Pelanggaran Hak Cipta
Selain menghemat media penyimpanan, manfaat lain dari iFrame adalah untuk menghindari pelanggaran hak cipta.
Konten yang ada di internet umumnya sudah memiliki hak cipta. Ketika ada konten yang menarik dan relate dengan kebutuhan website, Anda tentu ingin menggunakannya. Mungkin, Anda akan mengunduhnya lalu mengunggah ulang di website.
Tapi cara seperti ini berpotensi melanggar hak cipta, bahkan Anda bisa terjerat hukum jika sang pemilik tak terima konten miliknya dipakai atau diunggah ulang.
Karena itulah, menggunakan iFrame dapat membuat bisa terhindar dari risiko tersebut, karena Anda tidak mengunggah ulang, melainkan hanya menyematkan atau menyisipkan konten ke dalam website.
Konsep iFrame HTML
Seperti yang sudah dijelaskan sebelumnya, konsep dari iFrame adalah menyematkan atau menyisipkan konten dari website atau luar website tanpa harus menyimpannya terlebih dahulu.
Jadi, konten yang Anda sematkan menggunakan iFrame akan muncul layaknya konten yang diunggah melalui media library.
Untuk memunculkan embed iFrame, Anda harus memastikan beberapa komponen tag ini ada di dalamnya.
Sebagai contoh, dalam embed iFrame berikut:
<iFrame src=" https://www.youtube.com/watch?v=7gL5gtZlNws" width="680" height="480" allowfullscreen></iFrame>Terdapat beberapa komponen tag yang ada dalam embed iFrame tersebut, yaitu:
- Tag <iFrame>……<iFrame> berfungsi untuk menyertakan video ke dalam iFrame.
- Tag src (Source iFrame) mengacu pada link asal konten. Tag ini berisi kode yang di-embed ke URL
- Tag width dan height yang mengacu pada rasio aspek iFrame atau ukuran file yang disematkan melalui iFrame. Terdapat dua rasio yang digunakan, yaitu 640×480 (piksel) atau berbasis persentase yang nantinya diatur secara otomatis
Contoh Script iFrame HTML
Bagi Anda yang tertarik untuk mempelajari lebih jauh tentang iFrame HTML ini, Anda dapat melihat contoh script iFrame HTML yang pernah Rumahweb bahas di artikel berikut ini: Cara Membuat Script iFrame HTML
Kesimpulan
iFrame adalah komponen yang dapat membantu Anda menyematkan beragam file ke dalam website tanpa perlu menyimpan dan mengunggahnya terlebih dahulu. Selain menghemat penyimpanan data (storage) dan menghindari Anda dari pelanggaran hak cipta, iFrame juga menjadi elemen yang cukup berpengaruh terhadap engagement website.
Namun, Anda tetap perlu berhati-hati ketika menggunakan konten dari luar website. Pastikan file yang di-embed terpercaya, sehingga website Anda tetap aman. Selamat mencoba!
