DIRECCIN ACADMICA CARRERAS PROFESIONALES I. DATOS ADMINISTRATIVOS CURSO OFIMATICA CDIGO 1357 CICLO Primero SEMESTRE 2012-2 CRDITOS 3 CARRERA Computacin e Informtica, Administracin y Sistemas, Redes y Electrnica REQUISITOS Ninguno
II. INTRODUCCIN
Ofimtica es un curso que pertenece a la lnea tcnica y se dicta en las carreras Computacin e Informtica, Administracin y Sistemas, Redes y Electrnica. Brinda a los alumnos un conjunto de herramientas de software como editores de textos para HTML5, CSS y J avaScript, para el diseo de sitios web con aplicaciones multimedia y validacin de formularios.
El curso es eminentemente prctico y consiste en el diseo de pginas web y programacin con J avaScript para validar formularios. En primer lugar, se inicia con un software libre para edicin de imagenes que brinda al alumno una variedad de herramientas para la integracin de diferentes elementos de una pgina web. As mismo, para el diseo se incluye los lenguajes HTML5 y CSS. Se concluye con el lenguaje de programacin J avaScript que permite insertar estructuras de programacin para hacer consistente el ingreso de datos a un formulario.
III. LOGRO DEL CURSO
Al trmino del curso, el alumno disea un Sitio Web que incluye interfaces diseadas con etiquetas HTML, estilos CCS y validacin de formularios usando las herramientas para editar textos HTML, el lenguaje de estilos CSS y el lenguaje de programacin J avaScript.
IV. METODOLOGA
El curso aplica la metodologa de prcticas de laboratorios dirigidas por el profesor y la participacin activa de los alumnos. Al final de cada sesin se obtiene un producto final terminado. Inmediatamente despus de cada prctica de laboratorio dirigida, el alumno debe transferir lo aprendido mediante ejercicios propuestos individuales y grupales, y el desarrollo de tareas que se encuentran en el material de estudios desarrollado para el curso.
V. EVALUACIN
La frmula que se ingresa en el sistema es la siguiente:
UNIDAD 1. Fundamentos de un proyecto web y Elementos grficos Duracin: 5 horas Logro de la Unidad de Aprendizaje Al trmino de la unidad, el alumno reconoce los elementos necesarios para la creacin de un sitio web y disea los elementos grficos necesarios para un proyecto web.
Temario 1.1. Tema 1: Fundamentos de un proyecto web 1.1.1 Generalidades 1.1.1.1 Internet 1.1.1.2 Servidores web 1.1.1.3 Hosting y dominios 1.1.1.4 Navegadores 1.1.2 Etapas de un proyecto web 1.1.2.1 Mapa de sitio 1.1.2.2 Wireframes. 1.2. Tema 2: Elementos grficos para la web 1.2.1 Tipos de imagen, resolucin, modos de color. 1.2.2 Edicin de imgenes: Tamao, recorte, seleccin, etc. 1.2.3 Creacin de banners, mens y botones.
3
UNIDAD 2. HTML5 y CSS 3 Duracin: 22.5 horas Logro de la Unidad de Aprendizaje Al trmino de la unidad, el alumno disea y construye un sitio web aplicando etiquetas HTML5, estilos CSS3, elementos multimedia y formularios.
Temario
2.1 Tema 3: Estructura HTML y aplicacin de estilos CSS
2.1.1 Entorno del programa (Editor HTML) 2.1.2 Creacin de un sitio web (estructura de carpetas) 2.1.3 Estructura de un documento HTML 2.1.3.1 Etiquetas bsicas: body, encabezados (H1..H6), prrafos, listas, enlaces internos y externos, imagen. 2.1.4 Tipos de Estilos: En lnea, internos y vinculados. 2.1.5 Estilos aplicados a etiquetas y de clase. 2.1.6 Estilos a vnculos: Creacin de men. 2.2 Entregable 1 del Proyecto web y Evaluacin en lnea (semana 4)
2.3 Tema 4: Creacin de bloques de contenido Parte 1
2.3.1 Uso de etiquetas div (capa contenedora, texto, imgenes, etc.) 2.3.2 Etiquetas HTML5: header, nav, section, article, aside, footer 2.3.3 Estilos bsicos para los bloques: width, height, background, border 2.3.4 Ejercicio integrador 2.4 Tema 5: Creacin de bloques de contenido Parte 2
2.4.1 Uso de etiquetas div (capa contenedora, texto, imgenes, etc.) 2.4.2 Etiquetas HTML5: header, nav, section, article, aside, footer 2.4.3 Estilos para bloques: padding, margin, background-image, border-radius, float, clear 2.4.4 Ejercicio integrador 2.5 Entregable 2 del Proyecto web y Sustentacin (semana 8)
2.6 Tema 6: Elementos multimedia (Audio, Video y efecto Ligthbox)
2.6.1 Etiquetas HTML5: AUDIO y VIDEO 2.6.2 Codificar audio y video para la web Autoplay, loop, preload, controles (audio) Controles, width/height, poster (video) 4
Filetypes (source) Mltiples formatos de audio y video para todos los diversos navegadores. 2.6.3 Convertidor de audio y video online mp3, ogg, mp4, webm, ogv. 2.6.4 Uso de la herramienta lightbox para la gestin de imgenes.
2.7 Tema 7: Efectos CSS (transformacin, transicin y animacin)
2.7.1 Transformaciones Posicin, rotaciones, escala y distorsin. 2.7.2 Transiciones Transicin simple, varios elementos simultneos. 2.7.3 Animaciones Animacin simple, mltiples fotogramas clave, animaciones de posicin. 2.7.4 Ejercicio Integrador
2.8 Tema 8: Formularios
2.8.1 Uso de tablas para organizar los elementos de formulario Etiquetas: Table, TR, TD, colspan. 2.8.2 Elementos clsicos de formulario Form, input, button, textarea. 2.8.3 Nuevos atributos para la etiqueta INPUT Number, range, url, email, date. 2.8.4 Campos de texto obligatorio: required 2.9 Entregable 3 del Proyecto web y Evaluacin en lnea (semana 12)
5
UNIDAD 3. JavaScript Duracin: 7.5 horas. Logro de la Unidad de Aprendizaje Al trmino de la unidad, el alumno, con el lenguaje J avaScript, disea programas, incorporados en una pgina del Sitio Web, para validar formularios
Temario
3.1 Tema 9: Introduccin y elementos bsicos del lenguaje JavaScript
3.1.1 Fundamentos de J avaScript 3.1.2 J avaScript y HTML 3.1.3 Elementos de un programa 3.1.4 Entradas y salidas 3.1.5 Estructura de control (IF) 3.1.6 Estructura repetitiva (For) 3.2 Tema 10: Validacin de formularios
3.2.1 Creacin de funciones en J avaScript 3.2.2 Funcin para validar un formulario en J avaScript 3.3 Entregable 4 del Proyecto web y Sustentacin (semana 15)
6
VII. BIBLIOGRAFA DEL CURSO
Programacin HTML5 Matthew David Anaya Multimedia
CSS hojas de estilo para el diseo web Christopher Schmitt / Mark Trammell Anaya Multimedia
Tcnicas innovadoras en Diseo WEB Penny McIntire Anaya Multimedia