Programación

web
Guía del estudiante
Guía del estudiante Programación web

Introducción

La necesidad de explorar alternativas de distancia frente a la publicación, tratamiento,

comunicación y manejo de información a través del uso de las redes y las TIC, hace nece-
sario que el estudiante esté a la vanguardia de las necesidades del mercado tecnológico y
específicas de diferentes tipos de cliente. Por lo cual es muy importante que adquiera las
destrezas y habilidades que le permitan gestionar con calidad servicios que se necesitan
para competir a nivel mundial.

Una página web es un documen-

to ubicado en un espacio de la
www (World Wide Web), donde
se puede acceder a través de en-
laces e hipertexto a información
de diferentes tipos como texto,
sonido, imágenes y video.

Durante el desarrollo de esta asignatura el estudiante llevará a cabo las actividades y pro-
cesos que le permitan diseñar, desarrollar e implementar páginas e interfaces gráficas que
estructuren un sitio web, dinámico e interactivo, que responda a las diferentes necesidades
y requerimientos del cliente a través de la optimización, usabilidad y visualización en dife-
rentes dispositivos tecnológicos; se implementarán diferentes herramientas de trabajo en
diseño y creación de páginas web fundamentales como el lenguaje HTML y la herramienta
CSS3, llevando a cabo la publicación en un Hosting Local o Virtual de fácil uso y acceso.

1
Guía del estudiante Programación web

Competencias

Fuente:
Freepick

El estudiante construye sitios web empleando las mejores prácticas de desarrollo y di-
seño web, utilizando lenguaje HTML y CSS para cumplir con los requerimientos de las
organizaciones.

• Construye páginas web utilizando lenguaje HTML.

• Aplica estilos de diseño a una página web utilizando lenguaje CSS3.

• Aloja un sitio web diseñado en HTML5 y CSS3, en un hosting local o gratuito, a

partir de los elementos de maquetación y requerimientos de la organización.

2
Guía del estudiante Programación web

Temáticas a abordar

Núcleo 1

• Introducción al entorno HTML

1. Conceptos generales
2. Versiones HTML
3. Estructura de una etiqueta
4. Estructura de una página web
5. Etiquetas básicas
6. Etiquetas de texto
7. Etiquetas de párrafo
7.1 Caracteres especiales
8. Tablas
9. Listas
9.1 Desordenadas
9.2 Ordenadas
9.3 Definición
10. Imágenes
11. Audio
12. Video
13. Enrutamiento de contenido 3
Guía del estudiante Programación web

Núcleo 2

• Enlaces y Maquetado

1. Enlaces
2. Maquetación
2.1 Header
2.2 Nav
2.3 Section
2.4 Article
2.5 Aside
2.6 Footer
2.7 Div

4
Guía del estudiante Programación web

Núcleo 3

• Hojas de estilos

1. Diseño de un Sitio Web

2. Conceptos generales: CSS
3. Versiones CSS
4. Sintaxis
5. Hoja de estilos
5.1 Clase
5.2 Selector
5.3 ID
6. Estilos para fondos
7. Estilos para texto
8. Estilos para párrafos

5
Guía del estudiante Programación web

Núcleo 4

• Estilos avanzados y formularios

1. Estilos para tablas

2. Estilos para listas
3. Estilos para marcos
4. Estilos aplicables a la maquetación
5. Estilo para menús desplegables y navegabilidad
6. Formularios
6.1 Elementos de formulario
7. Alojamiento de sitios web (local y hosting)

6
Guía del estudiante Programación web

Agenda de aprendizaje para el curso

Núcleo de Objetivo de Fecha de

Actividad Peso Criterios de evaluación
aprendizaje la actividad presentación

Sesión video conferencia 1

Actividad 1 Verificar lo aprendido y rea-

Núcleo 1 lizar un proceso evaluativo Identifica, reconoce y Semana 1
sobre los conceptos y proce- 15% aplica las etiquetas HTML
Cuestionario: sos prácticos implementados según el requerimiento.
Estructura HTML con el lenguaje HTML.

Sesión video conferencia 2

Verificar lo aprendido y rea-

Actividad 2 lizar un proceso evaluativo
Núcleo 2 sobre los conceptos y proce-
Identifica y aplica etiquetas Semana 2
15% de maquetado, estilo y dis-
Cuestionario sos prácticos implementados
tribución adecuadamente.
interactivo en el maquetado, etiquetas
y estilos.

7
Guía del estudiante Programación web

Actividad de repaso 2

Aplicar las diferentes etique-

tas HTML y maquetación de El diseño cumple con esti-
Actividad 3 páginas a un diseño preesta- los de maquetado y distri-
Núcleo 3 blecido. bución adecuadamente, los Semana 3
30% enlaces y direccionamien-
Tarea: Diseño Diseñar y distribuir adecua- tos permiten la exploración
y maquetado damente páginas con estilos adecuada de la página.
maquetados de acuerdo a
un requerimiento.

Encuentro sincrónico 4

Actividad 3
Núcleo 4 Reconocer el desempeño Semana 4
Heteroevaluación,
personal en el curso y en el 10%
Diagnostico final y proceso de aprendizaje.
autoevaluación, opinión
autoevaluación sobre el aula virtual.

8
Guía del estudiante
Aplicar procedimientos de
diseño y creación de páginas
web dinámicas, con aspectos
agradables y visuales para
el usuario, que faciliten la
Caso de consulta y exploración de
Curso
estudio integrador contenidos presentados en
línea, a partir de las compe-
tencias de aprendizaje ad-
quiridos mediante el manejo
de estructura del lenguaje
HTML y CCS.
Total:
Programación web
El sitio web se aloja en un
servidor virtual gratuito en
la web, es dinámico e inte-
ractivo de fácil navegación
y agradable a la vista del
usuario.
30% Semana 4
El diseño e información del
contenido está bien organi-
zado y distribuido, cumple
con los requerimientos esta-
blecidos por el cliente.
100%
9
Guía del estudiante Programación web

Referencias

Ainoa Celaya Luna 2014-01-01 Creación de páginas web: HTML 5 Editorial ICB
paginas 3 -15

El gran libro de programación HTML5 CSS3 Tomado de https://gutl.jovenclub.cu/

wp-content/uploads/2013/10/El+gran+libro+de+HTML5+CSS3+y+Javascrip.pdf

José María Tomás Zafra Elaboración de hojas de estilo (UF1303) IC Editorial Paginas 5-30

Que es el HTML tomado de https://codigofacilito.com/articulos/que-es-html

Sandra Cabello Jurado Elaboración de plantillas y formularios (UF1304) IC Editorial

paginas 5-50

10
Guía del estudiante Programación web

Material de apoyo y complementario

Aprende a crear tu propio sitio Web con HTML5 y CSS3 Matheu Nebra 16 Enero
2018 tomado de https://openclassrooms.com/en/courses/3339201-aprende-a-crear-tu-
propio-sitio-web-con-html5-y-css3

El gran libro de programación HTML5 CSS3 Tomado de https://gutl.jovenclub.cu/

wp-content/uploads/2013/10/El+gran+libro+de+HTML5+CSS3+y+Javascrip.pdf

Como crear una página web en html5 y darle estilos con css3 Publicado el 16 oct.
2017 Jhon Herrera tomado de https://www.youtube.com/watch?v=_NOyJn64a-w

Página Web Profesional con HTML5 y CSS3. Estilos CSS3 Publicado el 30 dic. 2017
tomado de: https://www.youtube.com/watch?v=5-4FzEqV6N4

11
Politécnico Internacional
Institución de Educación Superior SNIES 4727 Resolución No. 4135 del 11 de nov. de 2004
Todos los derechos reservados ® 2019
Vigilado por el Ministerio de Educación Nacional.