Avance 3. Construyendo mi página
Durante la actividad anterior has decidido el estilo que debe llevar tu página, continuemos comunicándonos con la computadora a través del lenguaje de programación, es decir, las etiquetas de HTML y los estilos de CSS. Pero… y ¿cómo funciona este lenguaje? Fácil, por ejemplo, el color necesita un código hexadecimal para que se muestre en pantalla y las imágenes necesitan especificaciones técnicas como el tamaño en pixeles, para que logren visualizarse correctamente en pantalla.
¡Cerremos este módulo y muestra tu talento en Visual Studio!
Propósito
Utilizar estilos CSS para la construcción de una página web desde HTML.
Modalidad
Mixta
Producto
Documento HTML y CSS editados en Visual Studio.
Instrucciones
- Visualiza nuevamente el siguiente video y presta atención a las diferentes
formas de escritura entre HTML y CSS:
2. Ingresa a los siguientes enlaces y observa cómo crear un archivo CSS para darle estilo a tu página
3. Establece los estilos de texto que tendrá tu página de acuerdo con la fuente y color seleccionado en la actividad anterior y crea un archivo CSS.
4. Retoma tu archivo HTML desde Visual Studio (corresponde al avance 2) y agrega los estilos CSS.
Hasta ahora tu página web se encuentra estructurada en forma vertical. Es momento de conocer otras funciones que pueden darle una mejor estructura visual.
Sigue las instrucciones:
5. Ingresa a los siguientes enlaces:
https://www.eniun.com/elementos-estilos-codigo-composicion-web/
https://www.eniun.com/formatos-fuentes-css-repositorios/
¿Cuál de las estructuras podrías incluir en tu página web? Si hay algo que quisieras incluir y no sabes cómo hacerlo, pregúntale a tu asesor.
6. Inserta las imágenes que elegiste en tu documento HTML. Puedes consultar
el siguiente enlace para recordar como hacerlo
7. Una vez que hayas completado tu archivo, ábrelo desde el explorador de internet (google, edge, mozilla) para que puedas visualizarlo y si lo requiere, corrige errores.
8. Cuando consideres que está listo, comprime la carpeta de tu proyecto en un .zip (asegúrate que estén incluidos los archivo HTML, CSS y las imágenes).
9. Envía la carpeta comprimida al buzón de entrega
Evaluación
Fondo
• Escribe correctamente las etiquetas HTML e incorpora los estilos CSS, sin que le genere errores.
• Estructura el contenido completo de su página.
• Incluye correctamente las imágenes.
Forma
• Entrega en tiempo y forma.