Bij een website is het mogelijk om gebruik te maken van een iFrame.
De vraag is alleen wat gebeurt er nou precies als je een iFrame toevoegt aan jouw website, hoe werkt het en wat kun je allemaal insluiten met een iFrame?
Dit en nog veel meer gaan we behandelen in dit artikel.
Wat is een iFrame?
Een iFrame, ook wel bekend als Inline Frame, is een stukje HTML-code dat een frame uit een andere website op kan roepen en op jouw website kan plaatsen. Anders gezegd is een iFrame dus een element dat een ander HTML-element in je website kan insluiten. Denk bijvoorbeeld aan een YouTube filmpje dat je graag op jouw website wilt plaatsen.
De code die je in dat geval toevoegt, zit in een iFrame en dankzij de iFrame hoef je zelf geen complexe code te schrijven. Je hoeft enkel de HTML-code van een iFrame te plaatsen op je website en dan verschijnt de inhoud op je pagina alsof het een onderdeel is van jouw website.
Hoe werkt een iFrame?
Om een iFrame toe te voegen aan een webpagina hoef je enkel het iFrame-element toe te voegen aan de HTML-code van de pagina. Wanneer je WordPress gebruikt kan dit in het ‘eigen HTML’ blok.
Het iFrame-element bevat de URL van de webpagina die je wilt integreren op de pagina van je website, maar daarnaast staan er vaak nog enkele opties die je kunt instellen, zoals de breedte en hoogte van het venster.
Hieronder zie je hoe een iFrame van een YouTube-video eruitziet. Je ziet dan ook extra toevoegingen zoals width (breedte), height (hoogte), src (URL) en nog een aantal dingen meer.
<iframe width="560" height="315" src="https://www.youtube.com/embed/ccD-LxLeUws" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
Verder is het dus ook mogelijk om een hele website van iemand anders in jouw website in te laden door gebruik te maken van een iFrame. Daarvoor moet gebruikgemaakt worden van onderstaande code, waarbij een website naar keuze ingevuld kan worden op de plek waar URL staat.
<iframe src="URL"></iframe>
Waar kun je een iFrame allemaal voor gebruiken?
We weten ondertussen dat je met een iFrame externe content kunt integreren op je website en dat een YouTube video geen enkel probleem zal zijn. Er zijn echter nog veel meer voorbeelden van dingen die je met behulp van een iFrame op je website kunt plaatsen.
Zo kun je naast video’s ook Google Maps kaarten, sociale media knoppen, formulieren of complete pagina’s tonen op je website.
Een voorbeeld is het insluiten van een YouTube-video op uw website met behulp van een iframe.
Een iframe kan worden gebruikt om allerlei soorten content te integreren, zoals video’s, kaarten, sociale media-widgets en nog veel meer. Het kan ook worden gebruikt om de lay-out van een webpagina te verbeteren door de integratie van verschillende elementen op een gecontroleerde manier.
Heeft een iFrame beperkingen?
Met een iFrame is zoals je ondertussen weet veel mogelijk, maar zijn er dan helemaal geen beperkingen? Helaas heeft ook een iFrame beperkingen.
Wanneer een bezoeker van je website een adblocker gebruikt, dan kan het zijn dat de iFrame geblokkeerd wordt en niet zichtbaar is.
Verder kunnen veiligheidsinstellingen ook ertoe leiden dat een iFrame niet helemaal goed geladen wordt. Tot slot kan de snelheid van je website trager worden als je veel iFrames op de pagina insluit.
Hoewel deze beperkingen er zijn, zou ik mij niet laten afschrikken als ik jou was. Neem bijvoorbeeld een YouTube video, die heeft weinig last van bovengenoemde beperkingen en zo is dat met heel veel andere dingen ook.
Is een iFrame gevaarlijk?
Niet iedere partij waarvan je een iFrame kunt toevoegen, is ook daadwerkelijk te vertrouwen. In sommige gevallen kan het gebruik van iFrames namelijk ook leiden tot beveiligingsproblemen, want er kan bijvoorbeeld kwaadwillende inhoud getoond worden via de iFrame en dat willen we natuurlijk niet. Je hoeft dit zelf niet eens door te hebben.
Het is daarom extreem belangrijk om enkel externe content in te laden via een iFrame via websites die je vertrouwt. Zo is YouTube bijvoorbeeld een betrouwbare partij, sociale media als Facebook, Twitter, etc. is ook gewoon veilig en op Google Maps kun je natuurlijk ook rekenen. Natuurlijk zijn er nog veel meer websites zijn die te vertrouwen zijn, maar wees altijd alert wat je precies met een iFrame insluit op jouw website.