JUANCARLOSCAMACHOVEGA

AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
RECURSONo TIPORECURSO URL PROPSITO
1

Pginaweb Milliondollarpage:
http://www.milliondollarhomepage.com/

ActividadExploracin
2

Elpeorsitioweb:
http://www.theworldsworstwebsiteever.com/

3 Centrodeestudiosvisualesavanzados:
http://cavs.mit.edu/
4 ArchivoPDF CursocompletodeHTML:
http://es.tldp.org/ManualesLuCAS/doccurso
html/doccursohtml.pdf

ActividadReformulacin
5 VideoenYoutube Cmosacarelcdigodeunapginaweb:
https://www.youtube.com/watch?v=yYrWnHdjW6g

6 EditordeHTMLonline Editoronlinedehtmlentiemporeal.
http://htmledit.squarefree.com/

ActividaddeSntesis 7 Prezi http://prezi.com/suy8vxl7ctml/usabilidady

accesibilidaddesitiosweb/

8 Podcast Podcastssobrediseoweb.
http://apuntesalmargen.com/podcasts.html

9 Video Crearpginawebconnotepad++
https://www.youtube.com/watch?v=qojd2NA5sI4

Actividaddeaplicacin
10 DocumentoScribd Fallosquenodebescometerentuspginasweb
http://es.scribd.com/doc/54394600/7349296Fallos
QueNoDebesCometerenTusPagina

JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
IDENTIFICACIN

INFORMATICA
UNIDADDIDCTICA

USODEETIQUETASHTML

RESUMEN

HTML,siglasdeHyperTextMarkupLanguage(lenguajedemarcasdehipertexto),hacereferenciaallenguajedemarcadoparalaelaboracin
de pginas web. Es un estndar que, en sus diferentes versiones, define una estructura bsica y un cdigo (denominado cdigo HTML) para la
definicindecontenidodeunapginaweb,comotexto,imgenes,etc.Sibienesciertoqueesposiblecrearpginaswebconeditoresvisuales
de cdigo, tambin lo es, que stos programas no corrigen la totalidad del cdigo, y en ocasiones, las pginas creadas no cumplen con los
estndares de la W3C. El conocimiento de las etiquetas de HTML permite solucionar estos problemas y lograr sitios accesibles, navegables y
usables.

OBJETIVOGENERAL
(Se establece con respecto al trabajo a
desarrollar en el proceso de aplicacin de la
unidaddidctica)

IdentificarlaestructuramnimadeetiquetasHTMLquehacenqueunsitiowebcumplaconlos
requisitosdeaccesibilidad,usabilidadynavegabilidad.
OBJETIVOSESPECIFICOS
(Redactarcadaunodelosobjetivosteniendoencuentalosaspectosqueaparecenenelladoizquierdo)
ACTITUDINAL
PROCEDIMENTAL DisearpginaswebapartirdeetiquetasHTML.
CONCEPTUAL IdentificarlasetiquetasHTMLdemayorusoenlaelaboracindepginasweb.
COMUNICATIVO
JUSTIFICACIN:
JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin

HTMLesunlenguajeparaelaborarpginasweb,queentreotros,ofreceposibilidadesdeaprendersobrelaprogramacin.
Consiste de poner atencin en lo que estamos elaborando, en cada palabra o etiqueta que pongamos, lleva concentracin y tiempo lo que
permite desarrollar nuestras capacidades intelectuales. Este cdigo permite compartir informacin, ideas, trabajo, y ayuda a crearlas sin
necesidad de utilizar programas complejos para crear pginas web. Para los nativos digitales a los que va dirigido esta unidad didctica, es
fundamentalafindecomprenderlaestructuramediantelacualfuncionaelcdigoHTML.

POBLACINAQUIENESTDIRIGIDA:

Aprendizs de educacin media de grado

dcimo, rea de informtica, nativos digitales
con conocimientos previos de navegacin en
internet y familiarizados con el uso de las
redessociales.
Nota:
TIEMPO
NMERODESESIONES NMERODEHORAS
4 2
TEMA
GENERAL ESPECIFICOS

MATERIALES

JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
DESCRIPCINDEACTIVIDADES

NOMBRE Y TIPO DE ACTIVIDAD
Identificacin de problemas de navegacin, accesibilidad y usabilidad de pginas web. Actividad de exploracin.

ENUNCIADO DE LA ACTIVIDAD

Visite los siguientes tres sitios web e identifique en ellos problemas de navegacin, acceso y usabilidad. Liste cada una de las
URL visitadas, y explique por qu considera usted que los que ha mencionado constituyen problemas de cada uno de esos
tres ejes.
Por qu la
clasifica
como una
actividad de
este tipo?
Qu se pretende
con la actividad?
(debe hacerse
evidente el
componente
comunicativo)
Qu hace el instructor y qu el aprendiz? Cmo se
realizar el
seguimiento y la
retroalimentaci
n a la actividad?
Espacio
Tiempo y
recursos
Porque a
travs de una
situacin
real, concreta
y simple, el
aprendiz
comprende el
problema de
crear sitios
El aprendiz explora
la navegacin y el
acceso a diferentes
pginas web y de
manera prctica,
identifica errores
que a su juicio,
constituyen errores
que se deben
Instructor
Visita los vnculos que
ha mencionado al
aprendiz y hace
pruebas para verificar
la existencia de
posibles errores.
Aprendiz
Visita los vnculos
sugeridos buscando sitios
web con los que a su juicio
considera, existen
problemas de navegacin,
usabilidad y accesibilidad.
Reflexiona sobre la causa
El docente,
mediante ejemplos
de pginas
similares, seala
problemas
comunes, pero no
hace explcita la
causa del
problema, pues
Internet.
Duracin
de la
actividad: 2
horas.
Recursos:
Computado
r con
JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
web
accesibles,
usables y
navegables,
y expresa sus
conocimiento
s previos al
respecto.
evitar al momento
de disear sitios
web.
Como resultado,
produce un
documento en el
que se expone de
manera
argumentativa la
eleccin de dichas
pginas con sus
correspondientes
errores
encontrados.



de esos inconvenientes.
Produce un texto
argumentando la eleccin
de dichos sitios.
Los recursos a visitar son
Recurso1:
Million dollar page:
http://www.milliondollarho
mepage.com/
Recurso 2:
El peor sitio web:
http://www.theworldswors
twebsiteever.com/
Recurso 3:
Centro de estudios visuales
avanzados:
http://cavs.mit.edu/

eso ser tema de
la segunda
actividad.
acceso a
Internet.


JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin

NOMBRE Y TIPO DE ACTIVIDAD

Identificacin de etiquetas HTML. Actividad de reformulacin.

ENUNCIADO DE LA ACTIVIDAD

Basado en el documento titulado Curso completo de HTML, identifique las etiquetas HTML que estn mal utilizadas en cada uno de esos sitio
y las socializa a los dems miembros del grupo.
Por qu
la clasifica
como una
actividad
de este
tipo?
Qu se
pretende con
la actividad?
(debe hacerse
evidente el
componente
comunicativo)
Qu hace el instructor y qu el aprendiz? Cmo se
realizar el
seguimiento y la
retroalimentacin
a la actividad?
Espacio
Tiempo y
recursos
Porque se
incluyen las
etiquetas de
uso
frecuente
en HTML
como
variables
que
posibilitan
la
construccin
El aprendiz
mediante una
comprensin
lectora,
identifica las
etiquetas html
que estn mal
usadas en los
sitios web
anteriormente
mencionados.
Instructor
Revisa las etiquetas
mencionadas por el
aprendiz y en los
casos necesarios,
remite a referentes
sintxicos de
ejemplos similares,
sin corregir
directamente el
Aprendiz
Incialmente, el aprendiz realiza la lectura del
documento Curso completo de HTML.

Recurso 4:
Curso completo de HTML:
http://es.tldp.org/Manuales-LuCAS/doc-curso-
html/doc-curso-html.pdf
Se socializa con los
dems compaeros
del grupo y se pide
que se diga si estn
o no de acuerdo.
Se usa
coevaluacin como
eje primordial.
Internet.
Duracin d
la actividad
2 horas.
Recursos:
Computado
con acces
a Internet.
Lectura:
Etiquetas
JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
de sitios
web
accesibles,
usables y
navegables.

La prctica de
la lectura
desarrolla la
capacidad de
observacin,
atencin,
concentracin,
anlisis y
espritu crtico,
adems de
generar
reflexin y
dilogo con
otros pares.

Adicionalmente,
se comunica y
fundamenta
con claridad,
sus opiniones y
experiencias
sobre el
problema
planteado.

cdigo. Luego saca el cdigo html de las pginas visitadas
en la actividad anterior para poder desarrollar la
actividad de correccin.
Recurso 5:
Video: Cmo sacar el cdigo de una pgina web:
https://www.youtube.com/watch?v=yYrWnHdjW6g



de us
frecuente
en HTML

JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin

NOMBRE Y TIPO DE ACTIVIDAD

Correccin de etiquetas HTML. Actividad de sntesis.

ENUNCIADO DE LA ACTIVIDAD

A partir de las etiquetas que estn mal utilizadas y que han identificado en la actividad anterior, debern corregirlas de forma
que se solucionen los problemas identificados en la primera actividad. Finalmente el aprendiz produce un documento en el que
se d cuenta del uso adecuado de cada una de las etiquetas HTML empleadas.
Por qu la
clasifica
como una
actividad
de este
tipo?
Qu se
pretende con
la actividad?
(debe
hacerse
evidente el
componente
comunicativo
)
Qu hace el instructor y qu el aprendiz? Cmo se
realizar el
seguimiento y la
retroalimentaci
n a la actividad?
Espacio
Tiempo y
recursos
JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
Porque
mediante la
correccin
de las
etiquetas
que estn
mal
utilizadas, se
logra
comprender
y estructurar
una pgina
web a partir
de etiquetas
y
contenedore
s claramente
definidos.
El aprendiz
produce cdigo
limpio que d
respuesta a los
problemas
identificados en
las actividades
anteriores.
Como
resultado,
produce un
documento en
el que explique
el uso correcto
de las etiquetas
corregidas en
la actividad.
Para ello,
escribe con un
propsito claro,
mientras
proporciona
informacin
para aclarar las
relaciones
entre las
etiquetas html
y los problemas
identificados.
Instructor
Revisa el
cdigo
modificado
del aprendiz
y hace las
correcciones
puntuales en
los casos en
que sea
necesario.
Retroaliment
a el
documento
producido
con las
observacione
s pertinentes.
Aprendiz
Modifica el cdigo html de forma que se
corrijan los errores anteriormente
identificados.

Para probar que el cdigo funcione
correctamente, visita el editor online de
cdigo html:
Recurso 6:
Editor online de html en tiempo real:
http://htmledit.squarefree.com/
Para hacer las pruebas de Accesibilidad y
usabilidad de los sitios, se basa en el
siguiente recurso:
Recurso 7:
Presentacin Prezi sobre accesibilidad y
usabilidad de sitios Web.
http://prezi.com/suy8vxl7ctml/usabilidad-
y-accesibilidad-de-sitios-web/

Puede aprovechar el tiempo desarrollando
otras actividades escuchando podcast
sobre el diseo web y errores que puede
Se hace correccin
directa del cdigo,
se sealan los
inconvenientes
encontrados y se
adelanta a
identificar
problemas que se
pueden repetir en
la actividad
siguiente. Se trata
de una evaluacin
propiamente.
Internet.
Duracin de
la
actividad: 2
horas.
Recursos:
Computado
r con
acceso a
Internet.
Software:
Editor de
texto.
JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
evitar visitando el siguiente recurso.
Recurso 8:
Tipo de recurso: Podcast.
http://apuntesalmargen.com/podcasts.htm
l

JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin

NOMBRE Y TIPO DE ACTIVIDAD

Creacin de una pgina web. Actividad de aplicacin.

ENUNCIADO DE LA ACTIVIDAD

Disee una pgina web teniendo en cuenta las estructuras y etiquetas HTML necesarias para que sea accesible, usable y navegable.
Por qu la
clasifica
como una
actividad de
este tipo?
Qu se
pretende con
la actividad?
(debe hacerse
evidente el
componente
comunicativo)
Qu hace el instructor y qu el aprendiz? Cmo se
realizar el
seguimiento y la
retroalimentacin
a la actividad?
Espacio
Tiempo y
recursos
Porque
mediante una
situacin real
compleja, se
aplican los
conocimientos
de etiquetas
HTML que
permiten que
un sitio web
sea accesible,
usable y
El aprendiz
disea un sitio
web con
criterios de
accesibilidad,
usabilidad y
navegabilidad y
lo presenta a
los dems
miembros del
grupo. El
aprendiz que
Instructor
El instructor
escucha todos los
comentarios
suscitados y al final
hace una
retroalimentacin
general de la
actividad, en la que
se exponen los
problemas ms
Aprendiz
El aprendiz que presenta el sitio web lo disea y
lo expone de forma oral.
Los dems aprendices evalan la accesibilidad,
navegabilidad y usabilidad del sitio web
presentado.
Para crear la pgina web con el editor de notas,
puede usar el siguiente recurso:
El docente
retroalimenta de
manera general a
todo el grupo los
errores ms
frecuentes que se
han visto en el
desarrollo de la
actividad y se invita
a cada uno de los
expositores a que
hagan un
Internet.
Duracin de
la actividad
2 horas.
Recursos:
Computador
con acceso
a Internet.

JUANCARLOSCAMACHOVEGA
AprendizcursovirtualdeAsesoradelusodelasTICenlaformacin
navegable. presenta debe
tener una
sntesis
reflexiva de lo
expuesto. Los
dems
demuestran
pensamiento
crtico frente a
lo planteado.
frecuentes en los
sitios presentados.
Recurso 9:
Tipo de recurso: video
https://www.youtube.com/watch?v=qojd2NA5sI4

Finalmente, para validar la accesibilidad y
usabilidad de las pginas web de los compaeros,
debe revisar el documento, fallos que no debes
cometer en los sitios web:

Recurso 10:
Tipo de recurso: Documento Scribd
http://es.scribd.com/doc/54394600/7349296-
Fallos-Que-No-Debes-Cometer-en-Tus-Pagina

diagnstico de la
misma. Se trata de
una evaluacin por
parte del docente,
coevaluacin por
parte de los dems
miembros del
grupo, y
autoevaluacin por
parte del expositor.