iFrame

Een iframe (inline frame) is een HTML-element dat een webpagina binnen een andere webpagina insluit. Gedefinieerd door de `<iframe>`-tag, creëert het een onafhankelijk rechthoekig venster binnen je pagina dat content van een aparte URL laadt en weergeeft. De ingesloten content behoudt zijn eigen documentcontext — met gescheiden DOM, stijlen en scripts — geïsoleerd van de hostpagina. Iframes worden veel gebruikt om video's, kaarten, formulieren, betaalgateways en interactieve widgets in te sluiten zonder dat de hostpagina de code of styling van die content direct hoeft te verwerken.

Voor digitale uitgevers bieden iframes de eenvoudigste en meest universele manier om een interactief [flipbook](/glossary/flipbook) of documentviewer direct op een bestaande website te plaatsen. Bezoekers kunnen door de publicatie bladeren zonder de pagina te verlaten, wat hen betrokken houdt op je site in plaats van ze door te sturen naar een externe link. Dit verbetert de tijd op de pagina, verlaagt het [bouncepercentage](/glossary/bounce-rate) en integreert de leeservaring naadloos in je bestaande ontwerp. Omdat iframes een native HTML-functie zijn die door elke moderne browser wordt ondersteund, werken ze op WordPress, Shopify, Squarespace, op maat gemaakte sites en vrijwel elk CMS.

FlipLink genereert een kant-en-klare iframe-[inbeddingscode](/glossary/embed-code) voor elk gepubliceerd [flipbook](/glossary/flipbook) en document. Je kopieert het insluitfragment uit je FlipLink-dashboard en plakt het in de HTML van je website, CMS-editor of landingspaginabouwer. De iframe laadt de volledige FlipLink-viewer — inclusief [paginaomslaganimaties](/glossary/page-flip-animation), [CTA-knoppen](/glossary/call-to-action-cta), [leadcaptureformulieren](/glossary/lead-capture) en [analytics-tracking](/glossary/analytics-dashboard) — binnen de afmetingen die je opgeeft. FlipLink's [responsieve insluiting](/features/sharing-and-distribution) zorgt ervoor dat de iframe automatisch wordt aangepast aan elk schermformaat. FlipLink biedt ook een [klikbare afbeeldingsinsluiting](/features/clickable-image-embed) als lichtgewicht alternatief dat linkt naar de volledige viewer.

Een iframe-insluiting gebruikt deze basis HTML-structuur: ```html <iframe src="https://go.fliplink.me/your-flipbook" width="100%" height="600" frameborder="0" allowfullscreen> </iframe> ``` Belangrijke attributen die het gedrag beïnvloeden: - **`src`** — De URL van de in te sluiten content. FlipLink levert deze URL voor elke publicatie. - **`width` / `height`** — Bepaalt het zichtbare gebied. FlipLink's responsieve insluitcode gebruikt percentagebreedtes voor vloeiende lay-outs. - **`sandbox`** — Beperkt wat de ingesloten content kan doen (bijv. formulieren, scripts of pop-ups blokkeren). FlipLink's insluitcode is geconfigureerd om de interacties toe te staan die nodig zijn voor volledige functionaliteit. - **`loading="lazy"`** — Stelt het laden van de iframe uit tot de gebruiker ernaartoe scrollt, wat de initiële laadsnelheid van de pagina verbetert. - **`allow`** — Specificeert functierechten zoals volledig-schermmodus, die FlipLink gebruikt voor een meeslepende leeservaring.

Iframes introduceren een vertrouwensgrens tussen de hostpagina en de ingesloten content. Het begrijpen van het beveiligingsmodel helpt je content veilig in te sluiten: - **Same-origin policy** — Browsers voorkomen dat de hostpagina toegang krijgt tot het DOM van een cross-origin iframe, en vice versa. Je website kan de interne werking van de FlipLink-viewer niet lezen of manipuleren, en de ingesloten viewer kan niet bij de cookies of gegevens van je site. - **[Domein-whitelisting](/glossary/domain-whitelisting)** — FlipLink stelt je in staat te beperken welke domeinen je publicaties mogen insluiten, waardoor ongeautoriseerde sites je content niet in hun eigen iframes kunnen tonen. - **Content Security Policy (CSP)** — Als je website strikte CSP-headers gebruikt, moet je mogelijk FlipLink's domein toevoegen aan je `frame-src`-richtlijn om het laden van de iframe toe te staan. - **Clickjacking-bescherming** — FlipLink stelt passende `X-Frame-Options`- en CSP-headers in om te bepalen waar de viewer kan worden ingesloten, terwijl je geautoriseerde domeinen worden toegestaan.

**"Iframes zijn slecht voor SEO."** Zoekmachines kunnen links binnen iframes volgen en de ingesloten content apart indexeren, maar de content draagt niet bij aan de SEO-ranking van de hostpagina. Voor flipbooks is dit geen probleem — de SEO-waarde zit in de eigen content, koppen en metadata van je pagina, terwijl het flipbook dient als engagement-tool. **"Iframes vertragen altijd mijn pagina."** Een iframe op zich voegt minimale overhead toe. Prestatieproblemen ontstaan door wat de iframe laadt. Het gebruik van `loading="lazy"` zorgt ervoor dat het flipbook pas wordt geladen wanneer de gebruiker ernaartoe scrollt, waardoor de initiële paginalading snel blijft. **"Iframes zijn verouderde technologie."** Hoewel sommige verouderde toepassingen van iframes (zoals het bouwen van paginalay-outs) inderdaad achterhaald zijn, blijft iframe-gebaseerde insluiting de standaard voor widgets van derden, betaalformulieren en interactieve content. Elk groot platform — YouTube, Google Maps, Stripe en FlipLink — gebruikt iframes voor insluiting.

Een iframe is de standaard, veilige methode voor het insluiten van interactieve content zoals flipbooks op elke website. Het biedt volledige functionaliteit terwijl de ingesloten content geïsoleerd blijft van de code en stijlen van je hostpagina.