"Página personal de Guadalupe Puga"

Esta página es la entrega final del módulo 2, el cuál esta relacionado con la estructura de HTML5/CSS3 para multipantalla y objetos multimedia.

El módulo fue dividido en 5 temas de los cuales se hace mención a continuación:

Tema 1.-Mi primera página en Dreamweaver

En este tema se mostro la forma en que se genera una página Web por medio del Software de Adobe, Dreamweaver, en esta parte se mostro como insertar elementos de HTML5 de manera muy sencilla, con solo dar clic en un botón, además de crear menús de manera muy sencilla, algunas de las etiquetas que se insertaron fueron:

Tema 2.-HTML/CSS: Estructura CSS

Aquí se mostro el uso de float y clear, que permiten posicionar los <div> flotando en la pantalla, y el clear que rompe este esquema,también que el <div> se puede poner en una posición absoluta, lo que no es muy recomendable. Además de esto se mostro como trabajar con texto CSS, como declarar fuentes, y como vincular fuentes sin que el cliente las tenga instaladas. A continuación se muestran algunas fuentes importadas:

Tema 3.-HTML/CSS: vídeo, audio e imagen

En este tema se detallaron los tipos de imágenes, vídeo y audio que se puede usar en una página web, además de que se menciono que las imágenes vectoriales son las mejores para integrarse en páginas web debido a que no pierden calidad cuando se escalan. Se observo como funciona la etiqueta <picture> y se menciono que sirve para imagenes responsive. Otra etiqueta que se explicó fue la de <video>, además de sus atributos (poster, controls, width, height, loop, autoplay, preload), por último la etiqueta <audio> y sus características.

Tema 4.-Integración de objetos y de multimedia en HTML5

Se vieron las diferentes marcas o etiquetas para agregar objetos y multimedia en una página web, las que se mencionaron son las siguientes:<audio> .

Se observaron los diferentes formatos de video, y se dio una explicación acerca de como elegir la etiqueta adecuada para cada página, a continuación unos ejemplos del uso de estas etiquetas: