Uso de elementos multimedia

Inclusión de imagen responsive y SVG, y video de youtube.

Imagen responsive

Para crear una imagen responsive se debe incluir la etiqueta <picture> y definir cada una de las imágenes a mostrar según el tamaño de la pantalla.

<picture>
    <source media="(min-width: 1100px)" srcset="../images/people6.png">
    <source media="(min-width: 1000px)" srcset="../images/people6.png">
    ...
</picture>

Imagen gente responsive

Imagen SVG

Este es un formato de imagen definido matemáticamente, y calculado automáticametne por el navegador de modo que su visualización no pierde calidad en los diferentes tamaños. Se crea como una imagen.

<img src="../images/peoplevector1.svg" width="100%" alt="nombre de la imagen">

Imagen vector SVG

Vídeo de youtube

Para publicar un vídeo alojado en un servidor externo se debe incluir la url del video

<iframe width="100%" height="700" src="url del video" frameborder="0" allowfullscreen>