Para aquellos que aún no lo sepan, un iframe en una página web es un documento HTML que está incrustado dentro de otro por medio del uso de la etiqueta <iframe>, la cual se emplea al momento agregar el contenido de fuentes externas en una página, bajo el formato de código HTML..
Contenido
¿Para qué sirve una etiqueta iframe en HTML?
Los iframes se utilizan para insertar un fragmento de contenido de otra fuente en una página. Es algo así como una ventana adicional que muestra ciertos tipos de contenidos externos dentro de ella, pero sin la necesidad de abandonar el dominio para verlos.
¿Cuándo debería utilizar un iframe en una página web?
El propósito principal de un iframe es mostrar contenido de terceros en una página web, o en todo caso, conectar contenido propio, pero que se encuentra publicado en otras plataformas. Algunos de los usos más comunes de los iframes podrían ser los siguientes.
Anuncios
Esta función es mucho más frecuente de lo que se suele esperar, ya que muchos anuncios de barra lateral y de banner son en realidad iframes, permitiendo organizar un poco más estas herramientas dentro del contenido; principalmente para lograr resultados atractivos, sin dejar de lado a la monetización.
Videos de Youtube
El código de inserción de YouTube utiliza un iframe para mostrar un video alojado en su plataforma, sin redirigir a los usuarios a su plataforma. Esto es increíblemente beneficioso para un dominio, ya que ahorrará la molestia de tener que subirlo completo en una biblioteca de medios.
Redes sociales
Una forma de mostrar las publicaciones más recientes es a través de un iframe, el cual es totalmente personalizable. Esto es conveniente porque las publicaciones se actualizarán automáticamente, incluso sin tener que dejar la página una vez que la estás viendo.
Cómo hacer que un iframe se ajuste al contenido
Con tantos dispositivos y pantallas de distintos tamaños, saber cómo hacer que un iframe se ajuste al contenido puede tener sus beneficios. Para lograrlo simplemente modifica el width: del iframe dependiendo del tamaño que quieras que ocupe; si quieres que el iframe ocupe toda la pantalla horizontalmente, agrega un 100% luego de dicho parámetro.
Ejemplos de etiquetas iframe en HTML
Muchas plataformas suelen habilitar sus iframes para ser incrustadas en todo tipo de contenidos, beneficiándose a sí mismas, así como a los dominios en donde se los agrega. ¿Quieres ver ejemplos de etiquetas iframe en HTML? ¡Aquí tienes algunos!
Ejemplo 1:
¿Quieres añadir un iframe con información del Servicio Meteorológico completamente funcional en tu página? Con este ejemplo podrás ver un pronóstico en una pequeña ventana, buscar un mapa o consultar la temperatura minuto a minuto.
<iframe src = «http://www.weather.gov/» width = «1000» height = «400»> </iframe>
Ejemplo 2:
En este ejemplo puedes experimentar un poco con las etiquetas; en este caso lo haremos para eliminar el borde, deshabilitar la barra de desplazamiento, e incluso hacer que el fondo sea transparente para ver un video subido a YouTube
<iframe width = «480» height = «300» src = «https://www.youtube.com/watch?v=GgUU1pCcImo» frameborder = «0» allowfullscreen> </iframe>
Estos artículos te pueden interesar
¿Has visto el resto de artículos disponibles en la web? Échales un vistazo justo aquí abajo.
- Principales ventajas que ofrece la página web para un negocioPuede que ya tengas un negocio lo suficientemente exitoso que ha avanzado… Lee más: Principales ventajas que ofrece la página web para un negocio
- Los 5 mejores consejos de finanzas para que tu negocio crezcaA la hora de sacar adelante un negocio es importante considerar las… Lee más: Los 5 mejores consejos de finanzas para que tu negocio crezca
- ¿Quién se encarga de realizar páginas web?La personalización de los sitios web es cada vez más importante en… Lee más: ¿Quién se encarga de realizar páginas web?