Metodología de enseñanza-aprendizaje de los lenguajes informáticos HTML y CSS para

99 Pages·2017·2.72 MB·Spanish

by  Celia Torres Blasco

Metodolog´ıa de ensen˜anza-aprendizaje de los lenguajes
inform´aticos HTML y CSS para estudiantes con
predominancia lateral derecha: el caso de estudiantes de
Disen˜o Gr´afico
Celia Torres Blasco
M´aster de Aplicaciones Multimedia
Universitat Oberta de Catalunya (UOC)
Trabajo Final del M´aster
Aplicaciones Multimedia
Junio 2016
Este documento ha sido creado con LATEX.
Elautorconfirmaqueeltrabajodeinvestigaci´onespropioyquelasfuentesutilizadashansido
citadas debidamente.
Esta memoria de Trabajo Final de M´aster est´a bajo una licencia Creative Commons del tipo
Reconocimiento-No comercial-Sin obras derivadas 4.0 Interancional.
ii
FITXA DEL TREBALL FINAL

Metodología de enseñanza-aprendizaje de los
lenguajes informáticos HTML y CSS para
Títol del treball:
estudiantes con predominancia lateral derecha: el
caso de estudiantes de Diseño Gráfico
Nom de l’autor: Celia Torres Blasco
Nom del consultor/a: Enrique Guaus i Termens
Nom del PRA: David García Solórzano
Data de lliurament (mm/aaaa): 06/2016
Titulació o programa: Màster Universitari d’Aplicacions Multimèdia
Àrea del Treball Final: Treball de Final de Màster de Recerca
Idioma del treball: Castellà
metodología de enseñanza-aprendizaje, lateralidad
Paraules clau
cerebral derecha, lenguajes HTML y CSS
Resum del Treball (màxim 250 paraules):
Los estudios realizados en el campo de la neurociencia definen unas funciones y tipos de
procesamiento de la información diferentes para cada hemisferio del cerebro. La educación
occidental se centra principalmente en el desarrollo del hemisferio izquierdo. Por lo tanto, los
estudiantes con mayores capacidades en el hemisferio derecho tienen dificultad para afrontar
materias relacionadas con el izquierdo. Este artículo propone un nuevo método de enseñanza-
aprendizaje para facilitar el desarrollo de las competencias de los lenguajes HTML y CSS,
propios del hemisferio izquierdo. La metodología está dirigida a estudiantes con
predominancia lateral derecha, como es el caso de los estudiantes de Diseño Gráfico con el fin
de mejorar los resultados académicos. La investigación se ha realizado sobre la asignatura
«Tecnología Digital II» de los Estudios Superiores de Diseño de la Escuela de Arte y Superior
de Diseño de las Islas Baleares. A través de una estrategia de action research y con la ayuda
de diferentes métodos de recogida de datos como documentos, sesiones informales,
cuestionarios y entrevistas, se ha obtenido la información necesaria para verificar la idoneidad
de este método. Los hallazgos han sido satisfactorios y el método ha conseguido un menor
abandono y mejores calificaciones. Sin embargo, algunos objetivos no se han alcanzado. Por
ello, se propone un nuevo ciclo de investigación para el próximo curso 2016-2017 con mejoras
y nuevos submétodos nuevos.
Abstract (in English, 250 words or less):

Studies in the field of neuroscience define specific functions and different information
processing for each brain hemisphere. Western education primarily focuses particularly on the
improvement of the left hemisphere. Therefore, students with higher capacities in the right
hemisphere have trouble dealing with matters concerned to the left hemisphere. This article
proposes a new method of teaching-learning to facilitate the development of skills of HTML and
CSS languages, typical of the left hemisphere. The methodology is intended for students with
lateral right predominance, that is the case of Graphic Design students, in order to enhance
their academic outcomes. The research is being conducted on the subject "Digital Technology
II" in Design Studies of the Higher Art and Design School of the Balearic Islands. The accuracy
of this method has been validated by extracting information about various data generation
methods such as documents, informal sessions, questionnaires and interviews, through a
strategy of action research. The findings have been satisfactory and the method have achieved
both lower school drop-outrate and better marks. However, the objectives have not been
completely reached. Therefore, it is proposed another research cycle for the next course 2016-
2017 incorporating improvements and new sub-methods.
Resumen
Losestudiosrealizadosenelcampodelaneurocienciadefinenunasfuncionesytipos
de procesamiento de la informaci´on diferentes para cada hemisferio del cerebro. La
educaci´onoccidentalsecentraprincipalmenteeneldesarrollodelhemisferioizquier-
do. Por lo tanto, los estudiantes con mayores capacidades en el hemisferio derecho
tienen dificultad para afrontar materias relacionadas con el izquierdo. Este art´ıculo
propone un nuevo m´etodo de ensen˜anza-aprendizaje para facilitar el desarrollo de
las competencias de los lenguajes HTML y CSS, propios del hemisferio izquierdo.
Lametodolog´ıaest´adirigidaaestudiantesconpredominancialateralderecha,como
es el caso de los estudiantes de Disen˜o Gr´afico con el fin de mejorar los resultados
acad´emicos.Lainvestigaci´onseharealizadosobrelaasignatura(cid:40)(cid:40)Tecnolog´ıaDigital
II(cid:41)(cid:41) de los Estudios Superiores de Disen˜o de la Escola d’Art i Superior de Disseny
de les Illes Balears. A trav´es de una estrategia de action research y con la ayuda
de diferentes m´etodos de recogida de datos como documentos, sesiones informales,
cuestionarios y entrevistas, se ha obtenido la informaci´on necesaria para verificar
la idoneidad de este m´etodo. Los hallazgos han sido satisfactorios y el m´etodo ha
conseguidounmenorabandonoymejorescalificaciones.Sinembargo,algunosobje-
tivos no se han alcanzado. Por ello, se propone un nuevo ciclo de investigaci´on para
el pr´oximo curso 2016-2017 con mejoras y nuevos subm´etodos.
iv
´
Indice general
´Indice de figuras IX
´Indice de tablas XI
1. Introducci´on 1
1.1. Justificaci´on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
1.2. Objetivo principal de la investigaci´on . . . . . . . . . . . . . . . . . . . . . . . . . 3
1.3. Objetivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
1.4. Metodolog´ıa de investigaci´on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
1.4.1. Estrategia de investigaci´on . . . . . . . . . . . . . . . . . . . . . . . . . . 4
1.4.2. T´ecnicas de generaci´on de datos . . . . . . . . . . . . . . . . . . . . . . . 5
1.4.3. Evaluaci´on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
1.5. Plan de investigaci´on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
2. Neurociencia cognitiva 11
3. M´etodosinnovadoresdeensen˜anza-aprendizajedelosleguajesHTMLyCSS 15
v
´INDICE GENERAL
3.1. La gamificaci´on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
3.2. La clase invertida o flipped classroom . . . . . . . . . . . . . . . . . . . . . . . . 18
3.3. Aprendizaje basado en proyectos . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
3.4. Aprendizaje basado en problemas . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
3.5. M´etodos ´agiles en el aprendizaje . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
3.6. Herramientas y recursos de aprendizaje on-line . . . . . . . . . . . . . . . . . . . 21
3.6.1. Codecademy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
3.6.2. Khanacademy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.6.3. MOOCs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.6.4. Classroom . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
4. Desarrollo de la investigaci´on 25
4.1. Descripci´on de la asignatura . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
4.1.1. Objetivos de aprendizaje de la asignatura . . . . . . . . . . . . . . . . . . 26
4.1.2. Contenidos de la asignatura . . . . . . . . . . . . . . . . . . . . . . . . . . 26
4.2. Diagn´ostico inicial de la asignatura . . . . . . . . . . . . . . . . . . . . . . . . . . 27
4.2.1. Metodolog´ıa did´actica . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
4.2.2. Procedimientos e instrumentos de evaluaci´on y calificaci´on. . . . . . . . . 27
4.2.3. Calificaciones y asistencia . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
4.2.4. Errores m´as comunes de los ejercicios . . . . . . . . . . . . . . . . . . . . 31
4.2.5. Sesiones informales . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
vi
´INDICE GENERAL
4.2.6. Cuestionarios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
4.2.7. Discusi´on sobre el estado de la asignatura . . . . . . . . . . . . . . . . . . 34
4.3. Propuesta del nuevo m´etodo de ensen˜anza-aprendizaje . . . . . . . . . . . . . . . 34
4.4. Resultados de la asignatura con al nueva metodolog´ıa . . . . . . . . . . . . . . . 37
4.4.1. Procedimientos e instrumentos de evaluaci´on y calificaci´on. . . . . . . . . 37
4.4.2. Test inicial . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
4.4.3. Calificaciones y asistencia . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
4.4.4. Errores m´as comunes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
4.4.5. Sesiones informales . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
4.4.6. Cuestionarios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
4.4.7. Entrevistas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
4.4.8. Discusi´on sobre el estado de la asignatura . . . . . . . . . . . . . . . . . . 43
5. Conclusiones y futuras l´ıneas de investigaci´on 49
Anexos 52
A. Cuestionarios 55
A.1. Resultados cuestionario final del curso 14-15 . . . . . . . . . . . . . . . . . . . . . 56
A.2. Resultados test inicial del curso 15-16 . . . . . . . . . . . . . . . . . . . . . . . . 61
A.3. Resultados cuestionario final del curso 15-16 . . . . . . . . . . . . . . . . . . . . . 74
Bibliograf´ıa 85
vii
´INDICE GENERAL
viii
´
Indice de figuras
1.1. Periodos de evaluaci´on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
1.2. Fases del ciclo iterativo de la metodolog´ıa action research . . . . . . . . . . . . . 5
1.3. Distribuci´on de tareas para la propuesta de tesis . . . . . . . . . . . . . . . . . . 8
3.1. Cartas del juego cHTeMeLe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
3.2. Partida de cartas del juego cHTeMeLe . . . . . . . . . . . . . . . . . . . . . . . . 18
3.3. Espacio de trabajo Codecademy. . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.4. Espacio de trabajo Khanacademy . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.5. Espacio de trabajo Google Classroom . . . . . . . . . . . . . . . . . . . . . . . . 24
4.1. Calificaciones de evaluaci´on continua del curso 12-13 al 14-15 . . . . . . . . . . . 28
4.2. Calificaciones de evaluaci´on final del curso 12-13 al 14-15 . . . . . . . . . . . . . 29
4.3. Calificaciones de evaluaci´on extraordinaria del curso 12-13 al 14-15 . . . . . . . . 29
4.4. Asistencia del curso 13-14 y 14-15. . . . . . . . . . . . . . . . . . . . . . . . . . . 30
4.5. Estructura de los m´etodos de ensen˜anza-aprendizaje aplicados. . . . . . . . . . . 35
ix