Tecnologias-4-detras-sitio-web

Vista previa del material en texto

¿Qué hay detrás 
de un sitio web?
Formación General del Ciclo Orientado
Tecnologías de la
Información
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
2
Jefe de Gobierno
Horacio Rodríguez Larreta
Ministra de educación e innovación
María Soledad Acuña
subsecretario de PlaneaMiento educativo, ciencia y tecnoloGía
Diego Javier Meiriño
directora General de PlaneaMiento educativo
María Constanza Ortiz
Gerente oPerativo de currículuM
Javier Simón
subsecretario de ciudad inteliGente y tecnoloGía educativa
Santiago Andrés
directora General de educación diGital 
Mercedes Werner
Gerente oPerativo de tecnoloGía e innovación educativa 
Roberto Tassi 
subsecretaria de coordinación PedaGóGica y equidad educativa
Andrea Fernanda Bruzos Bouchet
subsecretario de carrera docente y forMación técnica Profesional
Jorge Javier Tarulla
subsecretario de Gestión econóMico financiera y adMinistración de recursos
Sebastián Tomaghelli
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
3
Subsecretaría de Planeamiento Educativo, Ciencia y Tecnología (SSPECT)
Dirección General de Planeamiento Educativo (DGPLEDU)
Gerencia Operativa de Currículum (GOC)
Javier Simón
Equipo de generalistas de Nivel Secundario: Bettina Bregman (coordinación), Cecilia Bernardi, 
Ana Campelo, Cecilia García, Julieta Jakubowicz, Marta Libedinsky, Carolina Lifschitz, Julieta Santos
Especialista: Sebastián Frydman
Subsecretaría de Ciudad Inteligente y Tecnología Educativa (SSCITE) 
Dirección General de Educación Digital (DGED) 
Gerencia Operativa de Tecnología e Innovación Educativa (INTEC) 
Roberto Tassi
Especialistas de Educación Digital: Julia Campos (coordinación), Josefina Gutiérrez
Equipo Editorial de Materiales Digitales (DGPLEDU)
Coordinación general de materiales digitales: Mariana Rodríguez 
Coordinación editorial: Silvia Saucedo 
Colaboración y gestión editorial: Manuela Luzzani Ovide
 
Edición y corrección: Marta Lacour 
Corrección de estilo: Ana Premuzic 
Diseño gráfico y desarrollo digital: Alejandra Mosconi
© Copyright © 2019 Adobe Systems Software. Todos los derechos reservados. 
Adobe, el logo de Adobe, Acrobat y el logo de Acrobat son marcas registradas de Adobe Systems Incorporated. 
ISBN 978-987-673-507-0
Se autoriza la reproducción y difusión de este material para fines educativos u otros fines no comerciales, siempre que se especifique claramente la fuente. 
Se prohíbe la reproducción de este material para reventa u otros fines comerciales.
Las denominaciones empleadas en este material y la forma en que aparecen presentados los datos que contiene no implican, de parte del Ministerio de Educación e 
Innovación del Gobierno de la Ciudad Autónoma de Buenos Aires, juicio alguno sobre la condición jurídica o nivel de desarrollo de los países, territorios, ciudades o 
zonas, o de sus autoridades, ni respecto de la delimitación de sus fronteras o límites.
La mención de empresas o productos de fabricantes en particular, estén o no patentados, no implica que el Ministerio de Educación e Innovación del 
Gobierno de la Ciudad Autónoma de Buenos Aires los apruebe o recomiende de preferencia a otros de naturaleza similar que no se mencionan.
Fecha de consulta de imágenes, videos, textos y otros recursos digitales disponibles en Internet: 15 de agosto de 2019.
© Gobierno de la Ciudad Autónoma de Buenos Aires / Ministerio de Educación e Innovación / Subsecretaría de Planeamiento Educativo, Ciencia y Tecnología. 
Dirección General de Planeamiento Educativo / Gerencia Operativa de Currículum, 2019. 
Holmberg 2548/96, 2.° piso–C1430DOV–Ciudad Autónoma de Buenos Aires.
Gobierno de la Ciudad de Buenos Aires
 Tecnologías de la Información : ¿Qué hay detrás de un sitio web? : 4 año / dirigido por 
María Constanza Ortiz. - 1a edición para el profesor - Ciudad Autónoma de Buenos Aires : 
Gobierno de la Ciudad de Buenos Aires. Ministerio de Educación e Innovación, 2019.
 Libro digital, PDF - (Profundización NES)
 Archivo Digital: descarga y online
 ISBN 978-987-673-507-0
 1. Educación Secundaria. 2. Tecnología de la Información. I. Ortiz, María Constanza , dir. 
II. Título
 CDD 005
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
4
Presentación
La serie Profundización de la NES presenta distintas propuestas de enseñan za que ponen 
en juego los contenidos (conceptos, habilidades, capacidades, prácticas, valores y actitu-
des) definidos en el Diseño Curricular de la Formación General y la Formación Específica del 
Ciclo Orientado del Bachillerato de la Nueva Escuela Secundaria de la Ciudad Autónoma 
de Buenos Aires, en el marco de la Resolución N.° 321/MEGC/2015. Estos materiales 
despliegan, además, nuevas formas de organizar los espacios, los tiempos y las modalidades 
de enseñanza. 
Las propuestas de esta serie se corresponden, por otra parte, con las características 
y las modalidades de trabajo pedagógico señaladas en el documento Orientaciones para 
la Organización Pedagógica e Institucional de la Educación Obligatoria, aprobado por la 
Resolución CFE N.° 93/09, que establece el propósito de fortalecer la organización y la 
propuesta educativa de las escuelas de nivel secundario de todo el país. A esta norma, actual-
mente vigente y retomada a nivel federal por la “Secundaria 2030”, se agrega el documento 
MOA - Marco de Organización de los Aprendizajes para la Educación Obligatoria Argentina, 
aprobado por la Resolución CFE N.° 330/17, que plantea la necesidad de instalar dis tintos 
modos de apropiación de los saberes que den lugar a nuevas formas de enseñanza, de orga-
nización del trabajo docente y del uso de los recursos y los ambientes de aprendizaje. Se 
promueven también diversas modalidades de organización institucional, un uso flexible de 
los espacios y de los tiempos y nuevas formas de agrupamiento de las y los estudiantes, que 
se traduzcan en talleres, proyectos, articulación entre materias, experiencias formativas y 
debates, entre otras actividades, en las que participen estudiantes de diferentes años. En el 
ámbito de la Ciudad, el Diseño Curricular de la Nueva Escuela Secundaria incorpora temáti-
cas emergentes y abre la puerta para que en la escuela se traten problemá ticas actuales de 
significatividad social y personal para la población joven. 
Existe acuerdo sobre la magnitud de los cambios que demanda el nivel secundario para 
lograr incluir al conjunto de estudiantes, y promover los aprendizajes necesarios para el 
ejercicio de una ciudadanía responsable y la participación activa en ám bitos laborales y de 
formación. Si bien se ha recorrido un importante camino en este sentido, es indispensable 
profundizar, extender e incorporar propuestas que hagan de la escuela un lugar convocante 
y que ofrezcan, además, reales oportunidades de aprendizaje. Por lo tanto, siguen siendo 
desafíos: 
 • Planificar y ofrecer experiencias de aprendizaje en formatos diversos. 
 • Propiciar el trabajo compartido entre docentes de una o diferentes áreas, que promueva 
la integración de contenidos. 
 • Elaborar propuestas que incorporen oportunidades para el aprendizaje y el desarrollo de 
capacidades. 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
5
Los materiales desarrollados están destinados a docentes y presentan sugerencias, criterios 
y aportes para la planificación y el despliegue de las tareas de enseñanzay de evaluación. Se 
incluyen también ejemplos de actividades y experiencias de aprendizaje para estudiantes. 
Las secuencias han sido diseñadas para admitir un uso flexible y versátil de acuerdo con las 
diferentes reali dades y situaciones institucionales. Pueden asumir distintas funciones den-
tro de una propuesta de enseñanza: explicar, narrar, ilustrar, desarrollar, interrogar, ampliar 
y sistematizar los contenidos; así como ofrecer una primera aproximación a una temática, 
formular dudas e interrogantes, plantear un esquema conceptual a partir del cual profun-
dizar, proponer actividades de exploración e indagación, facilitar oportunidades de revisión, 
contribuir a la integración y a la comprensión, habilitar instancias de aplicación en contextos 
novedo sos e invitar a imaginar nuevos escenarios y desafíos. Esto supone que, en algunos 
casos, se podrá adoptar la secuencia completa, y, en otros, seleccionar las partes que se 
consideren más con venientes. Asimismo, se podrá plantear un trabajo de mayor articula-
ción o exigencia de acuerdos entre docentes, puesto que serán los equipos de profesores 
y profesoras quienes elaborarán propuestas didácticas en las que el uso de estos materiales 
cobre sentido.
En esta ocasión se presentan secuencias didácticas destinadas al Ciclo Orientado de la 
NES, que comprende la formación general y la formación específica que responde a cada 
una de las orientaciones adoptadas por la Ciudad. En continuidad con lo iniciado en el Ciclo 
Básico, la formación general se destina al conjunto de estudiantes, con independencia de 
cada orientación, y procura consolidar los saberes generales y conocimientos vinculados 
al ejercicio responsable, crítico e informado de la ciudadanía y al desarrollo integral de las 
personas. La formación específica, por su parte, comprende unidades diversificadas, como 
introducción progresiva a un campo de conocimientos y de prácticas específico para cada 
orientación. El valor de la apropiación de este tipo de conocimientos reside no solo en la 
aproximación a conceptos y principios propios de un campo del saber, sino también en el 
desarrollo de hábitos de pensamiento riguroso y formas de indagación y análisis aplicables a 
diversos contextos y situaciones. 
Para cada orientación, la formación específica presenta los contenidos organizados en blo-
ques y ejes. Los bloques constituyen un modo de sistematizar, organizar y agrupar los con-
tenidos, que, a su vez, se recuperan y especifican en cada uno de los ejes. Las propuestas 
didácticas de esta serie abordan contenidos de uno o más bloques, e indican cuál de las 
alternativas curriculares propuestas en el diseño curricular vigente y definida institucional-
mente resulta más apropiada para su desarrollo.
Los materiales presentados para el Ciclo Orientado dan continuidad a las secuencias didác-
ticas desarrolladas para el Ciclo Básico. El lugar otorgado al abordaje de problemas com-
plejos procura contri buir al desarrollo del pensamiento crítico y de la argumentación desde 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
6
perspectivas prove nientes de distintas disciplinas. Se trata de propuestas alineadas con la 
formación de acto res sociales conscientes de que las conductas colectivas e individua-
les tienen efectos en un mundo interdependiente. El énfasis puesto en el aprendizaje de 
capacidades responde a la necesidad de brindar experiencias y herramientas que permitan 
comprender, dar sentido y hacer uso de la gran cantidad de información que, a diferencia 
de otras épocas, está disponible y es fácilmente accesible para todas las personas. Las capa-
cidades constituyen un tipo de contenidos que debe ser objeto de enseñanza sistemática. 
Para ello, la escuela tiene que ofrecer múltiples y variadas oportunidades, de manera que las 
y los estudiantes las desarrollen y consoliden. 
En esta serie de materiales también se retoman y profundizan estrategias de aprendizaje 
planteadas para el Ciclo Básico y se avanza en la propuesta de otras nuevas, que respondan 
a las características del Ciclo Orientado y de cada campo de conocimiento: instancias de 
investigación y de producción, desarrollo de argumentaciones fundamentadas, trabajo con 
fuentes diversas, elaboración de producciones de sistematización de lo realizado, lectura de 
textos de mayor complejidad, entre otras. Su abordaje requiere una mayor autonomía, así 
como la posibilidad de comprometerse en la toma de decisiones, pensar cursos de acción, 
diseñar y desarrollar proyectos. 
Las secuencias involucran diversos niveles de acompañamiento e instancias de reflexión 
sobre el propio aprendizaje, a fin de habilitar y favorecer distintas modalidades de acceso a 
los saberes y los conocimientos y una mayor inclusión.
Continuamos el recorrido iniciado y confiamos en que constituirá un aporte para el trabajo 
cotidiano. Como toda serie en construcción, seguirá incorporando y poniendo a disposición 
de las escuelas de la Ciudad nuevas propuestas, que darán lugar a nuevas experiencias y 
aprendizajes.
María Constanza Ortiz
Directora General de Planeamiento Educativo 
Javier Simón
Gerente Operativo de Currículum
perspectivas prove nientes de distintas disciplinas. Se trata de propuestas alineadas con la 
formación de acto res sociales conscientes de que las conductas colectivas e individua-
les tienen efectos en un mundo interdependiente. El énfasis puesto en el aprendizaje de 
capacidades responde a la necesidad de brindar experiencias y herramientas que permitan 
comprender, dar sentido y hacer uso de la gran cantidad de información que, a diferencia 
de otras épocas, está disponible y es fácilmente accesible para todas las personas. Las capa-
cidades constituyen un tipo de contenidos que debe ser objeto de enseñanza sistemática. 
Para ello, la escuela tiene que ofrecer múltiples y variadas oportunidades, de manera que las 
y los estudiantes las desarrollen y consoliden. 
En esta serie de materiales también se retoman y profundizan estrategias de aprendizaje 
planteadas para el Ciclo Básico y se avanza en la propuesta de otras nuevas, que respondan 
a las características del Ciclo Orientado y de cada campo de conocimiento: instancias de 
investigación y de producción, desarrollo de argumentaciones fundamentadas, trabajo con 
fuentes diversas, elaboración de producciones de sistematización de lo realizado, lectura de 
textos de mayor complejidad, entre otras. Su abordaje requiere una mayor autonomía, así 
como la posibilidad de comprometerse en la toma de decisiones, pensar cursos de acción, 
diseñar y desarrollar proyectos. 
Las secuencias involucran diversos niveles de acompañamiento e instancias de reflexión 
sobre el propio aprendizaje, a fin de habilitar y favorecer distintas modalidades de acceso a 
los saberes y los conocimientos y una mayor inclusión.
Continuamos el recorrido iniciado y confiamos en que constituirá un aporte para el trabajo 
cotidiano. Como toda serie en construcción, seguirá incorporando y poniendo a disposición 
de las escuelas de la Ciudad nuevas propuestas, que darán lugar a nuevas experiencias y 
aprendizajes.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
7
Indica apartados con orientaciones 
para la evaluación.
¿Cómo se navegan los textos de esta serie?
Al cliquear regresa a la 
última página vista.
Ícono que permite imprimir.
Folio, con flechas interactivas que llevan a la página anterior y a la página posterior.
Pie de página
Íconos y enlaces
El color azul y el subrayado indican un vínculo 
a un sitio/página web o a una actividado anexo 
interno del documento.
Los materiales de la serie de Profundización de la NES cuentan con elementos interactivos 
que permiten la lectura hipertextual y optimizan la navegación. 
Para visualizar correctamente la interactividad se sugiere bajar 
el programa Adobe Acrobat Reader que constituye el estándar 
gratuito para ver e imprimir documentos PDF.
Adobe Reader Copyright © 2019. 
Todos los derechos reservados.
Plaquetas que indican los apartados 
principales de la propuesta.
Índice interactivo Itinerario de actividades
Organizador interactivo que presenta la secuencia completa de 
actividades.
ActividadesNotas al final
1 Símbolo que indica una nota. Al cliquear se 
direcciona al listado final de notas.
¿Por qué internet es conocida como la “red de redes”?
Introducir cómo circula la información a través de sitios web. Conocer la infraestructura de 
telecomunicaciones de internet. 
 
 
 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://get.adobe.com/reader/?loc=es
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
8
Índice interactivo
Introducción
Contenidos, objetivos de aprendizaje y capacidades
Itinerario de actividades
Orientaciones didácticas y actividades
Orientaciones para la evaluación
Bibliografía
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
9
Introducción
Se destacan en esta propuesta dos aspectos claves de la información en internet. Por un 
lado, se pretende que los/las estudiantes conozcan la infraestructura de las redes de comu-
nicaciones sobre la cual se establece la red de redes (internet), así como el modo en que 
se accede a la información presente en los sitios web alojados en servidores de ubicacio-
nes remotas. Por otro lado, se espera que comprendan el carácter público del acceso a la 
gran mayoría de sitios web y lo contrasten con los límites del carácter privado que adquie-
ren nuestras interacciones y datos en la web. Se propone analizar el problema que puede 
significar el registro, adquisición y monetización de datos e interacciones de usuarios por 
las grandes empresas tecnológicas (Google, Facebook, Amazon, Microsoft, etcétera). Al 
trabajar con una temática que, seguramente, resulte cercana a los/las estudiantes, cobra 
especial relevancia la dimensión de la ciudadanía digital y, en consecuencia, el propósito de 
desarrollar un uso responsable y cuidadoso en lo que refiere a los datos e interacciones que 
realizan en la web, con énfasis en aspectos vinculados al cuidado de su perfil y de su identi-
dad digital. A la vez, se trata de abordar aspectos de internet que no se manifiestan en el uso 
cotidiano, ya sea porque son desconocidos para los usuarios o porque están naturalizados. 
En este sentido, se aspira a trabajar cuestiones centrales vinculadas al acceso a la información. 
Por ejemplo, cómo las empresas líderes del sector de las telecomunicaciones en el campo de 
las búsquedas en la web permiten filtrar potenciales destinatarios de la información deseada 
de acuerdo a diferentes criterios. Desde esta perspectiva, una de las cuestiones centrales para 
analizar es cómo se determinan los perfiles de usuario mediante la selección de indicadores 
tales como la edad, la ubicación, las palabras de búsqueda utilizadas, etcétera. Es esperable 
que el análisis se focalice en el modo en que se adquiere la información que se desea, en un 
contexto donde los motores de búsqueda operan con nuestras preferencias.
La secuencia está dividida en dos partes. En la primera se propone desarrollar algunas capa-
cidades ligadas al diseño y al desarrollo de sitios web, a la vez que se profundiza el conoci-
miento y el análisis sobre la estructura que posibilita la articulación de internet como una 
gran red de redes. La segunda permite analizar cómo las interacciones en internet pueden 
facilitar la búsqueda de un público objetivo para quienes necesitan publicitar o difundir sitios 
web, en la medida en que dichos datos resultan insumo para elaborar estrategias y análisis 
de potenciales audiencias. La secuencia finaliza con la elaboración de un sitio web como 
producción que integra los contenidos vistos en ambas partes.
Se recomienda referenciar a los contenidos abordados en “Telecomunicaciones en 
Educación Tecnológica”, de 2.o año, en virtud de lo analizado sobre medios y estructu-
ras de los sistemas de comunicaciones. Para ello, se sugiere relacionar con el material 
“¿Cómo viaja la información? Cambios y continuidades en la comunicación a distancia”, de la 
serie Profundización de la NES. 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.buenosaires.gob.ar/sites/gcaba/files/profnes_ed_tecnologica_-_como_viaja_la_informacion_-_docentes_-_final.pdf
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
10
Contenidos, objetivos de aprendizaje y capacidades
Ejes/Contenidos Objetivos de aprendizaje Capacidades
Diseño de páginas web
• Principios del diseño gráfico y de la 
comunicación visual.
• Creación y desarrollo de 
aplicaciones para internet.
Internet y web
• Introducción a las redes digitales de 
información. Internet como red de 
redes.
• La web como sistema hipermedial 
de información distribuida.
• Diseñar aplicaciones para internet 
mediante técnicas de diseño gráfico, 
comunicación audiovisual y lenguajes 
de marcado hipertextual.
• Reconocer la interacción de los 
sistemas digitales a través de las 
redes de comunicaciones y sus 
potencialidades y aplicaciones.
• Reconocer pautas de cuidado y 
responsabilidad en el uso de las TIC.
• Resolución de problemas.
• Pensamiento crítico.
• Creatividad.
• Trabajo colaborativo.
Educación Digital
Desde Educación Digital se propone que los/las estudiantes puedan desarrollar las com-
petencias necesarias para un uso crítico, criterioso y significativo de las tecnologías digi-
tales. Para ello –y según lo planteado en el “Marco para la Educación Digital” del Diseño 
Curricular de la NES– es preciso pensarlas en tanto recursos disponibles para potenciar los 
procesos de aprendizaje en forma articulada, contextualizada y transversal a los diferentes 
campos de conocimiento.
En esta propuesta se fomenta el desarrollo de la alfabetización digital, a partir de instancias 
que promueven la creación de contenidos en diferentes formatos enriquecidos y lenguajes 
propios de la cultura digital.
Competencias digitales Alcance
• Habilidad para buscar y seleccionar 
información.
• Búsqueda, selección, evaluación, organización, producción y 
apropiación de información, de modo crítico y creativo, para 
construir conocimiento.
• Comunicación efectiva. • Comunicarse con otras personas a través de las TIC, de forma 
clara y adecuada a los propósitos comunicativos, el contexto y las 
características de los interlocutores.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.buenosaires.gob.ar/areas/educacion/nes/pdf/2014/discurric/capitulo-04.pdf
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
11
¿Por qué internet es conocida como la “red de redes”?
Introducir cómo circula la información a través de sitios web. Conocer la infraestructura de 
telecomunicaciones de internet. 
Actividad 1
Sitios web accesibles y usables
Analizar la estructura de un sitio web, con una mirada centrada en el usuario. 
Actividad 2
Tecnologías web para la creaciónde un sitio
Plantear un desafío de diseño. Diseñar y codificar un sitio web utilizando plantillas.
Actividad 3
Itinerario de actividades
Primera parte
Segunda parte
¿Cómo buscamos en internet?
Comprender el valor de las interacciones en internet y cómo la información generada se 
almacena en servidores de terceros para monetizar.
Actividad 4
Análisis de los usuarios en internet
Relevar información acerca de los hábitos y criterios de búsqueda de los usuarios en internet.
Actividad 5
Diseño y desarrollo de un proyecto web
Construir un sitio web informativo donde se incorporará la investigación desarrollada.
Actividad 6
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
12
Orientaciones didácticas y actividades
Se presenta en este apartado la secuencia de actividades propuesta, junto con las consignas 
de trabajo para estudiantes y las orientaciones didácticas para docentes.
Primera parte
Actividad 1. ¿Por qué internet es conocida como la “red de redes”?
En esta actividad se aspira a que los/las estudiantes comprendan qué es internet, no solo a 
partir de lo que conocen como usuarios/as, sino también desde dos perspectivas distintas: 
por un lado, internet como una red de interconexión física conocida como la “red de redes”, 
con cables submarinos que interconectan puntos distantes; por el otro, como el espacio en 
el que se comparten producciones e informaciones, es decir, desde la mirada de quienes 
producen y aportan contenido a la red. 
Para esta actividad, se estima una duración de dos clases.
 Actividad 1 ¿Por qué internet es conocida como la “red de redes”?
A la hora de pensar en internet, se suele pensar únicamente en los consumos de informa-
ción que se realizan (por ejemplo, ver videos, acceder a redes sociales, chatear con amigos/as). 
Pocas veces surgen interrogantes acerca de qué es internet y por qué se la conoce como 
la “red de redes”.
En estas imágenes podemos ver la interconexión global que representa internet, y 
su implicancia en diversas actividades de la vida cotidiana.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
13
a. Vean los videos “Andrew Blum: ¿Qué es Internet realmente?”, en TED Ideas worth spreading, y 
“Cómo funciona internet: los cables submarinos que conectan al mundo”, en el canal Un 
mundo inmenso, y respondan: 
• ¿Cómo se compone la parte “física” de la red de internet?
• ¿Cómo viaja la información en ella?
• ¿Cómo se comunican puntos distantes en diversos continentes?
• ¿Quiénes son los dueños de los cables submarinos?
b. Accedan al mapa “Submarine Cable Map” (Mapa de cables submarinos), del sitio 
Telegeography, y tomen nota de aquellos puntos con los que está conectada Argentina de 
forma física. 
c. Lean las siguientes notas acerca del acceso a la información en internet:
• “De Las Toninas al mundo: cómo funciona el sistema que conecta a internet a toda la 
Argentina”, en Infobae, 2 de agosto de 2017.
• “Google extenderá un cable submarino para mejorar la disponibilidad de sus servicios en 
Argentina” en Infobae, 28 de junio de 2019.
• “Internet y la web no son lo mismo, te explicamos por qué”, en Blogthinkbig, 7 de agosto 
de 2014.
• “¿Qué es Internet?”, en el sitio NIC Argentina, mayo de 2018.
A partir de lo leído, resuelvan el desafío "La información en internet" en la plataforma 
Educaplay.
d. Cuando acceden a sitios web para buscar información, lo hacen desde el rol de usuarios/as. 
Investiguen qué se requiere para poder generar un sitio web y que esté disponible en inter-
net. Pueden guiarse por las siguientes preguntas:
• ¿Se necesita crear o tener nombre de usuario/a?
• ¿Dónde se aloja la información?
• ¿Qué tecnologías y servicios se usan para guardar los datos?
• ¿Tiene algún costo?
• ¿Los servidores son iguales a las computadoras hogareñas?
Para realizar la búsqueda, será importante que establezcan ciertos criterios, por ejemplo: 
¿En qué sitios buscarán? Si trabajan con un buscador, ¿qué palabras clave o filtros de bús-
queda utilizarán? ¿Cómo evaluarán la fiabilidad de los sitios consultados? En este sentido, 
pueden ser de utilidad el tutorial “¿Cómo hago para validar una página Web?” y el tutorial 
“¿Cómo hago para verificar si la información en una página web está actualizada?”, disponi-
bles en el Campus Virtual de Educación Digital. 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.ted.com/talks/andrew_blum_what_is_the_internet_really?language=es#t-693110
https://www.youtube.com/watch?v=u1xxZ8r2rRc
https://www.submarinecablemap.com/
https://www.infobae.com/tecno/2017/08/02/las-toninas-como-funciona-el-sistema-que-conecta-a-internet-a-toda-la-argentina/
https://www.infobae.com/tecno/2017/08/02/las-toninas-como-funciona-el-sistema-que-conecta-a-internet-a-toda-la-argentina/
https://www.infobae.com/america/tecno/2019/06/28/google-extendera-un-cable-submarino-para-mejorar-la-disponibilidad-de-sus-servicios-en-argentina/
https://www.infobae.com/america/tecno/2019/06/28/google-extendera-un-cable-submarino-para-mejorar-la-disponibilidad-de-sus-servicios-en-argentina/
https://blogthinkbig.com/internet-y-la-web
https://nic.ar/es/enterate/novedades/que-es-internet
https://es.educaplay.com/recursos-educativos/4697195-internet_la_red_de_redes.html
https://campusvirtualintec.buenosaires.gob.ar/course/view.php?id=443
https://campusvirtualintec.buenosaires.gob.ar/course/view.php?id=444
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
14
e. Observen el video “Diseño Web. Lo básico para programar webs”, en el canal ULLmedia 
– Universidad de La Laguna, para comprender qué se requiere para comenzar a diseñar y 
desarrollar un sitio web.
Antes de comenzar la actividad —es decir, antes de que vean los videos—, se sugiere plan-
tear el debate acerca de qué es internet para estimular el despliegue de ideas sobre cómo 
circula allí la información. Es probable que la mayoría de los/las estudiantes asocien el cir-
cuito de las comunicaciones digitales con satélites. La actividad propone contrastar ideas 
e hipótesis con información, considerando que, en realidad, aproximadamente el 97% del 
tráfico de datos circula por cables submarinos.
En el siguiente gráfico se puede observar un esquema de red con jerarquías. Los/las usua-
rios/as finales reciben servicios provistos por una cadena de transmisión de información 
desde nodos concentradores (Red de Nivel 3) que pasa antes por operadores locales:
En la imagen se puede observar (en la parte inferior) cómo los clientes acceden a la red de internet mediante un esquema jerárquico, 
donde aparecen nodos concentradores y nodos proveedores de servicio de internet (ISP). En la red intervienen diferentes servicios y 
diferentes medios de transmisión (cables telefónicos, cables de red, fibras ópticas, etc.).
Resulta relevante ejemplificar la noción de “red de redes”, tal como menciona la nota 
“¿Qué es Internet?”, en el sitio NIC Argentina, en referencia al trayecto que realiza la 
información desde el dispositivo en el hogar hasta la fuente de la información deseada: 
“Probablemente, la computadora que utilizamos a diario en la oficina esté conectada a una 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
íad
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.youtube.com/watch?v=gdbd6IPm12o
https://nic.ar/es/enterate/novedades/que-es-internet
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
15
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
red de computadoras. En nuestra casa, la computadora portátil, tablet y celulares los vincu-
lamos a un dispositivo inalámbrico [router] que luego se conecta a la red de fibra óptica de 
la empresa que nos brinda servicio de Internet y de televisión por cable o telefonía. Este se 
comunica a la red de otro Proveedor de Servicios de Internet o ISP (por sus siglas en inglés) 
más grande, que llega a un número mayor de hogares y empresas, y así sucesivamente. A 
su vez, estos proveedores de acceso internacional se interconectan con otros más grandes, 
denominados Carriers, a través de fibras ópticas transcontinentales y satélites, entre otros”. 
Esto puede percibirse en la imagen anterior, donde se explicita la noción de red y sus niveles 
jerárquicos de concentración y distribución de la información.
Para completar la información de los videos vistos durante la actividad, se sugieren también 
los siguientes recursos, de considerarse necesarios:
 • “Viaje al interior de un cable submarino”, en Blogthinkbig, 22 de junio de 2018.
 • “La conexión secreta. ¿Cómo y por dónde entra Internet al país?”, en Telenoche, 5 de 
febrero de 2019.
 • “El Mapa Digital - Un millón de kilómetros de cable para conectar al mundo”, en El Mapa 
Digital, 31 de agosto de 2013.
 • “Repetidores ópticos submarinos: así viaja el tráfico de Internet por el océano”, en 
IDGtv, 16 de enero de 2015.
Por otro lado, se espera que los/las estudiantes comprendan que para generar un sitio web 
que sea accesible desde cualquier punto del planeta se debe cumplir con ciertos requisitos:
 • Contar con un dominio o dirección pública (adquisición del dominio). Principalmente se 
realiza en NIC Argentina.
 • Contar con un servidor o una computadora siempre encendida y con conectividad y con 
las protecciones y redundancias necesarias (adquisición del hosting web). Hay servicios 
de hosting gratuitos y pagos. Wix, por ejemplo, brinda de forma gratuita el espacio para 
alojar el sitio, pero con la obligación de tener un dominio que contenga la correspon-
diente referencia a Wix (por ejemplo “www.elnombrequequieras.wixsite.com”); pero si 
se desea que el sitio tenga un dominio específico (sin la mención como “wixsite”), hay 
que abonar. En otros servicios pagos, se requiere crear una cuenta y abonar por el espa-
cio para subir el sitio y que esté disponible en internet.
 • Diseñar y desarrollar el sitio web, ya sea a través de la programación o a través de planti-
llas (codificación del sitio en HTML, CSS y JavaScript u otras tecnologías web). 
 • Alojar dicho sitio web en el espacio de hosting.
 • Indicar a la autoridad competente en lo concerniente a internet (nic.ar) que el sitio (do-
minio web) se va a alojar en determinado hosting. (asignación y delegación de DNS). DNS 
es la sigla de la denominación Domain Name System o Sistema de Nombres de Dominio 
y, además de apuntar los dominios al servidor correspondiente, nos servirá para traducir 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.youtube.com/watch?v=QtGw92sFTWk
https://www.youtube.com/watch?v=mVb6JmsANsU
https://www.youtube.com/watch?v=cQVuJte-1dQ
https://www.youtube.com/watch?v=8m4P0COISEE
https://nic.ar/
https://es.wix.com/
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
16
la dirección real, que es una relación numérica denominada IP, en el nombre del dominio. 
Se le indica a la autoridad nic.ar qué dirección IP tiene el servidor de nombres de dominios 
(DNS) del hosting para que pueda encontrar el sitio y mostrarlo en el navegador. 
Actividad 2. Sitios web accesibles y usables
En esta actividad, se espera que los/las estudiantes comprendan aspectos relevantes de la 
usabilidad y de la accesibilidad web, analicen sus similitudes y diferencias y vean qué cues-
tiones de ambas se tienen en cuenta para el diseño y el desarrollo de sitios inclusivos. En 
ese sentido, resulta conveniente proponerles que observen diferentes sitios web, prestando 
atención a sus componentes, a los niveles de interacción que proponen, y a los aspectos 
vinculados con el diseño y con la comunicación visual. Así, podrán identificar aquellos sitios 
que consideran de su agrado, tomando en cuenta los criterios planteados por Jakob Nielsen 
sobre usabilidad. Podrán proponerse tres criterios generales para analizar esas páginas u 
otras páginas web: la accesibilidad, la navegabilidad y la usabilidad.
Se puede proponer la lectura del apartado “Criterios para organizar el blog”, en 
¿Y si publicamos? Apuntes para la elaboración de publicaciones, colección Hacer para apren-
der, de esta serie, en donde se explican la accesibilidad, la navegabilidad y la encontrabilidad 
(findability) para incorporar otros criterios que permitan ampliar el análisis de los sitios web.
Actividad 2 Sitios web accesibles y usables
a. En la actividad 1 han analizado la infraestructura de internet como red física. A continua-
ción, lean las siguientes notas para conocer cómo se estructuran los sitios web y cómo se 
piensa su diseño de acuerdo a los estándares acordados para generar sitios accesibles e 
inclusivos:
• “¿Qué es una página Web?”, en Concepto.de.
• “Diseño de la estructura de una página web de 0 a 100”, en La webera.es.
• “El árbol web: qué es y para qué sirve”, en Inboudcycle.
b. Observen el video “Usabilidad web: ¿Qué es y qué aporta al usuario? / Masterclass”, en el 
canal INESEM Business School y, de acuerdo a los criterios de Jakob Nielsen, identifiquen 
tres sitios web que ustedes valoren positivamente en relación con su diseño y con la usabi-
lidad, y tres que no. Piensen qué aspectos contribuyen a que esos sitios sean valorados de 
ese modo.
c. Resuelvan el test de usabilidad “Modelo de Test de Usuario”, para el caso del sitio LingCars.
d. Apliquen el mismo test a un caso sugerido por un compañero o una compañera.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://drive.google.com/file/d/1w6D_2FfVlpgMXFzj3FSmAY4XgGB8iu-0/view
https://concepto.de/pagina-web/
https://www.lawebera.es/diseno-web/estructura-de-una-pagina-web-estructura-del-diseno.php#estructura-general-del-diseno-de-una-web
https://www.inboundcycle.com/blog-de-inbound-marketing/bid/195257/el-rbol-web-qu-es-y-para-qu-sirve
https://www.youtube.com/watch?v=Y7nLeu4cY38
https://docs.google.com/document/d/1JxbOhFOBAosQnZWUfFwVoK2nJqsSQxayYWKfot1hjYM/edit?usp=sharing
https://www.lingscars.com/
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
17
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
e. ¿Es lo mismo hablar de usabilidad que de accesibilidad? Observen los videos “Introduction to 
Web Accessibility and W3C Standards” (“Introducción a la accesibilidad Web y a los estándares 
W3C”), en el canal W3C Web Accessibility Initiative (WAI), que cuenta con subtítulos en espa-
ñol, y “¿Cómo sabemos que una página web es accesible para personas con discapacidad?”, en 
el canal Conapred México, y respondan las siguientespreguntas:
• ¿Qué diferencias encuentran entre la usabilidad y la accesibilidad web?
• Testeen, en los siguientes enlaces, algunos de los sitios seleccionados en el punto a., 
para comprobar y realizar el test de accesibilidad (TAW), pensando en sitios que sean 
verdaderamente inclusivos y que respeten los estándares de la W3C WCAG 2.0 con 
sus cuatro criterios principales, de forma que resulten perceptibles, operables, com-
prensibles y robustos:
 - Enlace1: Web accessibility.
 - Enlace 2: Taw.
 - Enlace 3: AChecker.
• Construyan una tabla para explicitar el test de accesibilidad generando una columna 
para cada uno de los criterios mencionados en los videos (uso de textos alternativos, 
contrastes de colores, tamaño del texto, estructura jerárquica de html bien desarro-
llada para lectores de pantalla, entre otros) y una fila para cada sitio web que se anali-
zará. Pueden realizarla en un procesador de textos como Documentos de Google (ver 
el tutorial de Google Docs Documentos en el Campus Virtual de Educación Digital) o 
en una planilla de cálculo (ver el tutorial de Google Drive Hoja de cálculo en el Campus 
Virtual de Educación Digital).
Se sugiere trabajar en conjunto hasta el punto b. haciendo hincapié en los criterios que apa-
recen en el video. A partir del punto c., cada grupo podrá explorar y analizar los sitios que 
haya elegido. Una vez que los grupos hayan realizado el test de usabilidad, se recomienda 
generar el espacio de puesta en común para conversar sobre lo analizado. Se propone el 
mismo enfoque para el punto d..
El/la docente puede ampliar el debate y el análisis de los puntos a., b. y d., mediante la lec-
tura de los siguientes materiales:
 • “Planificación de la Presencia Web Corporativa. Tema 8: Usabilidad web”, de Pedro So-
lana González y Rocío Rocha Blanco, Universidad de Cantabria.
 • W3C: sitio donde se explicitan los estándares web e información relevante.
 • “Web Accessibility Perspectives - Compilation of 10 Topics/Videos” (compilación de 
videos que desarrollan diez aspectos de la accesibilidad web), en el canal W3C Web Ac-
cessibility Initiative (WAI), cuenta con subtítulos en español.. En las opciones de configura-
ción, es posible seleccionar traducción automática al español. 
 • “Introducción a la Accesibilidad Web”, en W3C.Web Accessibility Initiative. 
 • “Introducción a las Pautas de Accesibilidad al Contenido en la Web (WCAG)”, en W3C. 
Web Accessibility Initiative. 
 • Sitio W3C Accessibility Initiative.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.youtube.com/watch?v=20SHvU2PKsM
https://www.youtube.com/watch?v=20SHvU2PKsM
https://www.youtube.com/watch?v=yJcFHhObqmU
https://www.webaccessibility.com/
https://www.tawdis.net/
https://achecker.ca/checker/index.php
https://www.google.com/intl/es_AR/docs/about/
https://campusvirtualintec.buenosaires.gob.ar/course/view.php?id=186
https://campusvirtualintec.buenosaires.gob.ar/course/view.php?id=162
https://ocw.unican.es/pluginfile.php/2763/course/section/2546/Tema 8. Usabilidad Web.pdf
https://www.w3.org/standards/webdesign/
https://www.youtube.com/watch?v=3f31oufqFSM&list=PLhDEeYUfW02QpaXu5mUpMvnLHnczKdKyF
https://www.w3c.es/Traducciones/es/WAI/intro/accessibility
https://www.w3c.es/Traducciones/es/WAI/intro/wcag
https://www.w3.org/WAI/
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
18
Actividad 3. Tecnologías web para la creación de un sitio
En esta actividad, los/las estudiantes realizarán un proyecto desde cero en un entorno de 
desarrollo web, para comprender todos los pasos para generar un prototipo de sitio. Se 
explicarán los lenguajes que lo conforman y cuál es el enfoque orientado a generar páginas 
web que integren lo realizado. Se sugiere el trabajo en equipos de hasta tres integrantes y 
se estima una duración de cuatro clases.
Se propone la exploración de metodologías que hacen uso de editores basados en plantillas 
(WYSIWYG - What You See Is What You Get) y metodologías basadas en lenguajes de 
marcado hipertextual (HTML) y páginas de estilo (CSS), contrastando un mismo ejemplo 
de sitio (o semejante) en ambas plataformas e identificando aspectos positivos y negativos. 
Luego de comparar ambas metodologías, se hará hincapié en el trabajo con lenguajes de 
marcado, proponiendo el diseño de páginas que incorporen elementos interactivos y con-
tenidos dinámicos.
Actividad 3 Tecnologías web para la creación de un sitio
Los sitios web se desarrollan sobre la base de diferentes lenguajes. En esta actividad van 
a empezar a codificar para crear su sitio web desde cero. Trabajarán principalmente con 
tres lenguajes: HTML, CSS y JavaScript. A través de ellos, el sitio web poseerá estruc-
tura, la información se organizará jerárquicamente (títulos, subtítulos, párrafos, imágenes, 
etc.) y contendrá la estética deseada (colores, tipografías, tamaños, separaciones y márge-
nes). A su vez, podrá contar con elementos dinámicos y con movimientos, animaciones o 
interacciones. 
a. Investiguen en grupo acerca de qué tipos de lenguajes son HTML, CSS y JavaScript e indi-
quen para qué sirve cada uno. Armen un muro digital con Padlet para presentar en él esta 
información. Pueden consultar el tutorial de Padlet en el Campus Virtual de Educación 
Digital y tomar como ejemplo base el muro digital en Padlet “Tecnologías para crear un 
sitio web”.
b. Observen los siguientes videos, donde se explica cómo comenzar con cada lenguaje:
• HTML: “¿Qué es HTML y cómo funciona?”, en el canal Platzi, 4 de agosto de 2014 
(hasta el minuto 4:30).
• CSS: “¿Qué es CSS? bien explicado”, en el canal Bitech Studio, 16 de noviembre de 
2017.
• JavaScript: “¿Qué es JavaScript? bien explicado”, en el canal Bitech Studio, 22 de sep-
tiembre de 2016.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://campusvirtualintec.buenosaires.gob.ar/course/view.php?id=254
https://padlet.com/sdfrydman/4d70d005jp99
https://padlet.com/sdfrydman/4d70d005jp99
https://www.youtube.com/watch?v=av_PL4_jz1I
https://www.youtube.com/watch?v=8cSo0ijtkzU
https://www.youtube.com/watch?v=riZbwRFMFuw
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
19
Comenzar a codificar en HTML
c. Para comenzar con HTML, abran Tryit Editor v3.6. Este es un espacio de prueba (no es un 
editor completo), pero les permitirá comenzar a entender este lenguaje.
d. Agreguen una nueva línea con la etiqueta “subtítulo h2” debajo de la línea de “título h1”, y 
presionen “run” para probar el código. Observen el estilo que se aplica automáticamente 
(color y estilo negrita). Modifiquen el contenido de las tres etiquetas para personalizarlo, 
guarden el ejemplo y agréguenlo en el muro de Padlet que crearon en el punto a. bajo la 
columna “proyectos realizados”, con el título “Ejemplo HTML N.º 1”. 
e. Copien el código de su ejemplo en el bloc de notas de su computadora y guárdenlo como 
un archivo llamado “index.html”, que será su sitio principal. Presten atención a la ubicación 
donde guardan el archivo, para poder recuperarlo fácilmente (por ejemplo, pueden crear 
una nueva carpeta en el escritorio o en “Mis Documentos”). Abran el archivo con su nave-
gador para ver el sitio que han creado. 
f. Analicen los siguientes ejemplos en Tryit Editor v3.6 y comparen los diferentes elementos 
que figuran dentro de ellos: 
• Imágenes en HTML
• Creación de botones en HTML
• Lista no numerada
• Agregando links
 ¿Qué atributos han cambiado en cada caso?
g. Exploren la etiqueta “div” e identifiquen para qué sirve.
Aplicar estilo con CSS
h. Observen el ejemplo con la integración de CSS dentro del documento HTML de forma 
embebida, en Tryit Editor v3.6. Próximamente, separarán ambos lenguajes en diferentes 
archivosdel mismo proyecto, incorporando el CSS de forma externa. Apliquen diferentes 
estilos a su ejemplo. 
i. En el siguiente ejemplo, en Tryit Editor v3.6, podrán ver cómo identificar diferentes ele-
mentos de HTML mediante la definición de identificadores y clases. 
j. Este ejemplo, en Tryit Editor v3.6, integra CSS, pero de forma externa al documento 
HTML. Generen su propio archivo CSS externo y apliquen diferentes estilos a su proyecto. 
Para ello, pueden usar cualquiera de los siguientes entornos de desarrollo web: Brackets, 
Sublime Text, Visual Studio Code, Atom, Komodo Edit, bloc de notas, etcétera. Pueden 
encontrar referencias a diferentes propiedades de CSS en el sitio W3schools. Para crear 
un sitio con varias páginas web, deberán generar diferentes archivos con extensión “.html” 
y enlazarlos a través de hipervínculos.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.w3schools.com/code/tryit.asp?filename=G5JN4M63OR1F
https://www.w3schools.com/code/tryit.asp?filename=G5JOO1TWBHCS
https://www.w3schools.com/code/tryit.asp?filename=G5JOPK563VVW
https://www.w3schools.com/code/tryit.asp?filename=G5JOT3PVYGF7
https://www.w3schools.com/code/tryit.asp?filename=G5JPACMIJTM3
https://www.w3schools.com/code/tryit.asp?filename=G5K904A1IFHQ
https://www.w3schools.com/code/tryit.asp?filename=G5JQY3PAIYH2
https://www.w3schools.com/code/tryit.asp?filename=G5JRAUISEDW3
https://www.w3schools.com/code/tryit.asp?filename=G5JR2ZANBQPA
http://brackets.io/
https://www.sublimetext.com/
https://code.visualstudio.com/
https://atom.io/
https://en.wikipedia.org/wiki/Komodo_Edit
https://www.w3schools.com/css/default.asp
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
20
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
Aplicar interacciones con JavaScript
k. Analicen este ejemplo de cómo aplicar una interacción básica a un botón mediante 
JavaScript, en Tryit Editor v3.6.
l. Agreguen a su proyecto alguna función en JavaScript, incorporando los elementos vis-
tos hasta el momento. Agreguen el acceso al proyecto en el muro de Padlet de su grupo. 
Se sugiere, también, investigar frameworks o marcos de trabajo como Materialize o 
Bootstrap, entre otros (pueden acceder al video “Comienza a usar Materialize CSS”, en el 
canal DesarrolloWeb.com, o al video “Cómo usar Bootstrap en HTML”, en el canal Bread 
Gaming). Sintéticamente, un framework es un esquema (un esqueleto, un patrón) para el 
desarrollo o para la implementación de soluciones informáticas. En este caso, estos fra-
meworks web permiten desarrollar sitios web haciendo uso de librerías y definiciones que 
facilitan la codificación.
Generar un sitio web a través de plantillas
m. Ingresen a Wix y elaboren un nuevo sitio web basándose en plantillas (pueden acceder al 
tutorial de Wix en el Campus Virtual de Educación Digital). También, pueden ver las dife-
rentes plantillas en “Elige la plantilla web que más te guste”, en Wix, y los videos tutoriales 
de Wix en “Tutoriales sobre Diseño y Estilo”, en el canal Wix español. Agreguen el enlace a 
su sitio web hecho en Wix al Padlet.
n. Observen el código que genera el sitio de Wix accediendo a las herramientas de desarro-
llador del navegador (acceso directo presionando “Ctrl + Shift + I”). Naveguen a través del 
menú lateral hasta acceder al sombreado individual de los elementos que hayan colocado 
en el sitio. ¿Cuánto código es generado automáticamente?
 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.w3schools.com/code/tryit.asp?filename=G5JRRIPKTFFP
https://materializecss.com/
https://getbootstrap.com/
https://www.youtube.com/watch?v=ycr1RFgfM4A
https://www.youtube.com/watch?v=-Gm5sZx2m4Q
https://es.wix.com/
https://campusvirtualintec.buenosaires.gob.ar/course/view.php?id=387
https://es.wix.com/website/templates
https://www.youtube.com/playlist?list=PLSUkP_5z0eicTQALxEEzNLiTVIX7c8QCy
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
21
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
o. Analicen qué aspectos (positivos y negativos) encuentran entre el uso de plantillas (por 
ejemplo, Wix) en relación con el desarrollo de sitios web desde cero (codificando sin el uso 
de plantillas gráficas) en HTML y CSS. Agreguen un breve texto en el que expongan su 
análisis a su muro de Padlet.
En esta actividad, iniciarán el proceso de creación de un sitio web desde cero, que culmi-
nará en la actividad 6. Comenzarán a plasmarlo en un entorno de desarrollo con la intención 
de incorporar conocimientos específicos del desarrollo web. A lo largo de toda la actividad, 
se sugiere continuar con el mural digital en Padlet, a modo de recopilación de las diferentes 
producciones de los/las estudiantes.
Comenzarán a analizar diferentes tecnologías web (HTML, CSS, JavaScript). Se sugiere 
relevar las opiniones sobre cuáles creen que son lenguajes de programación y cuáles no. 
De los tres lenguajes indicados, solo JavaScript es un lenguaje de programación o scripting. 
HTML es un lenguaje de marcado o etiquetado, mientras que CSS es un lenguaje de diseño 
gráfico para el armado de hojas de estilo.
Se retoma lo explicado en la actividad anterior, a partir de lo cual los/las estudiantes crearán 
una página web simple, de modo de generar todo el proceso de desarrollo. Esto se realizará 
de una forma ágil, dado que no se pretende profundizar en la calidad del sitio sino en los 
aspectos esenciales en su generación. El contenido de la página puede ser definido por los/
las estudiantes con orientación docente. Se puede proponer una serie de preguntas como: 
¿Cuál es el objetivo del sitio? ¿A quién está dirigido? ¿Con qué secciones contará? Es fun-
damental destacar que el primer objetivo está centrado en lo funcional, por lo que se pro-
pone conversar luego de ver los videos, para explicar que se trata de una filosofía centrada 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
22
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
en resolver rápidamente aspectos funcionales relegando la prioridad que suele suponer la 
estética y la gráfica del sitio, permitiendo validar y escalar el desarrollo, en la medida en que 
se aceptan los textos y recursos multimedia del sitio.
Se sugiere que la dimensión o el tamaño de los sitios a desarrollar sean definidos por el/la 
docente. Como esquema general, se propone que involucren al menos dos páginas, con la 
incorporación de imágenes, textos, listas e hipervínculos.
Los desarrollos en lenguajes como HTML, CSS y JavaScript conforman un mismo proyecto 
web. A continuación, se indican un video y un sitio web con ejemplos de cómo generar un 
proyecto y vincularlo mediante un editor web. 
Desarrollo de sitios web (HTML + CSS + JavaScript)
HTML + CSS: 
“Ejemplo de página básica con HTML y CSS”, en el canal de Jorge Llanten. 
Ejemplo en WordPress de HTML + CSS:
“La guía rápida para aprender CSS básico desde cero”, en Ciudadano 2.0.
Como evaluación de esta primera parte, los/las estudiantes podrán entregar el enlace del muro 
de Padlet donde figurarán las respuestas a las consignas, sus proyectosrealizados a través de 
la programación y sus proyectos a través de plantillas simplificadas en Wix. Se sugiere analizar 
la integración de esas tecnologías y lenguajes, con una mirada centrada en el desarrollo de un 
sitio web básico que incorpore cuestiones relativas a la usabilidad y a la accesibilidad.
Segunda parte
Actividad 4. ¿Cómo buscamos en internet?
En esta actividad, los/las estudiantes incorporarán nuevos elementos al análisis acerca de 
cómo funciona internet. Entre ellos se destaca el análisis del flujo de la información, por 
dónde viaja y dónde se centraliza. Se incorpora la medición de tiempos de permanencia, 
búsquedas y consumos habituales. Se estima una duración de una clase.
Se propone abordar especialmente el conocimiento de la web en el uso reflexivo de las dife-
rentes herramientas para buscar y publicar información, tales como buscadores, documentos 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.youtube.com/watch?v=VuZwD1z_5r4
https://www.ciudadano2cero.com/aprender-css-basico-desde-cero/
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
23
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
colaborativos y editores de páginas web y otras aplicaciones en línea. Será importante que 
comprendan el alojamiento de los sitios web, su localización y sus dominios. Asimismo, que 
puedan analizar el funcionamiento básico de los motores de búsqueda y, también, el con-
cepto de redifusión web, utilizando tecnologías de sindicación de contenidos.
 Actividad 4 ¿Cómo buscamos en internet?
Como han estudiado en la actividad 1, se concibe internet como una red de interconexión 
pública, que acerca lugares físicamente remotos y aporta información relevante a los inte-
reses de los consumidores digitales. Ahora bien, ¿existe una autoridad que regule la infor-
mación en internet? ¿Quién garantiza que las conversaciones o los mensajes enviados no 
serán leídos por terceros? ¿Qué pasa con los datos personales en internet? ¿Cómo sabe 
Google qué es lo que se quiere o lo que se necesita?
Para ello, se divide la actividad en dos partes. La primera parte aborda aspectos vinculados a 
la autoridad y a la propiedad de la información en internet y al rol de las grandes empresas. 
La segunda parte propone trabajar sobre la temática de las búsquedas de información en la 
web y cómo el ecosistema digital predispone información en relación con nuestras prefe-
rencias, y realiza así un recorte parcial de la realidad. 
Primera parte
La información de las interacciones realizadas en internet se aloja en grandes conjuntos de servidores (computadoras) llamados 
datacenters. 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
24
 
Mensaje sobre cookies. 
Las cookies
A la hora de acceder a diferentes sitios web, suele aparecer un cartel que indica: “Este 
sitio utiliza cookies” (o similar). 
¿Qué son las cookies? Una cookie es un archivo que se genera automáticamente en la 
computadora de los usuarios/as, y guarda sus preferencias e interacciones en ese sitio. 
Pueden leer más sobre el tema en el artículo “Qué ocurre cuando aceptas las cookies 
y por qué es conveniente borrarlas del navegador de vez en cuando”, en BBC News / 
Mundo.
Las compañías que venden productos y servicios en internet necesitan conocer a su 
audiencia, por lo que demandan y necesitan recabar esta información. De allí se des-
prende un segmento de negocio vinculado al análisis del consumo de datos, donde 
ciertas empresas brindan sus servicios para permitir filtrar y acercar los productos o 
servicios de terceros a una determinada población.
Internet es una construcción colectiva donde se conectan y participan diferentes per-
sonas e instituciones para armar una gran red global, pero ¿quién administra y regula 
esas interacciones? 
a. Lean el artículo denominado “¿Qué es Gobernanza de Internet?”, en NIC Argentina, y vean 
el video “Una Carta Magna para la web”, de Tim Berners-Lee, creador de la web (o también 
llamada World Wide Web o www), en TED Ideas worth spreading, donde habla acerca de qué 
internet se quiere tener y cuál es su futuro. Luego, resuelvan la siguiente consigna:
• Si hubiera que crear una nueva versión de internet y se les solicitara escribir esos linea-
mientos o definiciones de la carta magna, ¿qué deberían contemplar? Escriban al menos 
cinco puntos de la nueva web, por ejemplo, qué derechos contemplaría y cómo serían la 
propiedad y la administración de los datos en la red. Para pensar aspectos de cómo fue 
cambiando la web, pueden ver el video “Cómo necesitamos rehacer internet” de Jaron 
Lanier, en TED Ideas worth spreading.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.bbc.com/mundo/noticias-40443519
https://www.bbc.com/mundo/noticias-40443519
https://nic.ar/es/enterate/novedades/que-es-gi
https://www.ted.com/talks/tim_berners_lee_a_magna_carta_for_the_web?language=es
https://www.ted.com/talks/jaron_lanier_how_we_need_to_remake_the_internet?language=es#t-256967
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
25
Segunda parte
Filtro “burbuja”
Tim Berners-Lee menciona en su video un término conocido como “Filtro burbuja”.
El esquema de filtro burbuja supone que grandes empresas preseleccionan información 
de la web en lugar del usuario final, acotando qué información es la que se percibe.
 
b. Vean el video “Eli Pariser: cuidado con la ‘burbuja de filtros’ en la red”, en TED Ideas worth 
spreading, para comprender en detalle cómo esta estrategia afecta a los usuarios a nivel 
global. En ese sentido, respondan las siguientes preguntas:
• ¿Qué noticias o novedades suelen recibir en las redes sociales? ¿Pertenecen a las perso-
nas “más cercanas”? Busquen e identifiquen, en su lista de amigos/amigas/contactos, a 
algunas personas que no hayan visto o con quienes no hayan interactuado en el último 
tiempo. Busquen si esas personas han tenido actividad reciente (si han subido noticias, 
fotos, textos). Chequeen si esas novedades han aparecido en su muro. ¿Quién define 
qué novedades o artículos se quiere ver? 
c. De la misma manera que la oferta de información que se recibe es parcial, también lo son 
los resultados de búsquedas. Vean el video “Google knowledge, Google money, Google 
power: Andreas Ekström at TEDxLundUniversity” (“Conocimiento, dinero y poder de 
Google”), en el canal TEDx Talks (tiene la opción de habilitar la traducción automática al 
español), y respondan las siguientes preguntas:
• ¿Qué anuncios suelen aparecer en los sitios a los que acceden habitualmente o alrede-
dor de ellos? ¿Tienen que ver con lo que buscan o con lo que consultan en la web?
• ¿Qué distinción hace Eli Pariser entre la información que se desea encontrar y lo que 
verdaderamente se encuentra al buscar? ¿Cómo se da ese proceso de redifusión de la 
información? ¿Cómo nuestras preferencias afectan esa oferta de información?
• ¿Es posible que se vincule lo que se conversa en whatsapp con los anuncios que nos apa-
recen en el navegador o con las amistades sugeridas de las redes sociales?
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
secr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
En la imagen se puede observar el filtro aplicado 
por diferentes instituciones y empresas, de forma 
tal que percibimos y estamos en contacto solo con 
aquella información que esas entidades nos ofrecen.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.ted.com/talks/eli_pariser_beware_online_filter_bubbles?language=es
https://www.youtube.com/watch?v=zzXQDXCfEcA
https://www.youtube.com/watch?v=zzXQDXCfEcA
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
26
• ¿A qué se refiere Andreas Ekström cuando dice “La transacción de información más 
interesante no viaja de Google hacia los usuarios cuando buscan, sino que va de los 
usuarios a Google”?
d. Realicen un esquema o mapa conceptual en el que relacionen, con sus palabras, los tér-
minos relevantes y los que fueron mencionados y desconocen. Incorporen este cuadro al 
muro de Padlet. Pueden realizar el mapa a través de la herramienta MindMeister (consul-
ten el tutorial MindMeister en el Campus Virtual de Educación Digital).
En esta actividad, los/las estudiantes profundizan en la comprensión de internet como un 
sistema hipermedial con lógicas comerciales subyacentes. Además de ampliar superlativa-
mente las posibilidades de comunicación, internet amplía, en la misma medida, la posibili-
dad de comerciar los datos y las interacciones de los/las usuarios/as en la red.
Es fundamental que se conceptualicen las nociones de dato y de información, así como 
también la generación de cookies.
En el análisis de internet como entidad, se debe poner de manifiesto que hay roles de poder 
e intereses comerciales que moderan o que definen cómo se dan ciertas interacciones en la 
web. Se plantea entonces la posibilidad de que los/las estudiantes den su opinión sobre los 
roles y las decisiones que toman como sujetos de derecho y con libre albedrío para recorrer 
e interactuar en la web.
Se sugiere indicar que observen los videos en sus casas, para discutir y hacer la puesta en 
común en clase. Así, se podrá sacar mayor provecho del tiempo disponible para el inter-
cambio de opiniones y para compartir en conjunto aquellos términos que colocaron en los 
mapas conceptuales (por ejemplo, podrían aparecer los términos complejos, como sindica-
ción de contenidos, filtros de búsqueda, entre otros).
En esta actividad se pone de manifiesto el rol activo de los/las usuarios/as, puesto que, a 
través de sus interacciones (considerando un gran número de usuarios y usuarias), se gene-
ran enormes cantidades de datos y de información que marcan tendencias y que sirven 
como base para que otros/as tomen decisiones (principalmente con fines comerciales).
Actividad 5. Análisis de los usuarios en internet
En esta actividad, los/las estudiantes conocerán la web desde otra perspectiva. Podrán ana-
lizar cómo es posible identificar y conocer a los/las usuarios/as, y determinar audiencias de 
acuerdo a los intereses y a las acciones que se deseen llevar a cabo.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 e
 In
no
va
ci
ó
n 
E
d
uc
at
iv
a.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://www.mindmeister.com/es
https://campusvirtualintec.buenosaires.gob.ar/course/view.php?id=491
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
27
Se analizarán los potenciales consumidores de información a través de tres herramientas 
para observar preferencias y tendencias en búsquedas en internet, lo que permitirá seg-
mentar e identificar diferentes tipos de usuarios y usuarias (por intereses, por ubicación, 
por edad, por sexo, entre otros).
Se estima una duración de dos clases.
Actividad 5 Análisis de los usuarios en internet
En esta actividad deberán trabajar con interacciones en la web, desde otra perspectiva. 
Abordarán aspectos vinculados con el análisis de datos y preferencias en internet, y definirán 
audiencias, identificando a esas personas en función de cómo prefieren buscar en internet. 
Para ello, analizarán tres herramientas: Google Trends, Google Analytics y Google Ads.
a. Accedan a Google Trends (tendencias de Google) para analizar qué buscan los/las usua-
rios/as. Ingresen términos de búsqueda vinculados a un tema que les gustaría investigar. 
Podrán encontrar indicadores de interés (de 0 a 100) para ver cronológicamente cómo 
varió el interés, y también filtrando por diferentes regiones de la Argentina.
b. Por otro lado, observen también en Google Trends las “Tendencias de búsquedas en tiempo 
real” en Argentina. 
c. Observen el video “Tutorial audiencia - Google Analytics”, en el canal de Álvaro Mariscal, 
acerca de cómo se puede analizar a los/las usuarios/as de un sitio web a través de la herra-
mienta gratuita Google Analytics. Tomen nota de los campos de personalización y el nivel 
de detalle acerca del público usuario del sitio.
d. Observen la siguiente imagen de una búsqueda de Google. ¿Cuáles fueron los términos 
de búsqueda? ¿Qué pueden decir de los espacios de publicación gratuita y de los pagos 
(anuncios)? ¿Dónde se ubican?
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://trends.google.com/trends/?geo=AR
https://trends.google.com/trends/trendingsearches/realtime?geo=AR&category=all
https://trends.google.com/trends/trendingsearches/realtime?geo=AR&category=all
https://www.youtube.com/watch?v=NQhyH0cSWEY
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
28
e. Accedan a la plataforma de Google Ads. Para ello deberán crear una cuenta gratuita. 
Quienes ya tengan una cuenta de Google podrán acceder con ella.
f. Observen las diferentes herramientas que ofrece la plataforma.
 
g. Accedan a la opción “Planificador de palabras claves”.
¿Qué es una palabra clave? Las palabras claves (keywords) son términos utilizados 
para establecer el intercambio de información entre usuarios y sitios web a partir de 
los buscadores.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://ads.google.com/intl/es-419_ar/home/
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
29
h. Una vez dentro del planificador, figuran dos cuadros donde se indica si se desea descubrir 
palabras o consultar volumen de búsquedas y previsiones. Ingresen en el cuadro de la dere-
cha (búsquedas y previsiones).
i. Ingresen palabras claves (separadas por comas) vinculadas a la temática que quieran inves-
tigar. El sitio les arrojará una estimación de cuántos clics podrán obtener en una potencial 
campaña donde se generen anuncios con esas palabras. A continuación se proporciona un 
ejemplo. En este caso, se han ingresado las siguientes palabras claves: “independencia”, “9 
de julio”, “independencia argentina”, “declaración de la independencia”. 
 
El sistema arroja la cantidad posible de clics, cuánto sale cada clic que se presiona en el 
anuncio y un presupuesto estimado mensual (y también diario).
La tabla indica cómo rendiría cada término de búsqueda, cuántos clics podría recibir (y su 
costo por clic – CPC sigla que deviene del inglés Cost Per Click) y cuántas veces aparecería 
como resultado de una búsqueda (impresiones).
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
duc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
30
j. Observen, en la barra superior, la personalización de nuestra audiencia. Está dirigida a ubi-
caciones en la República Argentina. Si realizan un clic sobre la opción “ubicaciones”, podrán 
redefinir a quién está dirigido el anuncio y cuántos posibles usuarios/as podrán acceder a él.
 
k. Analicen el costo por clic de las palabras vinculadas a la temática elegida.
En esta actividad, los/las estudiantes utilizarán tres herramientas que analizan las interac-
ciones de las audiencias en internet. Para ello, primero deberán observar las tendencias en 
búsquedas en la web (históricas y en tiempo real). A continuación, a través del video sobre 
Google Analytics, podrán observar la capacidad de análisis sobre los/las usuarios/as y el 
público objetivo de un sitio web, y obtendrán el detalle de quién ingresa (sexo, edad, ubica-
ción, dispositivo, sistema operativo, intereses personales) y cuál es su comportamiento en 
el sitio (tiempo de permanencia, cantidad de clics, cantidad de ingresos).
La intención es poner de manifiesto la gran cantidad de información con la que cuentan 
quienes quieren promocionar o difundir un sitio web, y explicitar que las interacciones que 
se realizan son documentadas y registradas para nutrir esta gran base de datos (hoy también 
considerada como big data), a partir de la cual otras personas puedan tomar decisiones. 
Actividad 6. Diseño y desarrollo de un proyecto web 
En el marco de esta actividad, resulta conveniente proponer un proyecto de diseño y crea-
ción de un sitio web orientado a cumplir una determinada función. En consecuencia, se 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
31
propone elaborar un sitio web temático. Se deberá desarrollar el contenido del sitio y, a su 
vez, incorporar una investigación acerca de cómo se podría buscar información sobre esa 
temática en internet e identificar cuáles son las métricas que permiten identificar al público 
potencial. La especificidad y el rubro del desarrollo web y la investigación asociada (ropa, 
alimentos, música, categoría de producto en particular) pueden ser especificados por el/la 
docente o bien propuestos por el grupo.
Actividad 6 Diseño y desarrollo de un proyecto web 
Para concluir este proceso de trabajo, deberán desarrollar un sitio web cuyo contenido 
hayan acordado en clase. Debe tener una página principal descriptiva o informativa del 
tema elegido, y otra página asociada con un análisis de qué usuarios/as podrían buscar la 
información contenida en el sitio y cómo (quiénes acceden, en qué horario, qué términos 
de búsqueda utilizan, desde qué dispositivo, etcétera).
Para ello, pueden hacer uso de las herramientas indicadas en la actividad anterior. 
Incorporen el enlace al sitio en su muro de Padlet como trabajo final. Pueden optar por 
desarrollar el sitio desde cero o mediante plantillas. 
Esta actividad tiene por objetivo integrar lo visto en las dos partes de la secuencia. Los/las 
estudiantes deberán generar un sitio, dando cuenta de lo aprendido en materia de diseño 
y desarrollo web, e incorporando una mirada vinculada al análisis de datos y audiencias en 
internet.
Para ello, se propone una consigna amplia, que permita la elección del tema de trabajo por 
parte del docente o de la docente, como también de los/las estudiantes. Se sugiere no cen-
trar la investigación y la construcción del sitio en temáticas comerciales, sino más bien en 
aspectos académicos e informativos.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
32
Orientaciones para la evaluación
A lo largo de la secuencia, los/las estudiantes desarrollarán capacidades para el diseño y 
desarrollo web y para el análisis de los datos e interacciones en internet.
Es posible obtener información acerca de los aprendizajes a partir de diversas instancias de 
trabajo. En grupo, deben completar y agregar al muro de Padlet la resolución de las consig-
nas y, además, aportar el acceso a los tres sitios web:
 • Un sitio web desarrollado en HTML, CSS, JavaScript.
 • Un sitio web desarrollado en Wix.
 • Un tercer sitio web (desarrollado en cualquiera de ambos formatos) que integra una in-
vestigación sobre datos e interacciones en la web.
Es importante que las/los estudiantes incorporen a su sitio aspectos de usabilidad, accesibi-
lidad, navegabilidad, tomando distancia de una mirada únicamente focalizada en el aspecto 
estético. En relación con el trabajo final, se sugiere valorar positivamente aquellos sitios 
desarrollados mediante programación en HTML, CSS y JavaScript, en contraposición con 
los sitios que sean desarrollados mediante plantillas, dado que pueden dar cuenta de la 
capacidad desarrollada para integrar diferentes lenguajes en un mismo proyecto web. 
Se espera que los/las estudiantes puedan dar cuenta de lo amplio y flexible que puede ser 
el diseño web desde cero, aunque más complejo, y diferenciar este enfoque del diseño web 
mediante plantillas.
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
¿Qué hay detrás de un sitio web?Tecnologías de la Información |
33
Bibliografía
Bibliografía consultada
Gauchat, J. D. (2017). El gran libro de HTML5, CSS3 y JavaScript. Barcelona, España: 
Marcombo Ediciones Técnicas. 
Rubiales Gómez, M. (2017). Curso de desarrollo web: HTML, CSS y JavaScript. Madrid, 
España: Anaya Multimedia.
Imágenes
Página 12 Applications-internet, en Wikipedia, https://bit.ly/2YCwhUn. 
 Kommunikation-Internet, en Pixabay, https://bit.ly/2YvKCTm.
Página 14 Internet - Niveles de conectividad. Aporte de Sebastián Frydman.
Página 20 Menú Herramientas Desarrollador. Aporte de Sebastián Frydman.
Página 21 Vista Herramientas Desarrollador. Aporte de Sebastián Frydman.
Página 23 Data Center, en Flickr, https://bit.ly/31dQYn0. 
 Datacenter de Arsat, en Wikimedia, https://bit.ly/2M1jlBw. 
Página 24 Captura mensaje sobre cookies. Aporte de Sebastián Frydman.
Página 25 Filterbubble, en Flickr, https://bit.ly/2YrythS.
Páginas 27, 
28, 29, 30 Capturas de pantalla. Aportes de Sebastián Frydman. 
G
.C
.A
.B
.A
. |
 M
in
is
te
ri
o
 d
e 
E
d
uc
ac
ió
n 
e 
In
no
va
ci
ó
n 
| S
ub
se
cr
et
ar
ía
 d
e 
P
la
ne
am
ie
nt
o
 E
d
uc
at
iv
o,
 C
ie
nc
ia
 y
 T
ec
no
lo
g
ía
.
https://bit.ly/2YCwhUn
https://bit.ly/2YvKCTm
https://bit.ly/31dQYn0
https://bit.ly/2M1jlBw
https://bit.ly/2YrythS
	Presentación
	¿Cómo se navegan los textos de esta serie?
	Introducción
	Contenidos, objetivos de aprendizaje y capacidades
	Educación Digital
	Itinerario de actividades
	Orientaciones didácticas y actividades
	Actividad 1. ¿Cómo se producen los videojuegos?
	Actividad 2. Construir un nivel de Super Mario Bros en Construct 2
	Actividad 3. Del guion al juego interactivo
	Actividad 4. Avanzar en el desarrollo del programa
	Actividad 5. La usabilidad y la jugabilidad en los juegos modernos
	Actividad 6. ¿Cómo documentar el proyecto?
	Orientaciones para la evaluación
	Bibliografía 
	Imágenes
	Introducción
	Contenidos, objetivos de aprendizaje y capacidades
	Itinerario de actividades
	Orientaciones didácticas y actividades
	Orientaciones para la evaluación
	Bibliografía
	Button 30: 
	Página 2: 
	Página 3: 
	Página 4: 
	Página 5: 
	Página 6: 
	Página 7: 
	Página 8: 
	Página 9: 
	Página 10: 
	Página 11: 
	Página 12: 
	Página 13: 
	Página 14: 
	Página