UNIVERSIDAD TECNOLÓGICA ECOTEC FACULTAD DE SISTEMAS COMPUTACIONALES SYLLABUS. Desarrollo de Aplicaciones para Internet CODIGO COM 251 CREDITOS 4

Transcripción

1 MATERIA UNIVERSIDAD TECNOLÓGICA ECOTEC FACULTAD DE SISTEMAS COMPUTACIONALES SYLLABUS Desarrollo Aplicaciones para Internet CODIGO COM 251 CREDITOS 4 PRE-REQUISITOS No tiene PERIODO LECTIVO Trimestre Clases conferencias /Talleres HORAS PRESENCIALES 6 1. DESCRIPCIÓN Esta materia prepara al estudiante para sarrollar aplicaciones web comprendiendo las diferentes herramientas existentes actualmente, siguiendo los estándares y tenncias más mornas l diseño y programación web; tomando como base las herramientas Open Source como solución en un mundo en constante cambio y evolución tecnológica. 2. METODOLOGIA Las metodologías que se aplicarán tendrán algunos aspectos comunes, los cuales se rivan l molo constructivista social, en el cual se basa el Molo Educativo la Universidad Ecotec. Por esta razón se privilegian los métodos participativos y trabajo en grupo para la solución problemas l entorno empresarial cada estudiante, favoreciendo manera sistemática la interacción con la comunidad, siguiendo los principios l aprendizaje cooperativo (colaborativo), con el fin sarrollar la competencia trabajo en equipo. En este enfoque metodológico el docente actúa como un facilitador, que explora los conocimientos previos que tienen sobre el tema y guía la construcción los conocimientos manera individual y en grupos, vinculando manera sistemática la teoría con la práctica. Se refuerza la relación la teoría con la práctica y las habilidas sarrollar proyectos en relación a los contenidos específicos cada materia. Descripción los tipos trabajos requeridos Al inicio l curso se enviará un trabajo investigación el cual berá ser sarrollado en grupos trabajo (máximo 2 estudiantes). Los temas serán aprobados previamente, para lo cual se tratará que los mismos sean actualizados y con proyecciones al futuro. Se enviaran trabajos investigación, los que ben ser entregados acuerdo a las normas señaladas en el Aula Virtual. La redacción los documentos, en cuanto a formato, letra, citas y la bibliografía, se realizará según las NORMAS APA. Participación en clase Amás la presentación física l trabajo final, por escrito y en formato digital, berán realizar exposiciones los avances parciales l trabajo. Adicional al trabajo investigación en todos los capítulos se enviarán casos prácticos para ser sarrollados en casa y revisados en clase. PÁG. 1/9

2 3. OBJETIVOS 3.1. Generales Enseñar al estudiante la manera como ben Diseñar sitios Web profesionales cumpliendo con esquemas colores, letras y usabilidad. Dar a conocer los estándares l diseño web más mornos para estar en concordancia con los nuevos entornos y plataformas. Dar a conocer las herramientas disponibles para el sarrollo aplicaciones web siguiendo siempre el paradigma aprenr a aprenr en un entorno en constante cambio Específicos Conocer y aplicar los nuevos conceptos l diseño web. Valorar las diferentes herramientas sarrollo existentes tanto Open Source como pago. Aprenr a usar las herramientas existentes para optimizar tiempo en el sarrollo aplicaciones. Enseñar a herramientas diseño Web orientado a la usabilidad y aplicación práctica basados en sistemas Open Source. Desarrollar habilidas prácticas mediante el sarrollo casos l entorno laboral. No. Sesión 4. CONTENIDO PROGRAMATICO Sesión Competencias Temas Tratados Horas No Presenciales - Presentación la Analiza las últimas asignatura. tenncias sarrollo - Entrega y explicación para Aplicaciones web. Syllabus.- Explicación Compara herramientas en objetivos y política l función las curso. necesidas sarrollo. - Las últimas tenncias l sarrollo web. Lenguajes, entornos y herramientas más usadas. Qué es la Web 2.0? Historia Internet Aplica los principales conceptos l diseño web morno. Compara elementos l diseño. Planifica el diseño un sitio web. Diseña la estructura y organiza el contenido l sitio. Conceptos generales: Qué es la arquitectura la información. Disciplinas don se pue aplicar. Concepto usabilidad La importancia la ADI en diseño Web. Planificación estratégica los sitios Web Estudio la audiencia. Esquemas organización l sitio. Estructuras organización l contenido. Investigar: Tenncias l diceño: Qué es Responsive Design. Crear listado características HTML5 y CSS3. En equipo. Evaluación Preguntas respuestas relacionadas con el tema. y PÁG. 2/9

3 PÁG. 3/9 Conoce las últimas tenncias l diseño web. Compara las nuevas características los lenguajes html5 y CSS3 con versiones anteriores. Conoce nuevas herramientas para el diseño web. Últimas tenncias l sarrollo web. Qué es Responsive sign. Lo nuevo en HTML5 y CSS3. Herramientas utilidad para el diseño. Herramientas Compara las diferentes herramientas para sarrollar aplicaciones web existentes actualmente. Compara los diferentes tipos sitios webs y las herramientas para su sarrollo. Utiliza una herramienta para el sarrollo aplicaciones web. Compren el entorno Dreamweaver y las ventajas un buen editor código. Compara navegadores y compren la necesidad un diseño adaptable a todos los tipos navegadores. Aplica técnicas para un buen diseño web. Planifica estrategias para un diseño amigable. Crea hojas estilo externas y su referencia en la página web. Da estilo a los diferentes objetos la página con CSS. Aplica los estilos a páginas forma práctica. Utiliza herramientas terceros para optimizar el trabajo y el tiempo usadas para el sarrollo web. Open Source: Lenguajes, Frameworks y Sistemas Gestión Contenidos. Tipos Sitios webs. - Blogs. - E-learning. - E-commerce. - Red Social. - Sitio Empresarial. Usar Dreamweaver como editor código. Panel herramientas Vista Diseño Ventanas documento Administrar sitios Configuraciones Navegadores. Prueba Acida. Estructura y Arquitectura Web: Estrategia Contenidos y Diseño. -Teoría l color. - Animaciones. - Imágenes. - Menú. - Texto. - Formularios. Estilos en páginas web. Dando estilos con CSS. Concepto CSS, clases, reglas, concepto Divs, posición Absoluta, Relativa, conceptos Float y Margin, ejercicio sencillo cajas. Realizar página sencilla con Encabezado, Cuerpo y Pie, relación con fichero CSS externo. Lo nuevo CSS3. Herramientas y recursos útiles para el diseño la Investigar sobre los Frameworks más usados para sarrollo web. Exponer por equipo características, requerimientos, así como ventajas y sventajas. más Estudio material apoyo. Investigar sobre las características un buen diseño web. Crear una página usando elementos básicos html y dar formato con CSS. Trabajo grupal y análisis los resultados cada grupo en plenaria y por escrito Trabajo grupal y análisis los resultados cada grupo en plenaria y por escrito Taller práctico: Instalar Dreamweaver. Trabajar en el entorno Dreamweaver para conocer sus herramientas y opciones. Trabajo grupal y análisis los resultados cada grupo en plenaria y por escrito Los alumnos ben traer la base datos exportada en formato texto (SQL). Taller Práctico Hacer búsqueda creación bibliográfica en página usando internet CSS para el recursos para diseño. crear elementos Usa recursos como botones, la web.

4 Clase práctica 1: presenciales preparación CP Act. la Guía CP Elaboración informe CP sarrollo. Crea un sitio web elemental usando hojas estilo para dar formato al contenido. Utiliza frameworks Jscript para potenciar el sitio web. Crea animaciones y galerías imágenes con Jquery. Utiliza recursos la web para optimizar tiempo. Compren la importancia una buena estructura navegación. Crea el mapa l sitio web y la estructura navegación. web. Imágenes y diseño con CSS3. Recursos la web. Descargue l Atrium el Proceda con la instalación (copiar) en su PC. Dadas las situaciones que se le orientan en el material be crear un sitio web elemental usando elementos html5 y css3. Frameworks: Javascript y Jquery. - Crear animaciones: Slis, galerías imágenes. - Recursos en la Web. - Mapa l Sitio y Estrategia Navegación. Creación Menú principal. - Menú Jquery. - Menú CSS. menús y Boxes en CSS3. Crear una galería imágenes con Jquery, be tener menú navegación y scripción cada imagen. Crear un menú con Jquery y CSS asociado a un grupo páginas webs. n la participación Calidad las la CP. Creación animaciones y galerías con Jquery. Creación Menú con Jquery y CSS. 13 Clase práctica 2: presenciales preparación CP Act. la Guía CP Elaboración informe CP 14 (Clase) Crea menú navegación con Jquery y CSS. Inserta una galería imágenes animada y un menú navegación. Descargue l Atrium el Proceda con la instalación (copiar) en su PC. Continuando con el sitio web la clase práctica anterior: Insertar en la página principal un Sli imágenes usando Jquery. Insertar un menú navegación usando Jquery y CSS. Examen Parcial I n la participación Calidad las la CP. Evaluación en primer examen competencias señaladas en Sesiones 2, 3, 4, 5, 6, 7, 8, 9, 11. PÁG. 4/9

5 Clase práctica 3: presenciales preparación CP Act. la Guía CP Elaboración informe CP 19 Inserta Plugins terceros a la página web. Inserta audio y vio mediante HTML5. Crea formularios HTML. Compara las nuevas características HTML5 con la versión anterior para la creación formularios Envía información a través formularios. Compren la necesidad l posicionamiento en buscadores. Inserta palabras claves mediante etiquetas META. Crea páginas con efecto en buscadores. Inserta audio y vío en la página web. Crea formularios HTML. Insertar palabras claves y scripción usando etiquetas META. Compren qué es una aplicación cliente y qué es una aplicación servidor. Conoce los lenguajes que se usan l lado l cliente y los lenguajes l lado l servidor. Widgets: Tipos y Funciones. Plugins. Qué son los Plugins. Incrustar código terceros. Insertar audio y vio. Crear formularios personalizados. Crear Formularios en HTML. formulario contacto Tipos campos en HTML: Propiedas. Lo nuevo en formularios HTML5. Enviar información con formularios. Validar formularios. Qué es el Posicionamiento en Buscadores? Técnicas posicionamiento. Alta en buscadores. Etiquetas Meta. Crear Página en Google Plus: efecto en los buscadores. Crear página en Facebook. Descargue l Atrium el Continuando con el sitio web la clase práctica anterior: Crear una nueva página e insertar un vío y un archivo audio. Insertar un formulario registro. Establecer las palabras claves l documento.. Clase Teórico- Práctica: Crear páginas con efecto en buscadores. Crear una página fans Facebook e incrustarla en la página web. Aplicaciones Cliente Servidor Aplicación Cliente. Aplicación Servidor. Lenguajes l lado l cliente. Lenguajes l lado l servidor. Aplicaciones Cliente- Servidor: PHP. Inserte un vio Youtube.com a una página web. un que envíe los datos a una dirección correo. Cree una página Fans Facebook y vincúlela a una página web html. Insertar audio y vio con HTML5. Insertar código terceros. Crear formularios para diferentes situaciones reales. n la participación Calidad las la CP. Trabajo grupal y análisis los resultados cada grupo en plenaria y por escrito 20 PÁG. 5/9 Compren el entorno sarrollo aplicaciones web Cliente-Servidor. Instala un servidor web. Herramientas necesarias para crear una aplicación con bases datos. Instalación wamp server y ampps. Comparación entre ambos servidores. Instalar un servidor web basado en PHP, MySQL y Apache (Ampps, Wamp). Taller práctico. Instalar un servidor web basado en PHP y MySQL, configura PHP.

6 21 22 Analiza las características y requerimientos una aplicación web con bases datos. Compara servidores webs. Crea una aplicación web tipo Blog. Utiliza herramientas disponibles (CMS) para la creación l Blog. Compren la importancia la interactividad con el usuario. Gestiona el intercambio con el usuario. Servidores web con soporte para Mysql y PHP. Hosting para PHP y Mysql. Aplicaciones que se puen sarrollar con PHP y Mysql. Crear un Blog. Herramientas para Crear Blogs. Instalar Wordpress. Requerimientos. Uso Plantillas. Uso Extensiones y Plugins. Valorar Contenidos en Blogs - Suscripciones: conseguir seguidores. - Gestión e importancia los comentarios. - Gestión Artículos. Instalar un Framework y un CMS. Investigue sobre los CMS más usados y haga una tabla comparativa características tales como requerimientos, tipo sitio que se pue crear, Licencia, cantidad plugins popularidad. y Crear un blog personal usando un CMS y sus plugins. Agregar interactividad al blog con comentarios y suscripciones Clase práctica 4: presenciales preparación CP Act. la Guía CP Elaboración informe CP Compren las nuevas tenncias la web y la necesidad estar presente. Otorga interactividad a su sitio con plugins res sociales. Instala un servidor web. Crea un blog a través WordPress. Compartir en Res Sociales. - Botón Compartir en Facebook, Linkedin y Twitter. - Botón Me gusta y páginas Fans Facebook. - Conectar Blog a Linkedin. - Crear Encuestas para saber más tus usuarios. Descargue l Atrium el Instalar Ampps server. Crear un blog usando Wordpress. Configurar el blog. Crear interactividad con comentarios en los artículos. Crear un formulario Encuesta satisfacción l cliente y enviar los resultados a una dirección electrónica. Insertar plugins res sociales a la página web. n la participación Calidad las la CP. PÁG. 6/9

7 25 (Clase) Examen Parcial II Evaluación en segundo examen competencias señaladas en Sesiónes 15, 16, 17, 21 y Clase práctica 5: presenciales preparación CP Act. la Guía CP Elaboración informe CP Clase práctica 6: presenciales preparación CP Act. la Guía CP Elaboración informe CP Compren la necesidad estar en constante renovación tecnológica. Conoce las nuevas tenncias l diseño. Usa plantillas responsive para adaptar la web a diferentes pantallas. Instala aplicaciones necesarias para crear web móvil. Conoce las características Instalar los nuevos paradigmas diseño para móvil. Crea una web elemental para smartphones. Crea varias páginas con menú siguiendo el nuevo paradigma diseño para móvil. Crea elementos menú en la página web. Crea la aplicación móvil y la instala en un Smartphone para poner a prueba. Qué es la Web 3.0? Los nuevos paradigmas l diseño web. Elementos necesarios para diseño web responsive. Plantillas responsive sign. Creación web para móviles. Frameworks y herramientas necesarias para crear una web móvil. Descargue l Atrium el aplicaciones necesarias para crear una web para móvil. Crear una página elemental con formato móvil. Crear varias páginas en la web para móviles. Trabajo con menú y botones. Descargue l Atrium el Usando la página que se ha creado en la clase anterior: Crear un menú navegación. Crear enlaces a páginas externas. Crear efectos transición entre páginas. Generar la aplicación e instalarla en el smartphone. Crear un sitio en Dreamweaver con dos páginas internas y una externa. Crear un menú navegación. Clase Teórico- Práctica: Nuevas tenncias l diseño para móviles. Usar herramientas para el diseño web móvil. n la participación Calidad las la CP. Investigar sobre los frameworks Crear una más usados para aplicación para la creación móvil e webs para instalarla en un dispositivos Smartphone. móviles. n la participación Calidad las la CP. PÁG. 7/9

8 30 (Clase) Examen Final Evaluación en último examen competencias señaladas en Sesiónes 26 y EVALUACIÓN Criterio para la calificación los trabajos La presentación beres y trabajos será obligatorio, en caso incumplimiento se impondrán sanciones en la nota actividas. Excepto los ejercicios planteados en clases, como tareas extracurriculares, los más trabajos investigación se entregará por medio correo electrónico. Sanción por atraso en la entrega trabajos Los beres ben ser presentados en la clase requerida, no se aceptarán beres a stiempo. Los beres y los Talleres no sarrollados en la fecha oportuna, serán sancionados con el total la calificación. Actividas (Talleres/Ejercicios en clases, Investigaciones y tareas Calificación Primera Lección 15 Segunda Lección 15 Examen Final 40 NOTA FINAL La nota mínima para aprobar el curso es 70. Los exámenes se rendirán en la fecha previamente establecida por el Decanato la Facultad, y no se aceptará a ningún estudiante postergación ni anticipación dicha evaluación, sin una justificación fuerza mayor previamente aprobada por la Comisión Académica la Facultad. En éste caso únicamente se aprobará la toma l examen supletorio. PÁG. 8/9

9 6. BIBLIOGRAFIA BASICA TEXTO AUTOR EDITORIAL HTML5 Y CSS3. Revolucione el diseño sus Sitios Webs. Christopher Aubry ENI EDICIONES Web 2.0 Octavio Isaac Rojas Ed. Orduña Usabilidad: Diseño sitios Web Jakob Nielsen Prentice Hall 7. MATERIAL COMPLEMENTARIO TEXTO AUTOR EDITORIAL Guía HTML5 Christian Van Der Henst APRENDER DREAMWEAVER CS6 CON MEDIA active MARCOMBO S.A. 100 EJERCICIOS PRÁCTICOS 8. DATOS DEL PROFESOR NOMBRES APELLIDOS PROFESIÓN UNIVERSITARIA Alexis Cabrera Monja Máster en Nuevas tecnologías para la Educación 14 años EXPERIENCIA EN EL ÁREA TELÉFONO CELULAR acabrera@universidacotec.edu.ec Elaborado por: Ing. Alexis Cabrera Monja Profesor Revisado por: Ing. Tanya Recal Decana PÁG. 9/9