¿Qué es iframe en un sitio web?

Cuando piensas desarrollar una página web, cuentas con una serie de características de las etiquetas HTML para que se vea bien tu diseño web y funcione correctamente. Uno de ellos es el iframe, que significa Inline Frame (marco en línea). Pero ¿Qué es y para qué sirve la etiqueta iframe? Veámoslo a continuación.

¿Que es iframe?

Un iframe (inline frame) es un documento HTML incrustado en otro documento HTML de un sitio web. El objetivo principal del elemento iframe es permitir a los autores incrustar contenidos de fuentes externas, como anuncios, mapas, vídeos o formularios en sus páginas web.

¿Para qué sirve y en que casos usar un iframe?

La etiqueta iframe se utiliza habitualmente para mostrar contenidos de otros sitios web, como vídeos, mapas y formularios. También puede utilizarse para incrustar una página dentro de otra página del mismo sitio web. Por ejemplo, puedes utilizar un iframe para incrustar un vídeo de YouTube en tu página web, incrustar un formulario externo dentro de una de sus páginas e incluso una ubicación de Google Maps.

Además, los iframes también pueden utilizarse para proteger su sitio web de scripts maliciosos. Si incrusta una página externa con contenido malicioso en un iframe, ese contenido malicioso no afectará a su sitio, ya que está contenido dentro del iframe.

Por último, los desarrolladores web pueden utilizar la etiqueta iframe para ayudar a crear sitios web adaptativos. Esto se debe a que un iframe les permite incrustar contenido de un sitio diferente en el suyo, sin tener que preocuparse de que los estilos de esa página externa entren en conflicto con los tuyos.

¿Cómo añadir un iframe a mi sitio web?

Añadir un iframe a su sitio web es relativamente sencillo. Todo lo que tiene que hacer es insertar el código HTML correcto en la página en la que desea que aparezca el iframe. También debe incluir una URL válida para la fuente del contenido que desea incrustar.

Por ejemplo, supongamos que deseas incrustar un vídeo de YouTube. Puedes hacerlo desde la opción compartir y allí encontrarás la opción para incorporar código mediante la etiqueta iframe.

Tan solo bastará en copiar y pegar el código que verás allí en tu sitio web, para tener tu video hipervinculado en tu sitio web.

¿Cómo añadir una ubicación de google maps a mi sitio web?

Gracias a la etiqueta iframe con Google Maps, puedes añadir fácilmente una ubicación de Google Maps a tu sitio web. Todo lo que tiene que hacer es abrir Google Maps y buscar la dirección o el lugar que desea incrustar, a continuación, haz clic en el botón de compartir.

A continuación, haz clic en "Incrustar mapa" y copia el código HTML que te proporcionará. Este código es una etiqueta iframe que permite incrustar la ubicación de Google Maps dentro de su propio sitio web.

Solo tienes que pegar este código en la página de tu sitio web en la que quieras que aparezca la ubicación y ¡listo! Ya tienes una ubicación de Google Maps totalmente funcional incrustada en tu sitio web.

¿Cuáles son las ventajas y desventajas de Google Maps?

Conoce cuáles son las ventajas y desventajas de Google Maps como herramienta de orientación para que consideres usarla en tu cotidianidad.

Tutoriales DongeeYulima Hernandez

Conclusión

La etiqueta iframe es un elemento HTML que puedes utilizar para incrustar contenido de fuentes externas, como anuncios, mapas, vídeos o formularios en tus páginas web. También se puede utilizar para crear sitios web con capacidad de respuesta, proteger su sitio de scripts maliciosos e incluso añadir una ubicación de Google Maps a su sitio web. Añadir un iframe a su sitio web es relativamente sencillo: todo lo que tienes que hacer es insertar el código HTML correcto en la página donde quieres que aparezca el iframe e incluir una URL válida para la fuente del contenido.

Esperamos que este artículo te haya ayudado a entender cómo y por qué utilizar un elemento iframe en tu sitio web. ¡Mucha suerte!