Alternativas de iframe en HTML

Subodh Poudel 19 febrero 2023
  1. Utilice la etiqueta object como alternativa al iframe en HTML
  2. Utilice la etiqueta embed como alternativa al iframe en HTML
Alternativas de iframe en HTML

En HTML, usamos Iframes para especificar un marco en línea a través del cual podemos incrustar una página web en una página web. En este tutorial, presentaremos algunas otras alternativas a Iframe para mostrar páginas web.

Utilice la etiqueta object como alternativa al iframe en HTML

Podemos usar la etiqueta object en HTML para incrustar recursos externos en la página web. Podemos usar la etiqueta para mostrar otra página web en nuestra página web. La etiqueta object es una alternativa a la etiqueta iframe en HTML. Podemos utilizar la etiqueta para incrustar diferentes componentes multimedia como imagen, vídeo, audio, etc. La etiqueta object tiene un atributo data donde podemos definir la URL de la página web a incrustar. Incluso podemos establecer el ancho y alto del contenedor usando los atributos width y height.

Por ejemplo, escriba la etiqueta object y establezca la URL https://theuselessweb.com/ en el atributo data. Luego, establezca los atributos width y height de la etiqueta object en 800. A continuación, establezca el atributo type en text/html. Finalmente, cierre la etiqueta object.

Cuando cargamos la siguiente página web en el navegador, podemos ver la página web incrustada en un contenedor. Podemos interactuar con la página web incrustada. El tipo text/html indica que el contenido incrustado es HTML. De esta manera, podemos usar la etiqueta object para incrustar una página web en una página web que es una alternativa a la etiqueta iframe en HTML. Sin embargo, es mejor utilizar la etiqueta iframe en lugar de la etiqueta object.

Código de ejemplo:

<object data="https://theuselessweb.com/"
width="800"
height="800"
type="text/html">
</object>

Utilice la etiqueta embed como alternativa al iframe en HTML

La etiqueta embed es similar a la etiqueta object y se utiliza para el mismo propósito. Podemos incrustar varios recursos externos en nuestra página web usando la etiqueta incrustar. Podemos incrustar medios como PDF, imágenes, audio, video y páginas web. La etiqueta define un contenedor en el que podemos incrustar nuestro contenido deseado. La etiqueta embed es una etiqueta de cierre automático. Podemos utilizar el atributo src para especificar la URL de la página web a incrustar. La etiqueta tiene un atributo type para especificar el tipo de contenido que se incrustará. De manera similar, podemos definir la altura y el ancho, lo mismo con la etiqueta object.

Por ejemplo, escriba la etiqueta embed y establezca el atributo type en text/html. A continuación, escriba el atributo src y configúrelo en https://theuselessweb.com/. Luego, establezca la altura y el ancho del contenedor en 500 y 800.

La medida de alto y ancho está en píxeles. De esta forma, podemos utilizar la etiqueta embed como alternativa a la etiqueta iframe en HTML. Sin embargo, se recomienda la etiqueta iframe en lugar de la etiqueta embed.

Código de ejemplo:

<embed type="text/html" src="https://theuselessweb.com/" width="800" height="500">
Subodh Poudel avatar Subodh Poudel avatar

Subodh is a proactive software engineer, specialized in fintech industry and a writer who loves to express his software development learnings and set of skills through blogs and articles.

LinkedIn