Bienvenidos al curso: HTML & CSS Profa. Jeannette Milland Vigio Escuela Secundaria de la Universidad de Puerto Rico
Profa. Jeannette Milland Vigio Escuela Secundaria UPR- RP Área de Tecnología
Cursos ● HTML & CSS ● Mobile CSP ● Robótica y Automatización ● Fotografía Creativa Mentora de ● Equipos Robótica VEX ● Physical Computing Raspberry Pi y Arduino ● Club de Computadoras
Objetivos Generales Este curso introduce al estudiante a la programación de la World Wide Web, mediante la utilización de los lenguajes HTML y CSS. Al finalizar el curso, el estudiante será capaz de: 1. Definir qué es la World Wide Web, e indicar su origen y su alcance. 2.
Identificar qué lenguajes de programación se utilizan para la creación de páginas web.
3.
Considerar y explorar distintos editores de texto para codificar páginas en la web.
4.
Crear y dar estructura a documentos en lenguaje HTML, mediante el uso de etiquetas
5.
Estilizar y dar formato a páginas web utilizando CSS para mejorar la apariencia del documento.
6.
Publicar en la Web, los documentos desarrollados durante el curso por medio de herramientas propias para la transferencia de archivos
7.
Investigar y examinar la gran variedad de cursos y tutoriales disponible en la web.
Comunicaciรณn html-css
jeannette.milland@upr.edu
(787) 602-1099
BBB
Foros • Foro para presentarse • Foro de Dudas
Vas a necesitar el siguiente equipo Computadora
Acceso a Internet Buen de ancho de banda
Editor de Texto
Cรกmara y micrรณfono
11/22/16
Distribución de Tiempo: Módulo 1 Módulo
1
Objetivos Al finalizar
Descripción
La World Wide Web (WWW), su origen y su alcance
Actividades
●
#1 Definir qué es la World Wide Web, e indicar su origen y su alcance.
●
#2 Identificar qué lenguajes de programación se utilizan para la creación de páginas web.
1. 2.
#3 Considerar y explorar distintos editores de texto para codificar páginas en la web.
4. 5.
●
3.
Foro para presentarse Presentación Origen y Evolución de la WWW Video - Creando los espacios de trabajo Video tutorial - Editores Foro para dudas opcional
Evaluación Asignación ● Luego de ver el video tutorial sobre Editores, instalar el editor de preferencia en su computadora Evaluación ● Presentarse en el foro ● Quiz sobre origen y evolución de la World Wide Web
Distribución de Tiempo: Módulo 2 Módulo
Objetivos Al finalizar
Descripción
●
2
Estructura de una página Web y etiquetas
#4 Crear y dar estructura a documentos en lenguaje HTML, mediante el uso de etiquetas
Actividades
1. 2. 3.
●
#7 Investigar y examinar a gran variedad de cursos y tutoriales disponible en la web.
4.
5.
Video - Explorando las tendencias en modelos de página web Video - Vista preliminar del proyecto Barra de Navegación Visita a W3Schools para explorar diversas etiquetas <h1>,<ul>, <img> Video tutorial - HTML - Visita a W3Schools Etiqueta Listas de Bullets Proyecto #1
Evaluación Asignación ● Comenzar a trabajar Certificado Solo Learn HTML para entregar en la Semana 4 Evaluación ● Proyecto #1 y Subir documento index.html en Moodle
Distribución de Tiempo: Módulo 3 Módulo
Objetivos Al finalizar
Descripción
● Submenús
3
Barra de Navegación estilizada con CSS
●
#4 Crear y dar estructura a documentos en lenguaje HTML, mediante el uso de etiquetas #5 Estilizar y dar formato a páginas web utilizando CSS para mejorar la apariencia del documento.
Actividades
1. 2.
3.
4.
Video tutorial - Creando espacios de trabajo Visita a W3Schools para explorar diversas etiquetas <h1>,<ul>, <img> Video tutorial - HTML - Visita a W3Schools Etiqueta Listas de Bullets Proyecto #2
Evaluación
Asignación ● Continuar trabajando Certificado Solo Learn HTML Evaluación ● Proyecto #1 y Subir documento index.html en Moodle
Distribución de Tiempo: Módulo 4 Módulo
Objetivos Al finalizar
Descripción
Actividades
1.
4
CSS, Hover y otros Efectos
●
#5 Estilizar y dar formato a páginas web utilizando CSS para mejorar la apariencia del documento.
2.
Video tutorial - How to Create Transparent Drop Down Navigation Menu with CSS and HTML Trabajar esta semana para completar proyecto según el video tutorial observado. La semana próxima se suben los documentos index.html y style.css
Evaluación
Asignación ● Esta semana no hay entrega de index.html (Próxima semana se entregan index.html y style.css) Evaluación ● Entrega de Certificado Solo Learn HTML
Distribución de Tiempo: Módulo 5 Módulo
Objetivos Al finalizar
Descripción
●
5
Publicar nuestro proyecto en la Web
Publicar en la Web, los documentos desarrollados durante el curso por medio de herramientas propias para la transferencia de archivos
Actividades
1. 2. 3. 4. 5.
Ver - Video tutorial Editores en la Nube Conectar Editey en Google Drive Abrir proyecto trabajado en editey Hacer vista preliminar Publicar en la Web
Evaluación
Evaluación ● Entrega de index.html y style.css ● enviar enlace de publicación de Google Drive
Web Links • • • • •
Brackets 1.2 (2018). Created for Adobe by MIT. http://brackets.io/ Flexbox (2016). WebiBeris.com. https://www.htmllion.com/css-flexbox.html HTML Tutorials(2018). W3Schools. https://www.w3schools.com/ Solo Learn Playground (2018). Solo Learn. https://code.sololearn.com/#html Sublime Text 3 (2018). https://www.sublimetext.com/
11/22/16
Gracias
ÂżPreguntas? Visite el foro de dudas Muchasengracias cualquier momento