anteproyecto trabajo de gradonoviembre 2013

55
ANTEPROYECTO DE TRABAJO DE GRADO DISEÑO DE UNA GUÍA PRÁCTICA PARA LA ENSEÑANZA DE HTML5 EN EL INSTITUTO SUPERIOR DE EDUCACIÓN RURAL, ISER DE PAMPLONA, NORTE DE SANTANDER JUDITH PATRICIA ANTELIZ SUAREZ WILMER ANDRES MANTILLA SUAREZ 1

Upload: wilmer-andres-mantilla-suarez

Post on 10-Nov-2015

10 views

Category:

Documents


3 download

DESCRIPTION

wilmer

TRANSCRIPT

ANTEPROYECTO DE TRABAJO DE GRADO

DISEO DE UNA GUA PRCTICA PARA LA ENSEANZA DE HTML5 EN EL INSTITUTO SUPERIOR DE EDUCACIN RURAL, ISER DE PAMPLONA, NORTE DE SANTANDER

JUDITH PATRICIA ANTELIZ SUAREZWILMER ANDRES MANTILLA SUAREZ

INSTITUTO SUPERIOR DE EDUCACION RURAL ISERUNIDAD DE INGENIERAS E INFORMTICATECNOLOGIA EN REDES Y SISTEMAS TELEINFORMATICOSPAMPLONA, NORTE DE SANTANDER16 DE DICIEMBRE 2013

DISEO DE UNA GUA PRCTICA PARA LA ENSEANZA DE HTML5 EN EL INSTITUTO SUPERIOR DE EDUCACIN RURAL, ISER DE PAMPLONA, NORTE DE SANTANDER

JUDITH PATRICIA ANTELIZ SUAREZWILMER ANDRES MANTILLA SUAREZ

Trabajo de Grado como requisito parcial para optar el ttulo de Tecnlogo en Redes y Sistemas Teleinformticos

DIRECTOR: Cmag, Ing. Jorge Sequeda Serrano.

Co-DIRECTOR: Cmag, Esp. Ing. Mauricio Zafra Aycardi.

INSTITUTO SUPERIOR DE EDUCACION RURAL ISERUNIDAD DE INGENIERAS E INFORMTICATECNOLOGIA EN REDES Y SISTEMAS TELEINFORMATICOSPAMPLONA, NORTE DE SANTANDER16 DE DICIEMBRE 2013

TITULO DEL TRABAJO DE GRADO

DISEO DE UNA GUA PRCTICA PARA LA ENSEANZA DE HTML5

EN EL INSTITUTO SUPERIOR DE EDUCACIN RURAL, ISER

DE PAMPLONA, NORTE DE SANTANDER

JUDITH PATRICIA ANTELIZ SUAREZ

WILMER ANDRES MANTILLA SUAREZ

APROBADO

________________________________________________________Cmag, Ing. Jorge Sequeda Serrano.Cmag, Esp. Ing. Mauricio Zafra Aycardi.Director Co-Director:

TITULO DEL TRABAJO DE GRADO

DISEO DE UNA GUA PRCTICA PARA LA ENSEANZA DE HTML5

EN EL INSTITUTO SUPERIOR DE EDUCACIN RURAL, ISER

DE PAMPLONA, NORTE DE SANTANDER

JUDITH PATRICIA ANTELIZ SUAREZ

WILMER ANDRES MANTILLA SUAREZ

APROBADO

________________________________________________________xxxxxxxxxxx Rubn Araque.Decano Acadmico Director de Carrera

TABLA DE CONTENIDO

Pg.

ABSTRACTINTRODUCCIN71. TTULO 82. PLANTEAMIENTO DEL PROBLEMA92.1. PLANTEAMIENTO DEL PROBLEMA92.2. FORMULACION DEL PROBLEMA93. JUSTIFICACIN104. OBJETIVOS114.1. OBJETIVO GENERAL114.2. OBJETIVOS ESPECIFICOS115. MARCO DE REFERENCIA125.1. ANTECEDENTES125.1.1. Plataformas e-learning programadas en html5125.1.1.1. Adr infor S.L (S.L., 2013).125.1.1.2. Los Educadores145.1.2. Plataforma que oferta cursos de HTML5165.1.2.1. Apps.co165.2. MARCO TERICO175.2.1. Plataformas E-Learning175.2.1.1. Contexto175.2.1.2. Caractersticas de los recursos digitales educativos 175.2.1.3 El modelo de Objeto Digital Educativo185.2.2. Generalidades Html5185.2.2.1. Definicin185.2.2.2. Caractersticas195.3. MARCO CONCEPTUAL205.4. MARCO CONTEXTUAL225.4.1. Espacial225.4.2. Temporal225.4.3. Terica225.5. MARCO LEGAL235.5.1 Acuerdo N 006 de 2007235.5.2 Acuerdo Consejo Acadmico (Junio 2013)246. MATERIALES Y MTODOS296.1. MATERIALES296.2. MTODOS296.2.1 Metodologa296.2.2 Poblacin de estudio y muestra317. RESULTADOS ESPERADOS328. CRONOGRAMA DE ACTIVIDADES-WBS339. PRESUPUESTO3410. REFERENCIAS BIBLIOGRFICAS 35

TABLA DE TABLAS

Tabla n1. Titulo parte superior de la tabla(variable respuesta, factor de diseo y nivel),

Fuente y lugar de la informacin.

Imgenes mismas hojas, mismo nmero, uno A y otro B.

VERIFICAR SI SON TABLAS O FIGURAS

TABLA DE ILUSTRACIONES

Pg.

FIGURA 1. LOGO PLATAFORMA EDUCAPLAY13FIGURA 2. VISTA PLATAFORMA HTML13FIGURA 3. VISTA IMPRESION CON HTML514FIGURA 4. LOGO PLATAFORMA LOS EDUCADORES15FIGURA 5. LOGO PLATAFORMA APPS.CO16FIGURA 6. PROCESO METODOLOGICO CURSOS25FIGURA 7. RUTA CRITICA PROYECTO30FIGURA 8. CUADRO ENTREGABLES PROYECTO32FIGURA 9. WBS DEL PROYECTO33

ABSTRACT

Un resumen bien preparado debe permitir, al lector o evaluador, identificar el contenido bsico del proyecto en una forma rpida y precisa. Debe incluir partes como los objetivos y panorama de investigacin, describir la metodologa empleada, resumir brevemente los principales resultados y plantear las principales conclusiones. Todo lo anterior nunca deber exceder de las 300 palabras. Esta pgina no se numera pero si se contabiliza.

INTRODUCCION

La Educacin hoy se constituye en una herramienta primordial en la construccin de saberes, tcnicas y conocimiento. Su deficiencia redunda en el retardo de los procesos en sus diversas manifestaciones econmicas, polticas, sociales, tecnolgicas, entre otras. La Revolucin de la Informacin ha logrado que el conocimiento se expanda de forma significativa a todos los rincones del planeta, exigiendo con urgencia el aprendizaje de sus formas de lenguaje. En Colombia este proceso empieza a hacerse ms visible con la creacin de plataformas que brindan la oportunidad de conocer y adems de crear ideas de negocio con el fin de ser ms competitivos en el exigente campo laboral, propsito ste, que el Instituto Superior de Educacin Rural ISER de Pamplona planea dentro de la ejecucin de los procesos de formacin y capacitacin de su comunidad educativa.

El ISER, especficamente dentro del pensum del Programa de Gestin de Redes y Sistemas Teleinformticos, no cuenta con la materia orientada al aprendizaje de HTML5 como lenguaje indispensable para el ptimo desempeo profesional. Por tanto, el Diseo de una Gua Prctica para la Enseanza de HTML5 se constituy en una respuesta a la necesidad de creacin de Entornos de Aprendizaje Colaborativos Virtuales que permitieran capacitar crticamente de acuerdo a los estndares mundiales en lo concerniente al Desarrollo Web.

El desarrollo de este Objeto de Aprendizaje exigi el reconocimiento del entorno mundial y nacional con lo relacionado al Estndar HTML5, la revisin ad-intra de la Institucin en la bsqueda de elementos que permitieran reevaluar patrones metodolgicos y asumir nuevas posturas en cuanto a Modelos Pedaggicos Virtuales de la mano del Semillero de Investigacin de la Unidad de Ingenieras e Informtica del ISER y de los conceptos valiosos del personal docente y estudiantil en la retroalimentacin de este proyecto investigativo.

Con la finalizacin de este proyecto se logr iniciar la era de la Virtualidad aplicada al Modelo Pedaggico B-Learning en el Diseo de la Gua Prctica para la Enseanza de HTML5 en nuestro Instituto permitiendo que el personal docente y estudiantil manejara los ltimos estndares de Diseo Web y posicionndonos como una futura plataforma virtual en la regin.

1. TITULO

DISEO DE UNA GUA PRCTICA PARA LA ENSEANZA DE HTML5 EN EL INSTITUTO SUPERIOR DE EDUCACIN RURAL, ISER DE PAMPLONA, NORTE DE SANTANDER

2. PLANTEAMIENTO DEL PROBLEMA

2.1. PLANTEAMIENTO DEL PROBLEMA

De acuerdo a la investigacin realizada, dentro del pensum acadmico del programa de Tecnologa en Gestin de Redes y Sistemas Teleinformticos del Instituto Superior de Educacin Rural, ISER de Pamplona, Norte de Santander, no existe la materia orientada al aprendizaje de HTML5 como lenguaje indispensable para el ptimo desempeo profesional.

Por lo tanto el Diseo de una Gua Prctica para la Enseanza de HTML5 en la institucin se considera una herramienta primordial para el proceso de aprendizaje de sus alumnos y como una herramienta de ayuda para el personal docente en un mundo que demanda el conocimiento de esta coleccin de estndares para el diseo y desarrollo de pginas web.

2.2. FORMULACIN DEL PROBLEMA

El Instituto Superior de Educacin Rural ISER de Pamplona no cuenta con una Gua Prctica para la enseanza de HTML5.

3. JUSTIFICACIN

La formacin del educando de hoy en Colombia no puede seguir siendo ajena a las necesidades y a los problemas que vive el mundo. Hoy se requiere de un proceso formativo que dote de herramientas y valores a los estudiantes que a diario se enfrentan a un complicado y permanente desafo de conocimientos. Nuestra comunidad no es ajena a esta problemtica, por el contrario es all donde lo miseria, la violencia y al abuso permanente en todo sentido de la dignidad humana se ve ms marcado.

Como Tecnlogos en Redes y Sistemas Teleinformticos debemos trabajar para cambiar esa realidad tan carente, buscando estrategias y nuevos recursos que generen nuevas expectativas y mejores posibilidades en el mejoramiento de la calidad de vida, especficamente en el campo de la educacin.

El advenimiento de las nuevas tecnologas y la apertura de la revolucin de la informacin, ha hecho que el panorama que nos ofrecen los lenguajes de programacin sea cada vez ms innovador. Un claro ejemplo se da en los entornos grficos que HTML5 nos presenta, constituyndose en la principal herramienta para el diseo web hoy.

Esta propuesta pretendi no slo responder a este cuestionamiento sino a satisfacer la necesidad de la elaboracin de una Gua Metodolgica que afianzara los conocimientos en el aprendizaje de HTML5 ofreciendo a la poblacin de la Comunidad Educativa del Instituto Superior de Educacin Rural -ISER de Pamplona, una educacin integral y de verdadera calidad, donde el aprendiz vaya a la par con los adelantos tecnolgicos y transformadores de la sociedad y los estructure concretamente en el rea del diseo web en este lenguaje hacindolos ms competitivos en el campo laboral.

El desafo, formar en tecnologa, en un entorno complejo, competitivo y cambiante. Formar en tecnologa significa entonces contribuir a la formacin de ciudadanos capaces de razonar, producir y desarrollar al mximo su potencial creativo y transformador.

4. OBJETIVOS

4.1. OBJETIVO GENERAL

Disear una Gua Prctica para la Enseanza de HTML5 en el Instituto Superior de Educacin Rural ISER de Pamplona, Norte de Santander.

4.2. OBJETIVOS ESPECFICOS

1. Realizar el estado del arte sobre la literatura relacionada con el Desarrollo de una Gua Prctica para la enseanza de HTML5.

2. Determinar la infraestructura tecnolgica para la implementacin de la Gua Prctica de HTML5.

3. Disear la Gua Prctica para la enseanza de HTML5.

4. Implementar la Gua Prctica para la enseanza de HTML5.

5. Documentar la Gua Prctica para la enseanza de HTML5.

5. MARCO DE REFERENCIA

5.1 ANTECEDENTES

De acuerdo a la investigacin realizada, en el Instituto Superior de Educacin Rural ISER de Pamplona, no se encuentran antecedentes de Trabajo de Grado ni de Pasantas relacionados con la Elaboracin de una Gua Educativa enfocada a lenguajes de programacin.

Por tanto se hizo una investigacin sobre los antecedentes en esta materia a nivel Mundial y Nacional con el fin de identificar algunos ejemplos significativos de HTML5.

5.1.1. Plataformas e-leaming programadas en html5

En este aparte se presenta la incidencia del lenguaje de programacin HTML5 en las plataformas LMS tradicionales que se estn utilizando para el proceso de enseanza- aprendizaje.

5.1.1.1 Adr infor S.L (S.L., 2013).

Adrformacion.com, Soluciones Integrales de E-Learning para Instituciones y Empresas, es una empresa espaola dedicada a la formacin y desarrollo de aplicaciones informticas. Fundada en el ao 1995, desarrollaron su primer proyecto de teleformacin en 1999 y desde esa fecha han dirigido todos sus esfuerzos a dotarse de un sistema de formacin on-line de ltima generacin, basado en una plataforma de desarrollo propio y de un amplio catlogo de cursos de alta calidad.

La plataforma ADR de formacin on-line es un sistema Web que permite la imparticin de cursos a travs de Internet y que necesita unos requisitos mnimos del usuario para ser utilizada, bsicamente disponer de una conexin a Internet y un navegador con el plugin de Flash instalado.

Una de sus creaciones es EDUCAFLAY (adrformacion, 2013), plataforma para la creacin de actividades educativas multimedia, cuyo objetivo es dotar a los usuarios de habilidades para extraer el mayor provecho posible de la plataforma a travs de su vinculacin con plataformas de E-learning.

Educaplay marca tendencia en la web ya que cuenta con la ventaja de su transicin progresiva del lenguaje HTML a HTML5 buscando ser compatible en todo tipo de dispositivos.

FIGURA 1. LOGO PLATAFORMA EDUCAPLAY

Una de las caractersticas principales para EDUCAPLAY a la hora de usar HTML5, es la posibilidad de realizar y manipular aplicaciones web multidispositivos sin necesidad de que stas soporten flash. Adems, hacer de cada aplicacin un diseo adaptativo para que se ajusten a las dimensiones de cada dispositivo y la experiencia del usuario sea buena en cualquier caso.

Uno de los ejemplos significativos de esta transicin es la vista de impresin de cada una de sus actividades. La siguiente imagen muestra el diseo de la actividad educativa.

FIGURA 2. VISTA PLATAFORMA HTMLY la siguiente imagen nos muestra la nueva ventana de impresin elaborada de la mano de HTML5.

FIGURA 3. VISTA IMPRESIN CON HTML5

5.1.1.2. Los EducadoresLos Educadores S.A.S. es una empresa Colombiana y Santandereana, creada por Byron Giovanny Angarita Castellanos mediante el apoyo continuo del SENA (Servicio Nacional de Aprendizaje), el programa Fondo Emprender de la Presidencia de la Repblica Colombia y COLCIENCIAS.

Comenta Byron Giovanny Angarita Castellanos (Castellanos, 2010-2013) Nos adelantamos a las tendencias tecnolgicas y generamos la primera plataforma de enseanza en lnea en Colombia que permite comunicacin en tiempo real mediante un tablero interactivo, Herramientas grficas, chat y tumos para usar el tablero. Fortalecemos competencias tecnolgicas en nuestra comunidad, al hacer uso de aplicaciones que permiten construir un mejor futuro para su vida y regin".

La plataforma de enseanza en lnea est hecha en los ltimos estndares de tecnologa (HTML5) que permite que funcione en dispositivos mviles y sea fcil de usar por cualquier equipo de cmputo.

Las sesiones de enseanza en lnea estn moderadas por un mdulo Gestor de Asesoras en lnea, que permite convocar a dos personas o ms (debe haber un profesor) a una sesin de una hora donde se podr ilustrar y preguntar en tiempo real sobre lo que se est explicando.

FIGURA 4. LOGO PLATAFORMA LOS EDUCADORES

PILARES DE WWW.LOSEDUCADORES.COM, PORTAL EDUCATIVO

Trabajamos fuertemente en 5 servicios principales que identificamos como pilares del portal:1. Base de conocimiento Calificada2. Enseanza en lnea interactiva3. Soporte pedaggico virtual4. Sistema Acadmico (Notas, planillas, asistencia)5. Red social educativa.

5.1.2. Plataforma que oferta cursos de HTML5

5.1.2.1. Apps.co

Una iniciativa diseada desde Ministerio de Tecnologas de la Informacin y las Comunicaciones (MinTIC) y su plan Vive Digital para promover y potenciar la creacin de negocios a partir del uso de las TIC, poniendo especial inters en el desarrollo de aplicaciones mviles, software y contenidos.

Cumpliremos un papel de mediadores y gestores de emprendimiento TIC, de tal forma que potenciemos la generacin de capacidades y conocimiento TIC de forma masiva entre los colombianos... Mediante la dinamizacin de ideas, oportunidades y el apoyo al desarrollo de negocios, pretendemos brindar soluciones TIC que hagan del Estado colombiano lder en manejo y produccin de herramientas y aplicaciones digitales as como de emprendimientos en este sector. ((MinTIC), 2013).

Apps.co propicia la generacin de ideas y oportunidades a partir de la definicin de necesidades en materia TIC para el Gobierno, que van desde aplicaciones especficas hasta software en todos los frentes.

FIGURA 5. LOGO PLATAFORMA APPS.CO

Apps.co as mismo oferta la realizacin de cursos certificados nacional e internacionalmente que permitan la formacin slida en favor de la consolidacin de la creacin de negocio a partir de las TIC. Uno de ellos y de vital importancia hoy en los estndares web es HTML5 al cual se puede acceder con suscripcin previa en este link https://apps.co/inscripciones/fase/bootcamps/ y habiendo realizado los Bootcamps, cursos de entrenamiento en lenguajes de programacin para el desarrollo de aplicaciones en web y plataformas nativas siguiendo metodologas de desarrollo gil.

5.2. MARCO TERICO

5.2.1 Plataformas E-Learning

La alfabetizacin digital consiste primordialmente en apoyar y desarrollar otras alfabetizaciones; no es sobre el uso de la tecnologa por s misma o como prctica aislada. (Morfi, 2011).

Las instituciones educativas siempre han mostrado cierta preocupacin por disponer de elementos multimedia que cubran todas y cada una de las reas del currculo oficial obligatorio por considerarse esencial para la integracin de las nuevas tecnologas. A este propsito Fernando Posada Prieto (Prieto, 2013), director del sitio web Canal Tic.com propone algunas pautas que pueden servir de base para futuros proyectos de produccin.

5.2.1.1 Contexto

Es importante indicar que en todo momento nos referimos al uso de estos recursos digitales en el contexto de un aula. Se supone que cada alumno/a utiliza su computador (1:1) para acceder al recurso con intencin de descubrir, reforzar aprendizajes curriculares. Y adems la figura del profesor/a es clave ejerciendo un papel de facilitador, asesor, entre roles. El aprovechamiento didctico en este contexto es la fuente de todas las decisiones y valoraciones aqu expuestas. Los criterios pueden ser diferentes si se piensa en el uso de recursos en otras situaciones ms informales o no regladas.

5.2.1.2. Caractersticas de los recursos digitales educativos

Tomando como punto de partida la experiencia de usuario en interaccin con un soporte digital surgen factores tcnicos, pedaggicos y ergonmicos que determinan las caractersticas fundamentales que deben tener los recursos educativos digitales. Estas caractersticas son: Multimedia. Interactividad.

Accesibilidad. Flexibilidad. Modularidad. Adaptabilidad y reusabilidad. Interoperabilidad. Portabilidad.

5.2.1.3. El modelo de Objeto Digital Educativo

En la actualidad la produccin de contenidos educativos digitales toma como referencia el modelo de Objeto Digital Educativo (DLO). Un Objeto Digital Educativo es un contenido sobre soporte digital que tiene 3 caractersticas bsicas:

Su finalidad es facilitar un cierto aprendizaje del usuario. Es independiente de los dems porque tiene significado propio por s mismo. Admite una integracin modular de jerarqua creciente, es decir, se puede integrar con otros objetos para dar lugar a otro ms complejo.

Un Objeto de Aprendizaje (OA) es un objeto digital educativo que resulta de la integracin de varios elementos multimedia y que tiene una funcin didctica explcita. El OA representa el nivel ms pequeo con funcin didctica explcita dentro del diseo de instruccin. Dicho objeto puede incluir una o varias actividades de aprendizaje y su evaluacin. De forma opcional puede incluir mapas conceptuales y sistemas de evaluacin del conocimiento previo. Su cobertura curricular aproximada puede ser un elemento de contenido de una asignatura en un nivel educativo determinado.

5.2.2. Html5

5.2.2. 1. Definicin

HTML5 es un gran salto en cuanto a programacin web se refiere, actualizando uno de los lenguajes ms conocidos y ms importantes en la que est escrita la Web. Introduce muchas mejoras que la anterior versin no tena, ya que era una versin muy longeva, aadiendo nuevas caractersticas que ya eran necesarias, como una forma de estructurar el cdigo ms clara y fcil, nuevas etiquetas como y que prometen una revolucin ya que proponen la universalidad de estos contenidos multimedia desde el punto de vista del programador.

HTML 5, ya que no es simplemente una nueva versin del lenguaje de marcacin HTML, sino una agrupacin de diversas especificaciones concernientes a el desarrollo web. Es decir, HTML 5 no se limita slo a crear nuevas etiquetas, atributos y eliminar aquellas marcas que estn en desuso o se utilizan inadecuadamente, sino que va mucho ms all.

As pues, HTML 5 (Alvarez, 2012) es una nueva versin de diversas especificaciones, entre las que se encuentran:

HTML 4 XHTML1 CSS Nivel 2 DOM Nivel 2 (DOM = Document Objete Model)

5.2.2.2. Caractersticas

HTML 5 incluye novedades significativas en diversos mbitos. Supone mejoras en reas que hasta ahora quedaban fuera del lenguaje y para las que se necesitaba utilizar otras tecnologas. Estructura del cuerpo: La mayora de las webs tienen un formato comn, formado por elementos como cabecera, pie, navegadores, etc. HTML 5 permite agrupar todas estas partes de una web en nuevas etiquetas que representarn cada uno de las partes tpicas de una pgina. Etiquetas para contenido especfico: Hasta ahora se utilizaba una nica etiqueta para incorporar diversos tipos de contenido enriquecido, como animaciones Flash o vdeo. Ahora se utilizan etiquetas especficas para cada tipo de contenido en particular, como audio, vdeo, etc. Canvas: es un nuevo componente que permitir dibujar, por medio de las funciones de un API, en la pgina todo tipo de formas, que podrn estar animadas y responder a interaccin del usuario. Es algo as como las posibilidades que nos ofrece Flash, pero dentro de la especificacin del HTML y sin la necesidad de tener instalado ningn plugin. Bases de datos locales: el navegador permitir el uso de una base de datos local, con la que se podr trabajar en una pgina web por medio del cliente y a travs de un API. Es algo as como las Cookies, pero pensadas para almacenar grandes cantidades de informacin, lo que permite la creacin de aplicaciones web que funcionen sin necesidad de estar conectados a Internet. Aplicaciones web Offline: Existe otro API para el trabajo con aplicaciones web, que se podrn desarrollar de modo que funcionen tambin en local y sin estar conectados a Internet. Geo localizacin: Las pginas web se podrn localizar geogrficamente por medio de un API que permita la Geolocalizacin. Nuevas APIs para interfaz de usuario: temas tan utilizados como el "drag & drop" (arrastrar y soltar) en las interfaces de usuario de los programas convencionales, sern incorporadas al HTML 5 por medio de un API. Fin de las etiquetas de presentacin: La responsabilidad de definir el aspecto de una web correr a cargo nicamente de CSS.

5.3. MARCO CONCEPTUAL

AGENTES DE USUARIO: Navegadores, reproductores multimedia, tecnologa de asistencia y otro software que usa la gente para acceder e interactuar con el contenido web.

API: Interfaz de comunicacin entre componentes software.. Se trata del conjunto de llamadas a ciertas bibliotecas que ofrecen acceso a ciertos servicios desde los procesos y representa un mtodo para conseguir abstraccin en la programacin, generalmente (aunque no necesariamente) entre los niveles o capas inferiores y los superiores del software. Uno de los principales propsitos de una API consiste en proporcionar un conjunto de funciones de uso general, por ejemplo, para dibujar ventanas o iconos en la pantalla. De esta forma, los programadores se benefician de las ventajas de la API haciendo uso de su funcionalidad, evitndose el trabajo de programar todo desde el principio.

CSS: acrnimo de Cascading Style Sheets(Hojas de estilo en cascada) es un mecanismo simple basado en reglas, es decir, declaraciones sobre el estilo de uno o ms elementos, el cual describe cmo se va a mostrar un documento en la pantalla, o cmo se va a imprimir, o incluso cmo va a ser pronunciada la informacin en un documento. Se utiliza para dar estilo a documentos HTML y XHTML, separando el contenido de la presentacin.

HTML: acrnimo de Hyper Text Markup Language, es el lenguaje de marcado predominante para la elaboracin pginas web. Es usado para describir la estructura y el contenido en forma de texto, as como para complementar el texto con objetos tales como imgenes. HTML se escribe en forma de etiquetas, rodeadas por corchetes angulares (). HTML tambin puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.

HTML5 (HyperText Markup Language, versin 5) es la quinta revisin importante del lenguaje bsico de la Web en HTML

LENGUAJE DE MARCAS DE HIPERTEXTO. Es el lenguaje de marcado predominante para la construccin de pginas web. Es usado para describir la estructura y el contenido en forma de texto, as como para complementar el texto con objetos tales como imgenes. HTML se escribe en forma de etiquetas, rodeadas por corchetes angulares (). HTML tambin puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.

PGINA WEB: es un documento o informacin electrnica adaptada para la World Wide Web que generalmente forma parte de un sitio web. Su principal caracterstica son los hipervnculos de una pgina, siendo esto el fundamento de la WWW.

TICS: Las tecnologas de la informacin y la comunicacin (TIC o bien NTIC para nuevas tecnologas de la informacin y de la comunicacin) agrupan los elementos y las tcnicas usados en el tratamiento y la transmisin de la informacin, principalmente la informtica, Internet y las telecomunicaciones.Por extensin, designan un sector de actividad econmica.

WORLD WIDE WEB: es un sistema de distribucin de informacin basado en hipertexto o hipermedios enlazados y accesibles a travs de Internet. Con un navegador web, un usuario visualiza sitios web compuestos de pginas web que pueden contener texto, imgenes, videos u otros contenidos multimedia, y navega a travs de ellas usando hiperenlaces.

5.4, MARCO CONTEXTUAL

5.4.1. Espacial:

El Instituto Superior de Educacin Rural ISER de Pamplona, es una entidad educativa que forma profesionales en los niveles tcnicos y tecnolgicos con los conocimientos, valores y habilidades necesarias para que puedan desarrollar sus actividades y trabajos con altos niveles de eficiencia, responsabilidad y competitividad, a travs del estudio, el perfeccionamiento y la enseanza de las Ciencias, las Humanidades, las artes, la tcnica y las tecnologas.

El Instituto ofrece cinco modalidades: Tecnologa Agroindustrial, Tecnologa Agropecuaria, Tecnologa en Redes y Sistemas Tele informticos, Tecnologa en Gestin y Construccin de Obras Civiles, Tecnologa Industrial, Tecnologa en Gestin Empresarial y Tecnologa en Trabajo Social y Comunitario, en las jornada diurna y nocturna y cuyos estudiantes accedern a los servicios de la Gua Metodolgica de HTML5 luego de su elaboracin e implementacin.

5.4.2. Temporal:

La elaboracin de la Gua Prctica para la Enseanza de HTML5 se desarroll con un tiempo estimado de ocho meses para elaborar el anlisis y diseo.

5.4.3. Terica:

La investigacin se enmarca en la elaboracin de una Gua Prctica para la enseanza de HTML5 por lo que se ha tomaron en cuenta los requerimientos del docente tutor del Trabajo de Grado y los propios para responder a la carencia de estas herramientas metodolgicas para la enseanza-aprendizaje en diseo web.

5.5. MARCO LEGAL

5.5.1. Acuerdo N 006 de 2007 (ISER, 2007).

A continuacin se har una breve remisin a la normatividad que orient el desarrollo del Trabajo de Grado en el Instituto Superior de Educacin Rural ISER de Pamplona en su Captulo VIII.

ARTCULO 92. En el Plan de estudios de algunos programas, el Instituto establece como requisito para la obtencin del ttulo acadmico, la realizacin por parte del estudiante, de un trabajo especial que se denomina TRABAJO DE GRADO". Por intermedio de este trabajo se consolida en el estudiante su formacin integral, que le permite:

a. Diagnosticar problemas y necesidades utilizando los conocimientos adquiridos en el Instituto.b. Acopiar y analizar la informacin para plantear soluciones a problemas y necesidades especficas.c. Desarrollar planes y ejecutar proyectos que le permitan demostrar su capacidad en la toma de decisiones.d. Formular y evaluar proyectos.

ARTCULO 93. En cada uno de los programas existir un Comit de Trabajos de Grado, conformado por el Coordinador Acadmico del Programa, quien lo preside, y dos (2) profesores nombrados por el Director de la Unidad. El Comit puede asesorarse de personal experto para la definicin y evaluacin de los trabajos.

El siguiente artculo en el inciso a) hace referencia al Proyecto de Grado de Tipo Investigativo que se desarrollar a travs del Diseo de una Gua Prctica Para la Enseanza de HTML5.

ARTCULO 95.a. Investigacin: comprende la planeacin, organizacin, direccin y control de proyectos que, siendo cabalmente ejecutados, procuran obtener informacin relevante y fidedigna para entender, verificar, corregir o aplicar el conocimiento de la disciplina acadmica.

A continuacin se har una breve revisin de la normatividad que orient el Diseo de una Gua Prctica para la enseanza de HTML5 en el Instituto Superior de Educacin Rural ISER de Pamplona.

En al ARTCULO 97 se referencia el momento de entrega del Anteproyecto. En las ltimas dos (2) semanas del perodo acadmico inmediatamente anterior al cual el estudiante matricular el Trabajo de Grado, deber presentar ante el Director de la Unidad respectiva un PROYECTO DE TRABAJO DE GRADO impreso y acompaado de un archivo digital del mismo tenor, el cual debe contener:

i. Ttuloii. Formulacin del problemaiii. Justificaciniv. Objetivos general y especficosv. Marco referencial (terico, histrico, conceptual, estado actual, cientfico y tecnolgico, entre otros)vi. Diseo metodolgico preliminarvii. Nombres de las personas que participan en el procesoviii. Recursos disponibles (materiales, institucionales y financieros)ix. Cronogramaj. Bibliografa

5.5.2. Acuerdo Consejo Acadmico (Junio 2013) (ISER, 2007).

A travs de este acuerdo se establecen las polticas para el funcionamiento de la modalidad B-Learning en los cursos presenciales del Programa de Tecnologa en Gestin de Redes y Sistemas Teleinformticos del Instituto Superior de Educacin Rural ISER de Pamplona.

En su Artculo Primero se reglamentan las polticas y estrategias pedaggicas mediadas por TIC'S y aspectos acadmico/administrativos y hace una breve referencia al tema Educacin apoyada en la Virtualidad (Correa Uribe, 2006) y los desafos que la Educacin Superior debe afrontar debido a la globalizacin y a la innovacin tecnolgica. As mismo, se especifica el caminar del Instituto hacia la incorporacin de elementos mediadores como apoyo a los procesos de formacin del programa de Tecnologa en Gestin de Redes y Sistemas Teleinformticos.

El proceso metodolgico de los cursos mediados por las tecnologas de la informacin y las comunicaciones, combina e integra cinco (5) momentos pedaggicos que debe evidenciar el estudiante:

GRAFICO 6. PROCESO METODOLOGICO CURSOS

Adems, dentro de los propsitos y objetivos que orientan el funcionamiento de la modalidad B-Learning, el Acuerdo Presenta los siguientes:

PROPSITOS Fundamentar y activar la actuacin del estudiante como agente dinamizador de su propio aprendizaje y del aprendizaje con los otros. Capacitar a los estudiantes para la comprensin, aprehensin y aplicacin de las estrategias y tcnicas pertinentes en los momentos propios de la metodologa de la educacin B-Learning. Fomentar en el estudiante el desarrollo de actitudes y valores particulares del individuo autnomo y pensamiento crtico. Es importante la construccin del Portafolio de Desarrollo Personal, el cual puede ser una carpeta en su PC que rena todos los trabajos que desarrolle. En ella debe registrarse los eventos de reconocimiento general, reconocimiento, profundizacin y transferencia del curso y que debe demostrar su avance en el proceso de formacin a lo largo del periodo acadmico. Con la construccin del Portafolio, el docente debe proponer antes de finalizar el curso, el desarrollo de una sntesis ya sea de produccin textual o de produccin tecnolgica que permita a los estudiantes cohesionar los contenidos de la asignatura.

OBJETIVOS Eliminar la distancia entre los sujetos pedaggicos (estudiante- tutor-grupo) desde la posibilidad de mantener un dilogo activo y frecuente, en el cual se desarrollan procesos de pensamiento y nuevos conocimientos. Promover la enseanza y el aprendizaje centrados en procesos y actividades intelectuales y comunicativos. Provocar sistemticamente el desarrollo de acciones y actividades que despiertan y ponen en evidencia la capacidad creativa y constructiva del conjunto profesor- estudiante-grupo. Fomentar el sentido crtico desde la generacin de espacios y experiencias adecuadas para la bsqueda y tratamiento de informacin especializada. Fundamentar en el estudiante la autonoma para el desempeo eficaz de su funcin como gestor de su proceso educativo. Lograr en el estudiante la transferencia de aprendizaje significativo e investigativo. Fomentar de manera efectiva la produccin intelectual en los docentes. Articular el desarrollo de contenidos con los que imparten las asignaturas.

En el Captulo I de este Acuerdo se destaca el tiempo de duracin de la Metodologa B- Learning para el Programa de Tecnologa de Gestin de Redes y Sistemas Teleinformticos, que ser de 25% apoyado en las TICs y el desarrollo de tales objetos virtuales de aprendizaje se estructurar segn el diseo instruccional (DI) desarrollado para el programa.

El Captulo II nos remite a la vinculacin docente en este proceso desde su capacitacin sobre el Modelo Pedaggico demostrando competencias en el manejo de plataformas gestoras de contenidos y experiencia en el desarrollo de cursos bajo esta modalidad de enseanza.

El Captulo III hace referencia al licenciamiento de toda publicacin de cursos y contenidos didcticos incluida dentro de un curso u objeto de aprendizaje. En el Artculo Sexto, en su inciso a) se pide referenciar tales contenidos (imgenes, animaciones, artculos, etc.) siguiendo la regla de citas bibliogrficas de la IEEE o APA.

El Captulo IV que hace referencia al Plan Docente y la Evaluacin, se presenta textualmente a continuacin,

ARTCULO SPTIMO.- Se concibe la formacin a travs de los objetos de aprendizaje como acciones formativas que inciden de manera activa a los docentes y estudiantes, en la bsqueda de la flexibilidad y mayor autonoma por parte del estudiante en su proceso de aprendizaje y desde la perspectiva del docente, la incorporacin de nuevos recursos y permanente actualizacin. Para llevar a cabo la cohesin del desarrollo acadmico en las asignaturas se hace necesario contar con un elemento integrador suficientemente estable que le permita al docente crear los objetos de aprendizaje y al estudiante navegar por la asignatura reconociendo el contexto de fundamentacin. Este modelo deber organizar cada uno de los aspectos de la asignatura asegurando de esta manera la universalidad de la informacin contenida en ella.

As mismo, los elementos que componen el plan docente y que debern ser desarrollados por ellos y que hacen parte fundamental de cada asignatura, y en el Diseo de una Gua Prctica para la Enseanza de HTML5, son los descritos en el Artculo Octavo de este Acuerdo:

a) Ttulo de la asignatura.b) Profesor responsable de la asignatura y formacin.c) Profesor(es) Par(es) consultor y formacin.d) Presentacin.e) Objetivos y competencias.f) Contenidos.a. Actividadesi. Nombre de la actividadii. Tipo de actividad (prctica o participacin (individual o grupal), objeto de aprendizaje, debate, proyecto o Portafolio.iii. Situacin de aprendizajeiv. Tiempo de la actividadv. Objetivos de la actividadvi. Documentos de Referenciasvii. Recomendaciones.

g) Evaluacin.h) Fechas clave.i) Bibliografa de referencia,j) Otros enlaces comentados.

Finalmente, en el Artculo Noveno se destacan los lineamientos que harn parte del proceso evaluativo de los Modelos Pedaggicos y Objetos de Aprendizaje.

ARTCULO NOVENO.- se concibe la Evaluacin un proceso continuo y por tanto evaluado a travs del desarrollo de las actividades de manera permanente, individual y grupal, con el fin de entender el grado de pertinencia del curso hacia el estudiante y el grupo en general.

PARGRAFO: Por cada unidad contemplada en Plan Docente se desarrollar como mnimo una actividad las cuales podrn reemplazar los parciales definidos en el calendario acadmico bajo criterio del docente titular y los docentes consejeros.

La superacin de esta asignatura se basa en la obligatoriedad de: La entrega de todas y cada una las actividades de evaluacin continua (PAC) La superacin de todas y cada una de las actividades de evaluacin continua con un mnimo de Tres punto Cero (3.0) La intervencin en las actividades colaborativas que impliquen la utilizacin de cualquier tipo de herramienta de participacin.

6. MATERIALES Y MTODOS (METODOLOGA):

6.1. MATERIALES:

6.1.1. Recurso Material:

Dentro de los recursos usados para la realizacin de la Gua Prctica para la Enseanza de HTML5, se utilizaron los siguientes:

6.1.1.1. Timeline.

Herramienta de lneas de tiempo basada en la web que hace que sea muy fcil, la organizacin cronolgica de las actividades que integran cada una de las semanas de la Gua de Aprendizaje para la Enseanza de HTML5 permitiendo que el aprendizaje sea mucho ms fcil y agradable a travs de una corta descripcin que introduce acerca de la temtica a tratar.

Debido a que est completamente basada en la web no se necesit descargar ningn software, sino una computadora con acceso a internet.

En cada una de ellas, se realiza una corta descripcin de la semana

6.1.1.2. Aptana Studio.

Es un entorno de desarrollo integrado de software libre en eclipse y desarrollado en Aptana Inc. que mediante una moderna y agradable interface puede funcionar bajo diversos sistemas operativos como Windows, Mac y Linux y que provee soporte para lenguajes de programacin web como HTML, Javascript y CSS. permite trabajar con diferentes lenguajes y tecnologas de programacin web como HTML, DOM, JavaScript y CSS.

6.1.1.3. f

Aptana studio para programar Aptana Studio es un entorno de desarrollo integrado de software libre basado en eclipse y desarrollado por Aptana, Inc., que puede funcionar bajo Windows, Mac y Linux y provee soporte para lenguajes como: Php, Python, Ruby, CSS, Ajax, HTML y Adobe AIR. Tiene la posibilidad de incluir complementos para nuevos lenguajes y funcionalidades.Aptana Studio es para mi uno de los mejores entornos para desarrollo web queAdems, mediante plugins gratuitos podemos agregar PHP, Jaxer, Ruby on Rails, Python, Adobe AIR, Apple iPhone y Nokia S60.Entre las funciones ms destacadas de Aptana Studio podemos mencionar: Asistente de cdigo para HTML y Javascript. Libreras ajax (jQuery, prototype, scriptaculous, Ext JS, dojo, YUI y Spry entre otras). Conexion va FTP, SFTP, FTPS y Aptana Cloud. Herramientas para trabajo con base de datos. Marcado de sintxis mediante colores. Compatible con extensiones para Eclipse (existen ms de 1000).Aptana Studio es gratuito, de cdigo abierto y multiplataforma, por lo que puede instalarse en cualquier PC con sistemas operativos Windows, Linux o Mac OSX.As que ya sabes, si quieres desarrollar aplicaciones web de una manera rpida y sencilla, descarga e instala Aptana Studio, estoy seguro que no te vas a arrepentir.

Video2brain para tutoriales.

W3schools.com

MATERIALES6.2 MTODOS.6.2.1 Diseo de la Investigacin.6.2.2 Poblacin de estudio y muestra.6.2.3 Variables del estudio.6.2.4 Recoleccin de la Informacin:6.2.5 Anlisis de la Informacin.

Plataforma Apps.co para el entrenamiento en HTML5. Infraestructura tecnolgica. Modelos Pedaggicos B-Learning. Instrumentos de Evaluacin (diagnstico, Pruebas). Documento que define el rol del docente y del aprendiz en la elaboracin de este Objeto de Aprendizaje.

Recurso Humano:

Los conocimientos obtenidos del entrenamiento con la Plataforma Apps.co sobre los estndares de HTML5. La orientacin del Semillero de Investigacin en el Diseo e implementacin de la Gua Prctica para la Enseanza de HTML5. El aporte de sujetos receptores de esta Gua Prctica,a saber Docentes y Estudiantes del Programa Tecnologa de Gestin deRedes y Sistemas Teleinformticos.

6.2. MTODOS:

6.2.1. Metodologa:

El Mtodo a aplicar en el Diseo de la Gua Prctica para la Enseanza de HTML5 ser el CPM o Ruta Crtica (equivalente a la sigla en ingls Critical Path Method) frecuentemente utilizado en el desarrollo y control de proyectos. Este mtodo determina la duracin de un proyecto, entendiendo ste como una secuencia de actividades relacionadas entre sr, donde cada una de ellas tiene una duracin estimada.

FIGURA 7. RUTA CRTICA DEL PROYECTO

6.2.2 Poblacin de estudio y muestra

Poblacin de estudio o contexto:

El Instituto Superior de Educacin Rural ISER de Pamplona, es una entidad educativa que forma profesionales en los niveles tcnicos y tecnolgicos con los conocimientos, valores y habilidades necesarias para que puedan desarrollar sus actividades y trabajos con altos niveles de eficiencia, responsabilidad y competitividad, a travs del estudio, el perfeccionamiento y la enseanza de las Ciencias, las Humanidades, las artes, la tcnica y las tecnologas.

El Instituto ofrece cinco modalidades: Tecnologa Agroindustrial, Tecnologa Agropecuaria, Tecnologa en Gestin y Construccin de Obras Civiles, Tecnologa Industrial, Tecnologa en Gestin Empresarial, Tecnologa en Trabajo Social y Comunitario y Tecnologa en Redes y Sistemas Tele informticos, en las jornada diurna y nocturna y cuyos estudiantes accedern a los servicios de la Gua Metodolgica de HTML5 luego de su elaboracin e implementacin.

Muestra:

La implementacin de la Gua Prctica para la Enseanza de HTML5 en el Instituto Superior de Educacin Rural, ISER de Pamplona, Norte de Santander se aplicar a los estudiantes de IV, V y VI Semestre del Programa de Gestin de Redes Teleinformticos

7. RESULTADOS Y DISCUSIN

Resultados en forma descriptiva o grafica con pruebas estadsticas.

tamao muestra (n); grados de libertad (gl) y nivel de significancia (P).

presentar anlisis impersonal.

A continuacin se har un listado de cada uno de los entregables del proyecto.ENTREGABLES PROYECTO

Documento escrito condensado en el marco terico del proyecto.

Documento con resumen y anlisis de la literatura mundial recopilada

Documento con resumen y anlisis de la literatura nacional recopilada

Documento sntesis resultado diagnstico.

Estado del arte del proyecto

Documento descriptivo de las caractersticas de la arquitectura red/servidor.

Documento descriptivo de las caractersticas de los equipos a utilizar en el proyecto.

Documento descriptivo diseo instruccional.

Documento descriptivo Diseo Gua de Aprendizaje.

Documento Gua Rol Docente.

Documento procedimental de construccin de Gua de aprendizaje.

Documento de validacin de la Gua de Aprendizaje.

Aplicativo web sobre la enseanza de HTML5

Instrumentos de evaluacin.

Documento anlisis de los resultados de la evaluacin.

Documento Gua Rol del Estudiante.

FIGURA 8. CUADRO ENTREGABLES PROYECTO 18. CRONOGRAMA DE ACTIVIDADES - WBS

FIGURA 9. WBS PROYECTO

9. PRESUPUESTO

Luego del diagnstico realizado en el Instituto objeto de la propuesta se encontraron las siguientes fortalezas:

Cuenta con el espacio adecuado para la implementacin de la propuesta de aprendizaje. Se tienen los recursos fsicos y econmicos necesarios. Se cuenta con el personal docente que maneja este tipo de lenguaje

Conclusiones

Deben plantearse de forma afirmativa y basarse en los resultados obtenidos y sudiscusin, mostrando claramente, hasta dnde se confirmaron o no las hiptesis propuestas y si secumplieron los objetivos del trabajo.

Recomendaciones.

Es aqu donde se demuestra el conocimiento adquirido a lo largo de larealizacin del trabajo y se orienta a los que luego tomarn ste como una base para continuar. Tambines el sitio para presentar algunas razones por las que se cree no se obtuvo todo lo que se deseaba, si asfue, y orienta en la forma como se podra solucionar esos aspectos.

Anexos.Estos incluyen el instrumento mediante el cual se har la recoleccin de informacin, con surespectiva codificacin (Anexo A., Anexo B.) para guiar la tabulacin de datos y el instructivo paradiligenciarlo. Tambin se incluye cualquier otra informacin necesaria para complementar el proyecto. Losapndices y anexos deben estar citados en el cuerpo del trabajo

10. REFERENCIAS BIBLIOGRAFIAS

ALVAREZ, Miguel ngel. Desarrolloweb.com. (2012: Colombia). [Consulta: 22 junio2013].

CASTELLANOS, Byron Giovanny Angarita. Plataforma Educativa Los Educadores. (2012-2013:Colombia) [Consulta:14junio2013].

EDUCAPLAY, adrformacion. (2013:Espaa) [Consulta: 20 junio 2013].

Instituto Superior de Educacin Rural ISER de Pamplona, Acuerdo julio de 2013 por el cual se establecen las polticas PARA EL ESTABLECIMIENTO DE ESTRATEGIAS PEDAGGICAS PARA LA INCORPORACIN DE LA MODALIDAD B-LEARNING EN EL PROGRAMA DE TECNOLOGA EN GESTIN DE REDES Y SISTEMAS TELEINFORMTICOS INSTITUTO SUPERIOR DE EDUCACIN RURAL. (2013:Colombia)

Instituto Superior de Educacin Rural ISER de Pamplona, Acuerdo n8006 DE 2007 por el cual se Unifica el Reglamento Acadmico y Estudiantil del instituto Supenor de Educacin Rural ISER de Pamplona. (2007: Colombia).

(MINTIC), MINISTERIO DE TECNOLOGAS DE LA INFORMACIN Y LAS COMUNICACIONES, Plataforma Educativa Apps.co. (2013:Colombia)[Consulta: 26 junio 2013].

MORFI, Mara Lujn. Artculo "Los retos actuales de la Tecnologa". Publicado en la Revista LEARNING REVIEW LATINOAMERICA (2011) 60 pginas. Edicin 34. ISSN 1669-919X [Consulta: 26 junio 2013].

PRIETO, Fernando Posada. CanalTic.com. (2013:Espaa) [Consulta: 23 junio 2013].

S.L., ADR Infor. adrformacion. Soluciones integrales de e-learning para instituciones y empresas. (2013: Espaa) [Consulta: 04 junio 2013].

34