Embed HTML: Integrar contenido externo en tus páginas web

La etiqueta HTML <embed> te permite incorporar contenido externo en una página web, como aplicaciones de terceros, archivos multimedia o plugins interactivos. Aunque la etiqueta <embed> es compatible con HTML5, se recomienda usar las etiquetas <audio> y <video> para integrar archivos multimedia, ya que están diseñadas específicamente para este propósito.

La etiqueta <embed> ofrece una manera sencilla de agregar contenido externo a tus páginas web, ampliando las posibilidades de interactividad y funcionalidad. En este artículo, exploraremos en detalle cómo usar la etiqueta <embed> para integrar diferentes tipos de contenido en tus proyectos web.

La sintaxis de la etiqueta <embed>

La sintaxis básica de la etiqueta <embed> es la siguiente:

html
<embed src="ruta/al/recurso" />


El atributo src especifica la ubicación del recurso que deseas integrar. Puedes usar una URL absoluta o relativa para referirte al archivo.

Atributos esenciales de la etiqueta <embed>

Además del atributo src, la etiqueta <embed> admite una serie de atributos que te permiten controlar la apariencia y el comportamiento del contenido integrado.

• height: Define la altura del contenido integrado en píxeles.
• width: Define el ancho del contenido integrado en píxeles.
• type: Especifica el tipo MIME del recurso que deseas integrar. Esto es necesario para que el navegador interprete correctamente el contenido.
• pluginspage: Proporciona una URL a una página web que contiene información sobre el plugin necesario para mostrar el contenido.
• align: Permite controlar la alineación del contenido integrado dentro del elemento padre.

Ejemplos de uso de la etiqueta <embed>

Veamos algunos ejemplos de cómo usar la etiqueta <embed> para integrar diferentes tipos de contenido:

1. Integrar archivos multimedia

La etiqueta <embed> puede utilizarse para integrar archivos de audio y video en tus páginas web. Sin embargo, es preferible usar las etiquetas <audio> y <video> para este fin.

html
<embed src="audio.mp3" type="audio/mpeg" height="30" width="300" />


Este código integrará un archivo de audio llamado «audio.mp3» en la página web. La etiqueta type especifica el tipo MIME del archivo, que en este caso es audio/mpeg. Los atributos height y width definen las dimensiones del reproductor de audio.

2. Integrar aplicaciones de terceros

La etiqueta <embed> te permite integrar aplicaciones de terceros en tus páginas web, como mapas, juegos o herramientas de análisis.

html
<embed src="https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d14465.535976886497!2d-74.00601548476606!3d40.71282348029964!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1sCentral%20Park%2C%20New%20York%2C%20NY%2010024%2C%20USA!5e0!3m2!1ses!2sus!4v1677854226057!5m2!1ses!2sus"
width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" />


Este código integra un mapa de Google Maps en la página web. La URL del recurso incluye los parámetros necesarios para mostrar el mapa en el lugar deseado. Los atributos width y height definen las dimensiones del mapa.

3. Integrar archivos PDF

La etiqueta <embed> permite integrar archivos PDF en tu página web. Los usuarios podrán ver el archivo PDF directamente en la página sin necesidad de descargarlo.

html
<embed src="documento.pdf" type="application/pdf" width="100%" height="600" />


Este código integrará un archivo PDF llamado «documento.pdf» en la página web. La etiqueta type especifica el tipo MIME del archivo, que en este caso es application/pdf. Los atributos width y height definen las dimensiones del documento PDF.

Consideraciones adicionales para el uso de la etiqueta <embed>

• Compatibilidad con el navegador: Aunque la etiqueta <embed> es compatible con los principales navegadores modernos, es importante comprobar la compatibilidad con el navegador que deseas usar.
• Seguridad: La etiqueta <embed> puede utilizarse para integrar contenido de fuentes externas. Es importante tener en cuenta los riesgos de seguridad asociados a la integración de contenido de fuentes desconocidas.
• Alternativas a la etiqueta <embed>: Para integrar contenido multimedia, se recomienda usar las etiquetas <audio> y <video> para obtener una mayor compatibilidad y control sobre la reproducción.

• Embed HTML vs. HTML embed HTML:

  • Embed HTML se refiere al acto de integrar contenido externo en una página web utilizando la etiqueta <embed>.
  • HTML embed HTML, en realidad, no es un concepto válido. Es posible que haya confusiones con el uso de la etiqueta <embed> para integrar otro archivo HTML, pero esto es un caso específico de embed HTML y no una categoría separada.

Conclusión

La etiqueta <embed> es una herramienta versátil que te permite integrar contenido externo en tus páginas web, ampliando las posibilidades de interactividad y funcionalidad. Aunque se recomienda usar las etiquetas <audio> y <video> para integrar archivos multimedia, la etiqueta <embed> sigue siendo útil para integrar otros tipos de contenido como aplicaciones de terceros, archivos PDF o plugins. Recuerda siempre considerar las implicaciones de seguridad y la compatibilidad con el navegador antes de usar la etiqueta <embed>.