Construcción de sitios Web
campus
MZL
Programa
Diseño Gráfico Digital
Tipo
Curso
Nivel
3
Área
Web
Periodo
241
Estado
Actualizado


Construcción de sitios Web ?
La materia de Construcción de Sitios Web es crucial para estudiantes del Técnico en Diseño Gráfico. Aprenderán conceptos fundamentales de páginas web, HTML y CSS, habilidades esenciales para crear diseños atractivos y funcionales en el mundo digital actual.

Habilidades a desarrollar

Durante el curso de Construcción de Sitios Web, los estudiantes desarrollarán las siguientes habilidades clave: Diseño y Estructura Web: Aprenderán a crear diseños web atractivos y funcionales, comprendiendo la importancia de una estructura bien organizada para una experiencia de usuario óptima. HTML: Dominarán el lenguaje de marcado HTML para crear y estructurar el contenido de una página web, incluyendo texto, imágenes, enlaces y otros elementos. CSS: Adquirirán habilidades en el uso de CSS para aplicar estilos y formatos al contenido HTML, personalizando la apariencia visual de las páginas web.

Módulos del curso

1.0
Introducción a HTML
• Estructura básica de una página HTML. • Etiquetas de encabezado, párrafo, lista, enlaces y otros elementos fundamentales. • Creación de una página web simple.
Requisitos previos: Conocimientos básicos de navegación en internet y el uso de un navegador web. Familiaridad con el sistema operativo de la computadora utilizada. Materiales: Un editor de texto, como Visual Studio Code, Sublime Text o Notepad++, instalado en la computadora. Enlaces: Documentación de HTML Ejemplos de páginas web simples para la práctica inicial.
 
 
 
2.0
Inserción de Imágenes y Multimedia en HTML
• Cómo agregar imágenes a una página HTML. • Uso de etiquetas multimedia para incorporar audio y video. • Ajuste y optimización de recursos multimedia.
Requisitos previos: Conocimientos básicos de navegación en internet y el uso de un navegador web. Familiaridad con el sistema operativo de la computadora utilizada. Materiales: Un editor de texto, como Visual Studio Code, Sublime Text o Notepad++, instalado en la computadora. Enlaces: Documentación de HTML Ejemplos de páginas web simples para la práctica inicial.
 
 
 
3.0
Creación de Enlaces y Botones Interactivos en HTML
• Creación de enlaces internos y externos. • Uso de anclajes para navegar dentro de la misma página. • Creación de botones interactivos con HTML y CSS.
Requisitos previos: Conocimientos básicos de navegación en internet y el uso de un navegador web. Familiaridad con el sistema operativo de la computadora utilizada. Materiales: Un editor de texto, como Visual Studio Code, Sublime Text o Notepad++, instalado en la computadora. Enlaces: Documentación de HTML Ejemplos de páginas web simples para la práctica inicial.
 
 
 
4.0
Introducción a CSS
• Sintaxis básica de CSS. • Aplicación de estilos en línea y estilos internos. • Selectores CSS y sus propiedades fundamentales.
Requisitos previos: Comprensión básica de HTML y las etiquetas comunes. Materiales: El editor de texto utilizado en la sesión anterior. Navegador web actualizado (Google Chrome, Mozilla Firefox, etc.). Enlaces: Documentación de CSS
 
 
 
5.0
Estilización de Texto, Imágenes y Fondos con CSS
• Estilización de texto: fuentes, tamaños, colores y efectos. • Personalización de imágenes y fondos con CSS. • Uso de box model para controlar el tamaño y el espacio de los elementos.
Requisitos previos: Comprensión básica de HTML y las etiquetas comunes. Materiales: El editor de texto utilizado en la sesión anterior. Navegador web actualizado (Google Chrome, Mozilla Firefox, etc.). Enlaces: Documentación de CSS
 
 
 
6.0
Diseño Responsivo con Media Queries
• Conceptos de diseño responsivo y adaptativo. • Uso de media queries para ajustar el diseño según el dispositivo. • Creación de diseños flexibles y fluidos.
Requisitos previos: Comprensión básica de HTML y las etiquetas comunes. Materiales: El editor de texto utilizado en la sesión anterior. Navegador web actualizado (Google Chrome, Mozilla Firefox, etc.). Enlaces: Documentación de CSS
 
 
 
7.0
Evaluación Parcial - Demostración de los Conocimientos Adquiridos
El módulo de Evaluación Parcial: Demostración de los Conocimientos Adquiridos tiene como objetivo evaluar las habilidades y conocimientos de los estudiantes en la aplicación práctica de lo aprendido a lo largo del curso. Durante este módulo, los estudiantes realizarán una serie de tareas y ejercicios que pondrán a prueba sus capacidades en la creación y gestión de sitios web utilizando las tecnologías estudiadas.
Requisitos previos: Familiaridad con HTML y CSS. Materiales: Editor de texto y navegador web utilizados en las sesiones anteriores. Enlaces: Documentación de formularios HTML y elementos de formulario. Ejemplos de formularios interactivos y buenas prácticas.
 
8.0
Creación de Diseños Avanzados con Flexbox y CSS Grid
• Introducción a Flexbox y su uso para la creación de diseños flexibles. • Creación de diseños bidimensionales con CSS Grid. • Combinación de Flexbox y Grid para diseños complejos.
Requisitos previos: Familiaridad con HTML y CSS. Materiales: Editor de texto y navegador web utilizados en las sesiones anteriores. Enlaces: Documentación de formularios HTML y elementos de formulario. Ejemplos de formularios interactivos y buenas prácticas.
 
 
 
9.0
Personalización de Tipografía y Efectos de Texto con CSS
• Uso de fuentes web de Google Fonts y otros recursos. • Estilización avanzada de texto con CSS. • Creación de efectos tipográficos atractivos.
Requisitos previos: Finalización de los submódulos anteriores y comprensión básica de HTML, CSS y formularios. Materiales: Editor de texto y navegador web utilizados a lo largo del curso. Enlaces: Guía para la planificación y desarrollo del proyecto final. Herramientas y recursos adicionales para el desarrollo web.
 
 
 
10.0
Módulo 10: Animaciones y Transiciones CSS
• Animaciones CSS: keyframes y propiedades de animación. • Transiciones CSS para crear efectos de cambio suaves. • Integración de animaciones en el sitio web.
Requisitos previos: Conocimientos básicos de navegación en internet y el uso de un navegador web. Familiaridad con el sistema operativo de la computadora utilizada. Materiales: Un editor de texto, como Visual Studio Code, Sublime Text o Notepad++, instalado en la computadora. Enlaces: Documentación de HTML Ejemplos de páginas web simples para la práctica inicial.
 
 
11.0
Creación de Formularios Interactivos
• Uso de etiquetas de formulario: input, textarea, select, etc. • Validación básica de formularios con atributos HTML. • Enviar datos de formulario a un servidor.
Requisitos previos: Finalización de los submódulos anteriores y comprensión básica de HTML, CSS y formularios. Materiales: Editor de texto y navegador web utilizados a lo largo del curso. Enlaces: Guía para la planificación y desarrollo del proyecto final. Herramientas y recursos adicionales para el desarrollo web.
 
 
 
12.0
Validación Personalizada y Mejora de la Accesibilidad en Formularios
• Validación personalizada . • Mostrar mensajes de error y retroalimentación al usuario. • Mejora de la accesibilidad en formularios.
Requisitos previos: Finalización de los submódulos anteriores y comprensión básica de HTML, CSS y formularios. Materiales: Editor de texto y navegador web utilizados a lo largo del curso. Enlaces: Guía para la planificación y desarrollo del proyecto final. Herramientas y recursos adicionales para el desarrollo web.
 
 
 
13.0
Evaluación Final - Demostración de los Conocimientos Adquiridos y Cierre del Curso
La Evaluación Final: Demostración de los Conocimientos Adquiridos es el último módulo del curso en el cual los estudiantes tendrán la oportunidad de aplicar todos los conocimientos y habilidades adquiridos a lo largo del programa en un proyecto integral y completo. Durante esta fase, los estudiantes desarrollarán un sitio web desde cero utilizando todas las tecnologías y técnicas aprendidas, demostrando su comprensión y competencia en el campo del desarrollo web.
Requisitos previos: Finalización de los submódulos anteriores y comprensión básica de HTML, CSS y formularios. Materiales: Editor de texto y navegador web utilizados a lo largo del curso. Enlaces: Guía para la planificación y desarrollo del proyecto final. Herramientas y recursos adicionales para el desarrollo web.
 

Actividades :

Conferencia

Práctica Guiada

Taller

Experiencia en Campo

Instruccional

Salida Académica

Evaluación

Sustentación

Práctica Laboral

Trabajo en grupo