Usos Pedagogicos de internet

244

description

Usos pedagogicos de intyernet

Transcript of Usos Pedagogicos de internet

Page 1: Usos Pedagogicos de internet
Page 2: Usos Pedagogicos de internet

Luis Eduardo GarzónALCALDE MAYOR DE BOGOTÁ

SECRETARÍA DE EDUCACIÓN DEL DISTRITO

Abel Rodríguez CéspedesSECRETARIO DE EDUCACIÓN DEL DISTRITOAlejandro Álvarez GallegoSUBSECRETARIO ACADÉMICOÁngel Pérez MartínezSUBSECRETARIO ADMINISTRATIVOCatalina Velasco CampuzanoSUBSECRETARÍA DE PLANEACIÓN Y FINANZASHernán SuárezSECRETARIO PRIVADORolf Perea CuervoOFICINA ASESORA DE COMUNICACIÓN Y PRENSAAngela María Avella VargasDIRECTORA DE SERVICIOS INFORMÁTICOSHenry De La Ossa SierraCOORDINADOR DE INFORMÁTICA EDUCATIVAOscar ArbelaezRESPONSABLE DEL PROYECTO USOS PEDAGÓGICOS DE INTERNET

FUNDACIÓN INTERNACIONAL DE PEDAGOGÍA CONCEPTUAL ALBERTO MERANI

FUNDACIÓN PARA EL DESARROLLO DE DESTREZAS INTELECTUALES NOUS

Juan Sebastián De Zubiría RagóDIRECTOR ACADÉMICOOlga Patricia Parra SarmientoCOORDINADORA ACADÉMICAJenny Juliana Jiménez RodríguezDuffay Viviana RiverosAUTORASDiseño Y DiagramaciónFISHON GRAPHIC DESIGNImpresiónEQUILÁTERO DISEÑO IMPRESO

Page 3: Usos Pedagogicos de internet

CONTENIDO

INTRODUCCIÓN.......................................................................................................5

UNIDAD 1. ASPECTOS GENERALES DE INTERNET.................................7

ENSEÑANZAS AFECTIVAS...................................................................9ENSEÑANZAS COGNITIVAS..............................................................13

¿Qué es Internet?............................................................................13Servicios de Internet........................................................................16¿Qué es una dirección?....................................................................18¿Qué es la interactividad?.................................................................19

ENSEÑANZAS EXPRESIVAS................................................................21¿Cómo navegar en Internet?..............................................................21¿Cómo funciona un buscador?..........................................................25¿Cómo funciona una cuenta e-mail?...................................................32¿Cómo funciona un chat?.................................................................32

UNIDAD 2. FUNDAMENTACIÓN PEDAGÓGICA...............................35

JUSTIFICACIÓN.................................................................................37INTERNET Y EL HOMBRE...................................................................38

Comunicación y comunidad..............................................................39TICs: Tecnologías de Información y Comunicación..............................40Tecnología como lenguaje................................................................41Sociedad de la información...............................................................49

INTERNET COMO RECURSO PEDAGÓGICO......................................52ENSEÑANZAS AFECTIVAS.................................................................53ENSEÑANZAS COGNITIVAS..............................................................58

Modelo Pedagógico: Teoría del Aprehendizaje....................................59Modelo pedagógico: aplicaciones de pedagogía conceptual .................63

UNIDAD 3. FUNDAMENTACIÓN INFORMÁTICA...................................109

INTRODUCCIÓN.............................................................................111ENSEÑANZAS AFECTIVAS...............................................................112ENSEÑANZAS COGNITIVAS............................................................112

¿Qué es un Sitio Web?...................................................................112

Page 4: Usos Pedagogicos de internet

¿Qué es una Página Web?...............................................................115¿Cuáles son las clases de sitios que se pueden encontrar en la red?.....117¿Cuáles son las características de los sitios de instituciones educativas?............................................................118Correo electrónico, chat, foros virtuales, mensajería instantánea..........122Diseño de páginas Web..................................................................132¿Cuáles son las etapas para el diseño de un sitio Web?......................133

ENSEÑANZAS EXPRESIVAS.............................................................138¿Cómo construir la estructura del sitio?............................................138Accesibilidad y facilidad de uso.......................................................141Convenciones y limitaciones...........................................................142

CONSTRUCCIÓN DE HTML.............................................................145¿Qué es HTML?............................................................................145¿Qué es un editor de HTML?..........................................................147¿Cuáles son los elementos fundamentales de HTML?.........................148¿Cómo es la estructura básica de un documento HTML?....................148

DISEÑO DE LA INTERFAZ GRÁFICA................................................196¿Qué es una interfaz gráfica?..........................................................196 Dreamweaver................................................................................197El Sitio: Introducción a la configuración de “El Sitio”.........................199El Texto........................................................................................201El Panel de Propiedades.................................................................202 Las Listas......................................................................................203Las Tablas.....................................................................................206Formato de Plantillas......................................................................210Las Imágenes................................................................................211Dreamweaver Avanzado.................................................................217

UNIDAD 4. PROYECTOS DE APRENDIZAJE COLABORATIVO......225

ENSEÑANZAS AFECTIVAS...............................................................227ENSEÑANZAS COGNITIVAS............................................................230

¿Qué es un proyecto colaborativo soportado con Internet?................230Clasificación de proyectos colaborativos...........................................233

ENSEÑANZAS EXPRESIVAS: CÓMO FORMULAR PROYECTOS DE APRENDIZAJE COLABORATIVO.............................238BIBLIOGRAFÍA SUGERIDA...............................................................244

Page 5: Usos Pedagogicos de internet

INTRODUCCIÓN

El momento de transformación social que se vive actualmente es de tan alta trascendencia que ha sido llamado “la tercera ola de la humanidad” por ser la tercera revolución social más importante de la historia. Esta revolución se encuentra asociada a cambios en el sistema de producción, que ha pasado de ser un sistema basado en la producción industrial a uno en el que el valor agregado de los productos lo da la cantidad y calidad de conocimiento que tienen incorporado. Así, en esta época tiene más valor el conocimiento que el capital y la mano de obra requerida para la producción de un bien. En esta nueva sociedad el rol de los individuos es radicalmente distinto y por lo tanto los procesos de formación deben ser diferentes y adaptarse a estas nuevas exigencias.

Ya que la nueva sociedad se caracteriza por dar un valor muy alto al conocimiento, existen infinidad de fuentes para crearlo y acceder a él. Por ello, es indispensable que al interior de las instituciones educativas se generen espacios para integrar diferentes metodologías de aprendizaje que respondan a los nuevos requerimientos de la sociedad. Sin embargo, el conocimiento no sería completo si no formamos individuos sensibles a las realidades del otro, es decir, que no sólo sepan sino que comprendan.

Desde este punto de vista se encuentra que los recursos innovadores, con un modelo pedagógico sólido y que permitan desarrollar destrezas para el aprendizaje, son apropiados para que los procesos educativos sean más estructurados y permitan que los estudiantes se desempeñen mejor en su contexto. Por tanto, las herramientas que reciben los estudiantes durante su educación deben estar orientadas hacia la evolución continua de la forma de aprehendizaje, pues la persona más competente no es la que sabe mucho sino la que posee destrezas e intereses para aprender continuamente.

Page 6: Usos Pedagogicos de internet

En respuesta a estas exigencias y a los avances continuos en todas las áreas del conocimiento, surge la idea de crear un programa cuyo objetivo es orientar a los docentes en la construcción de nuevas estrategias pedagógicas basadas en las TICS (Tecnologías de Información y comunicación), ya que el dominio de éstas constituye hoy en día no sólo una ventaja en cuanto al manejo y procesamiento de todo tipo de información, sino la posibilidad de acceder y direccionar de manera autónoma las rutas del conocimiento del mundo. Una de estas tecnologías, (sin lugar a dudas uno de los más grandes inventos de los últimos tiempos), es Internet, cuya implementación en el ámbito educativo, además de diversificar y enriquecer las didácticas de aprendizaje, integra a los actores de la comunidad educativa con miras al desarrollo de nuevos dispositivos que contribuyan a mejorar los procesos escolares.

Para cumplir con dicho objetivo, es necesario cubrir ciertos vacíos conceptuales en torno al conocimiento y al uso de Internet, por ello la primera parte del presente módulo se dedicará a esclarecer todas las dudas al respecto. Posteriormente nos concentraremos en la revisión y fortalecimiento de modelos pedagógicos que permitan explorar y explotar a Internet como un recurso educativo.

Finalmente, se expondrán los elementos necesarios para la creación de paginas web y el desarrollo de proyectos de aprendizaje colaborativo.

A pesar de que hasta ahora se ha hecho énfasis en el trabajo de los educadores en este proyecto de implementación de Internet, es de suma importancia recalcar que dentro de su labor como multiplicadores de las destrezas y conocimientos adquiridos en este programa está el acompañamiento a sus estudiantes en la lectura de este manual.

Los contenidos presentados a continuación son lo suficientemente claros y explícitos, como para ser abordados por cualquier estudiante que se interese en el conocimiento y aprovechamiento de Internet, teniendo en cuenta que la Red es una fuente de aprendizaje de la que cualquier individuo puede ser parte activa. Lo anterior contempla además, la provisión de herramientas para la construcción de páginas web, la elaboración de diseños y la participación en proyectos colaborativos.

Por último, esperamos que al finalizar este módulo la comunidad educativa esté en capacidad de replicar los beneficios de Internet, e inicien un nuevo ciclo en cuanto a los procesos de aprendizaje valiéndose de las Nuevas Tecnologías de Comunicación.

Page 7: Usos Pedagogicos de internet

ASPECTOS GENERALES DE INTERNETUnidad 1

Page 8: Usos Pedagogicos de internet
Page 9: Usos Pedagogicos de internet

9Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Ante un fenómeno de estas magnitudes, no es posible desconocer la importancia de desempeñarse en forma eficiente en esta Red, para obtener el máximo beneficio en su utilización. Cada día, tener acceso a Internet y comprender su estructura y posibilidades abre puertas a diferentes formas de conocimiento e interacción con otros. Si consideramos las características de la época actual vemos que ésta se caracteriza por unas altas tasas de generación de conocimiento. En este marco, Internet, que enlaza redes de todo el mundo, permite el acceso a información de todo tipo, es decir, que las altas tasas de generación de conocimiento se ven soportadas por amplias posibilidades de difusión del mismo a través de Internet.

Sin embargo, la información que se encuentra en Internet es diversa y no existen mecanismos de control que garanticen su fiabilidad. Por ello, hoy es fundamental la reflexión alrededor de este medio para garantizar que es posible maximizar el beneficio de la red de redes y responder a las exigencias que impone el flujo de conocimiento.

Por otra parte, el sistema de producción ha pasado de ser un sistema basado en la producción industrial a uno en el que el valor agregado de los productos lo da la cantidad de conocimiento que tienen incorporado.

“Un Radar puede costar 5 millones de dólares, las partes y mano de obra para armarlo menos de 2.500 dólares”.

En un entorno así, tiene mayores probabilidades de éxito en el sistema productivo quien tiene destrezas para gestionar la información y hacer que responda a propósitos particulares. El sistema productivo exige individuos con amplias capacidades para aprehender continuamente y para aprovechar el flujo de información, que ya no es un limitante en casi ningún

INTRODUCCIÓN: ASPECTOS GENERALES DE INTERNET

PROPÓSITOS

o Apreciar la importancia de desempeñarse en forma eficiente en Internet.

o Comprender qué es Internet y cuál es su estructura.

o Utilizar los diferentes servicios de Internet.

ENSEÑANZAS

ENSEÑANZAS AFECTIVAS

“... Nos demos cuenta o no, cada uno de nosotros pasa menos tiempo en el mundo físico exterior y más tiempo en el incierto mundo imaginacional. Un mundo cada vez más ineludible de datos digitales que bombardean las neuronas, de conocimiento e innovación, de imagen y marcas, de una

nueva visión de la física...”

Melinda Davis. ¿Por qué deseamos lo que deseamos?”1

Internet es un fenómeno tecnológico sin precedentes que en pocos años ha alcanzado una expansión global afectando todos los ámbitos de desarrollo de los individuos y las comunidades.

La gran “Comunidad de Interconectados” está compuesta actualmente por universidades, estudiantes, empresas, investigadores y personas en sus hogares. Esta es una comunidad gigantesca con un objetivo común: tener acceso a la información e interactuar con muchas otras personas, porque la distancia y el idioma dejan de ser una barrera.2

En este marco, Internet es ya y será aún más el medio de comunicación y de relación esencial sobre el que se basa una nueva forma de sociedad que ya vivimos.3

1 DAVIS, Melinda. ¿Por qué deseamos lo que deseamos? 2 José Camilo Daccach T. www.eduteka.org/ 3 http://www.chile-hoy.de/sociedad/150501_internet.htm

Page 10: Usos Pedagogicos de internet

10Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

área, así, buen desempeño en Internet representará ventajas decisivas para los individuos y para las empresas.

El 47 % de los ejecutivos latinoamericanos afirma que el uso de Internet ha mejorado de manera importante la productividad de sus compañías y el 65 % de los ejecutivos latinoamericanos afirma que sus compañías no podrían funcionar de la misma manera sin Internet: esto evidencia el uso creciente y la dependencia que las compañías latinoamericanas tienen de Internet para la operación y funcionamiento de sus negocios.

Los individuos también consideran que Internet aumenta los niveles de productividad laboral:

Desde otro punto de vista, Internet favorece el intercambio cultural, es una puerta abierta al conocimiento de otros mundos, permite expandir la visión que tenemos sobre el universo que nos rodea, adquirir información en tiempo real sobre lo que sucede en otros lugares y compartir nuestra producción con personas que poseen intereses comunes. Internet ha transformado las formas de entretenimiento y de relación entre las personas, extiende las posibilidades de adquirir nuevos aprendizaje y sin duda alguna, representa el medio de comunicación de mayor impacto e importancia en la actualidad.

De acuerdo con lo anterior, ¿no es fundamental desempeñarse eficientemente en Internet para aprovechar al máximo todas sus ventajas y filtrar sus desventajas?

Fuente: Cysco

“El uso de Internet me ha hecho más productivo en el trabajo”

Page 11: Usos Pedagogicos de internet

11Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Computadoras e Internet en el siglo XIX? Por Ariel Pérez

¿Fue Julio Verne el más incomprendido de los visionarios del siglo XIX o uno de los creadores de máquinas más grandes de entonces? La pregunta continúa sin respuesta y los defensores de ambas teorías siguen aportando nuevos elementos para demostrar la equivocación del bando contrario. Según los primeros, el autor francés fue un visionario a la altura de Nostradamus, un hombre capaz de prever con largo alcance muchos de los adelantos científicos que nos traería el siglo XX; alguien que por inspiración divina o gracias a la información suministrada por seres extraterrestres fue capaz de adelantarse en el tiempo asombrosamente. Los defensores de la segunda teoría, más conservadores, afirman que no hizo más que inventar sus máquinas a partir de la información científica de la época.En la vasta obra del autor galo se encuentran muchos pasajes en los que pueden leerse, más de un siglo después, descripciones primitivas de muchos adelantos tecnológicos actuales. Tal es el caso de tres novelas en las que presuntamente Verne describe la computadora, la calculadora, el fax, el sintetizador y la red Internet.

En La isla con hélice (1895), Verne presenta un gran cúmulo de adelantos tecnológicos enmarcados en una historia singular en la cual los protagonistas viajan desde San Francisco hasta San Diego, Estados Unidos, a bordo de una inmensa isla artificial diseñada para moverse a través del Océano Pacífico.

Uno de los fragmentos de esta novela habla de una biblioteca que “…contiene también un cierto número de libros fonográficos; para evitarse el trabajo de leer, se aprieta un botón y sale la voz de un excelente lector que lee con tal perfección, que sería algo así como la “Fedra”, de Racine, leída por Legouvé…”. Realmente, es una de las descripciones más impresionantes dentro de la novela y lleva a pensar en algo tan común hoy en el mundo informático como las aplicaciones multimedios, a través de las cuales podemos escuchar el texto que vemos en pantalla. No se conoce aún qué información previa pudiese haber tenido el escritor para semejante descripción hace más de un siglo.

En este mismo libro se refiere además al uso de la corriente eléctrica para transportar información, datos, voces e imágenes. La tecnología se describe en estos términos:

“La isla está al tanto de las novedades por las comunicaciones telefónicas con la bahía Magdalena, donde se unen los cables sumergidos en las profundidades del Pacífico…”. Muchos han querido ver en esto la descripción de lo que es hoy la red mundial de computadoras Internet. En el relato, un cable conecta a la isla flotante con la costa Este de Estados Unidos. Los detractores del mito de Verne profeta aseguran que ya en la época en que vivió el autor se disponía del conocimiento científico primario para poder imaginar algo así y reconocen que es muy atrevido admitir que esta descripción pueda asemejarse al funcionamiento de la actual red de redes.

Si París en el siglo XX y La isla con hélice fueron pródigas en descripciones de adelantos tecnológicos, no lo fue menos el cuento En el siglo XXIX: la jornada de un periodista americano en el 2890, publicada por primera vez en inglés en el periódico The Forum, de la ciudad de Nueva York, bajo el título In the year 2889. Entre las anticipaciones del relato destaca una de particular interés, referida a un aparato que el escritor nombra telefoto:

“El teléfono complementado por el telefoto, una conquista más de nuestra época. Si desde hace tantos años se transmite la palabra mediante corrientes eléctricas, es de ayer solamente que se puede transmitir también la imagen.

Page 12: Usos Pedagogicos de internet

12Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Valioso descubrimiento, a cuyo inventor Francis Bennett no fue el último en agradecer aquella mañana, cuando percibió a su mujer, reproducida en un espejo telefótico, a pesar de la enorme distancia que los separaba”.

Nada más parecido, lo que describe el fragmento anterior, a lo que hoy se conoce como teleconferencia. Pero hay dudas sobre la autenticidad de esta historia, que se presume fue escrita originalmente por Michel Verne, hijo del escritor. Julio, según se presume, un año después, tomó el texto escrito por su hijo, lo mejoró y lo recirculó en algunos periódicos franceses.

Para muchos –incluidos los más grandes estudiosos de la obra verneana en el mundo– las “predicciones” que se le atribuyen al escritor francés no son más que extrapolaciones a partir de técnicas emergentes o de especulaciones a partir de conocimientos teóricos (los relacionados con la electricidad, por ejemplo).

No debe perderse de vista que Verne reunía muchos documentos geográficos y científicos antes de escribir sus novelas y que leía muy regularmente gran cantidad de revistas sobre estos temas.

Aún así, es justo reconocer que el gran talento del escritor lo llevó a incluir en sus obras todas estas “anticipaciones” que casi cien años después de su muerte siguen cautivando a las generaciones actuales e inspirando a otros artistas.

El sueño de Internet

Sin importar de qué bando estemos con respecto a los alcances proféticos de Julio Verne, todos sabemos de su fama de “viajero” y conocemos esos destinos maravillosos a los cuales nos llevó a través de la imaginación. Avances tecnológicos que nos permitirían romper fronteras hasta entonces impensables: “Nautilius”, un enorme submarino que alberga a un grupo de personas que eligieron vivir en el fondo del mar, para disfrutar y descubrir las maravillas de los océanos. “El espejo telefótico”, un transmisor de voz e imagen que funciona mediante una red de cables sumergidos. “El piano”, cuyas teclas realizan operaciones extra rápidas, etc. Ante estos y otros deseos, necesidades, etc. que tal vez hoy ni siquiera se nos ocurrirían, Internet ya nos ofrece alternativas, soluciones al alcance de la mano. Sin embargo, vale la pena detenerse a reflexionar si verdaderamente TODO es posible gracias a este invento y cómo podríamos implementar esa posibilidad en nuestras vidas de manera ética y responsable. Tal vez una pista en torno a estos interrogantes se halle precisamente en el carácter soñador y ambicioso del ser humano, que siempre está en pos de objetivos que faciliten su

vida, le proporcionen deleite y lo aproximen al mundo. De alguna manera, Internet es un producto de estos intereses y a la vez una vía para satisfacerlos, de ahí que para su uso debiera tenerse en cuenta el respeto por esos objetivos comunes a todos los hombres.

Desde siempre, incluso antes de aprender a hablar, los hombres – como Julio Verne – estamos constantemente ávidos de conocimiento de otras realidades, queremos saber dónde se encuentra tal o cual cosa, cuál es el por qué de aquello, quiénes son esas personas, qué es eso o qué hay allá, etc. Hoy por hoy, Internet se erige como la gran Alejandría que pretende tener respuestas casi a cualquier interrogante, que no sólo es una puerta interdimensional, a través de la cual podemos acceder de igual manera a las maravillas del océano, - gracias a esta tecnología podemos escuchar hasta el canto de las ballenas a la cotidianidad de tribus africanas, a la bolsa de Nueva York, etc, - sino también una enorme galería que brinda la posibilidad de expresarse de diversas maneras. Teniendo en cuenta todo esto, no valdría la pena pensar seriamente ¿De qué manera me quiero relacionar yo con Internet?

Page 13: Usos Pedagogicos de internet

13Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

ENSEÑANZAS COGNITIVAS

No es posible alcanzar un desempeño óptimo en un medio si no se dominan los conceptos centrales del mismo. El caso de Internet no es la excepción. Por ello, a continuación se presentan una serie de conceptos fundamentales para la utilización de Internet.

¿Qué es Internet?

Internet es una Red Informática. Una red es un conjunto de computadores conectados unos a otros para comunicarse. Funciona como el conjunto de máquinas que se comunican a través de algún medio (cable coaxial, fibra óptica, radiofrecuencia, líneas telefónicas, etc.) con el objeto de compartir recursos.

Una red puede estar formada por sólo dos ordenadores, aunque también por un número casi infinito.

Hay varias clases de redes. Existen las Redes de Área Local (LAN) o las redes domésticas, que enlazan un número de computadores limitados. Internet se diferencia de estas redes informáticas en tanto que enlaza a un número ilimitado de computadores de todo el mundo, ya que es una red de global. Por esto, ha sido llamado Red de Redes, ya que interconecta infinidad de computadores y de redes más pequeñas. Así, quien está en Internet puede acceder a equipos de cualquier parte del mundo en donde se encuentra la información deseada o el usuario con el que se desea interactuar.

Internet permite el intercambio de todo tipo de información (en formato digital) entre sus usuarios. El nombre proviene del acrónimo de las palabras inglesas International Network (red internacional).

RED DE ÁREA LOCAL

RED DOMÉSTICA

RED GLOBAL INTERNET

RED INFORMÁTICA

Page 14: Usos Pedagogicos de internet

14Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Internet sirve de enlace entre redes más pequeñas y permite ampliar su cobertura al hacerlas parte de una “red global”. Esta red global tiene como característica la utilización de un lenguaje común que garantiza la intercomunicación de los diferentes participantes; este lenguaje común o protocolo (el lenguaje que utilizan las computadoras al compartir recursos) se conoce como TCP/IP. 4

Esta red permite que los computadores, sin importar su ubicación geográfica accedan a diferentes servidores en donde se almacena información y se permite el intercambio de datos y archivos. Ésta no pertenece a ningún país, ni organismo oficial, ni a una empresa determinada, es decir, se trata de una red libre ya que cualquier persona puede acceder a ella desde cualquier punto del planeta, de la misma forma que no existe ningún tipo de restricción para toda la información que circula por la misma.

¿Cuáles son las características esenciales de Internet?

o Sistema de comunicación globalo Acceso a información a través de un computador

conectado a la redo Los medios de transmisión utilizados son, casi

cualquier cosa que permita transmitir bits (cable de pares, coaxial, fibra óptica, enlaces radioeléctricos, satélite, etc.).

o Técnicamente se estructura en redes de área local interconectadas por encaminadores (routers)

o Administrativamente posee miles de ISPs (proveedores del servicio Internet) con acuerdos de intercambio de tráfico, interconectando usuarios y organizaciones.

o Para los usuarios constituye un conjunto de servicios con los que está interconectado de forma transparente.

Un poco de historia

La historia de la “red de redes” se remonta a los años 60’s, cuando en los E.U. se estaba buscando una forma de mantener las comunicaciones vitales del país en el posible caso de una Guerra Nuclear. Este hecho marcó profundamente su evolución, ya que aún ahora los rasgos fundamentales del proyecto se hallan presentes en lo que hoy conocemos como Internet.5

En primer lugar, el proyecto contemplaba la eliminación de cualquier “autoridad central”, ya que sería el primer blanco en caso de un ataque; en este sentido, se pensó en una red descentralizada y diseñada para operar en situaciones difíciles. Cada máquina conectada debería tener el mismo status y la misma capacidad para mandar y recibir información.

El envío de los datos debería descansar en un mecanismo que pudiera manejar la destrucción parcial de la Red. Se decidió entonces que los mensajes deberían de dividirse en pequeñas porciones de información o paquetes, los cuales contendrían la dirección de destino pero sin especificar una ruta específica para su arribo; por el contrario, cada paquete buscaría la manera de llegar al destinatario por las rutas disponibles y el destinatario reensamblaría los paquetes individuales para reconstruir el mensaje original. La ruta que siguieran los paquetes no era importante; lo importante era que llegaran a su destino.

Curiosamente fue en Inglaterra donde se experimentó primero con estos conceptos; y así en 1968, el Laboratorio Nacional de Física de la Gran Bretaña estableció la primera red experimental. Al año siguiente, el Pentágono de los E.U. decidió financiar su propio proyecto, y en 1969 se establece la primera red en la Universidad de California (UCLA) y poco

4 http.definición.org http.solotutiriales.co 5 http.solotuturias.com

Page 15: Usos Pedagogicos de internet

15Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

después aparecen tres redes adicionales. Nace así ARPANET (Advanced Research Projects Agency NETwork), antecedente de la actual Internet.

Gracias a ARPANET, científicos e investigadores pudieron compartir recursos informáticos en forma remota; éste era una gran ayuda ya que hay que recordar que en los años 70’s el tiempo de procesamiento por computadora era un recurso realmente escaso. ARPANET en sí misma también creció y ya para 1972 agrupaba a 37 redes.

El Departamento de Defensa autoriza el uso de la tecnología Arpanet a AT&T e IBM. De esta forma, la red, que inicialmente funcionaba en forma casi exclusiva para las fuerzas militares y procesos de investigación estatales, obtuvo un carácter comercial y público.

En 1991, Timothy Berners-Lee crea la World Wide Web (WWW). En 1992 aparece MOSAIC, precursor de Netscape, y madre de todos los usuarios de la Red. A partir de estos avances, en 1993 el tráfico de Internet aumenta en un 341.634 por ciento en un año.

Los servidores son equipos en los que se almacena la información que es compartida por toda la red. En 1983, antes del nacimiento de WWW, había en Internet 562 servidores. Esto significa que entonces, 562 computadores contenían toda la información a la que tenían acceso los usuarios de la red. Esta cifra casi se duplicó en el año siguiente (1984) cuando alcanzó los 1.000 servidores. En el año 1993 el número de servidores en Internet sobrepasa los 2.000.000. Esto significa que en ese momento había 2.000.000 de computadores a los que era posible acceder para adquirir información o compartir archivos y datos. Esta cifra crece a velocidades inimaginables durante los años sucesivos:

Año Servidores en Internet1984 1.0001987 10.0001988 56.0001990 313.0001993 2.000.0001995 5.000.0001997 17.000.000

Page 16: Usos Pedagogicos de internet

16Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Esto significa que el flujo de información y la posibilidad de compartir datos en el mundo se incrementó en un 17000% en 13 años. Un aumento inimaginable y sin precedentes, seguido de lejos por la televisión.

Hoy se estima que Internet tiene cerca de 500 millones de usuarios y la tendencia indica que en los próximos dos años llegaremos a 1.000 millones.

Como es obvio, un fenómeno de estas magnitudes causa un impacto trascendental en la forma de vida de las personas y las comunidades.

“...En algún momento del invierno de 1993 dejó de existir el mundo tal como lo conocíamos. Fue entonces cuando finalmente se rompió el débil equilibrio que siempre se ha mantenido entre nuestros dos niveles separados de la realidad: el mundo que podemos ver y experimentar fuera de nosotros mismos, y el mundo que sólo podemos percibir

dentro de nuestros cerebros.”

“Empezamos masivamente a desentendernos del mundo físico, para reunirnos en plazas de pueblos inexistentes. Nuevas tecnologías y tecnoestrategias abren las puertas de nuestros mundos personales, electrónicos y cerebrales”

Melinda Davis. ¿Por qué deseamos lo que deseamos?6

En la actualidad Internet se compone de usuarios de todas las edades, niveles educativos, ocupaciones y geografías. Al principio los usuarios podían conectarse a Internet únicamente a través de una PC, pero ahora, se pueden conectar desde PCs, TV Web, Palm Pilots y teléfonos móviles

¿Cómo funciona Internet?

Dentro de la estructura física (hardware) de Internet hay computadores conocidos como Servidores que almacenan los archivos guardados en HTML. Este servidor de Internet almacena información en un disco y la sirve posteriormente a quien la demanda.

Un servidor es un computador en el que se encuentran alojados los datos que serán compartidos a través de la red. Cuando una persona ingresa a Internet, ingresa a algún servidor en algún lugar del mundo, en donde se encuentra la información a la que desea acceder. El servidor debe tener instalado un programa (software) que gestione o administre dichos archivos y responda a las peticiones de información, es decir, que permita que la información esté disponible para los usuarios que deseen consultarla.

Cuando el computador del usuario se conecta a la red para conseguir los datos que posee el servidor, utiliza un programa (software) de navegación por la Web que convierte la información que le llega, codificada en lenguaje de código HTML, en páginas gráficas, que combinan texto, gráficos, video o audio.

Es importante tener claro que Internet es un medio de comunicación público, cooperativo y autosuficiente en términos económicos, accesible a cientos de millones de personas en el mundo entero.

En Internet no existe una estructura jerárquica de poder, no se reconoce jefe ni dueño, ni existe una autoridad central que la dirija.7 Esto significa que las distintas redes que participan en ella, así como los individuos que las integran, pueden tomar decisiones autónomas sobre su uso y sus contenidos, sin que medie control institucional alguno. Por esto resulta importante desarrollar en los usuarios de la red (alumnos y profesores) la capacidad de hacer análisis crítico de la información que encuentran en ella.

Servicios de Internet

La Red de redes presta diferentes servicios. Es más utilizado es WWW, a través del que es posible acceder a páginas de Internet que contienen texto, imágenes, sonidos, etc.

6 DAVIS, Melinda. ¿Por qué deseamos lo que deseamos?. La nueva búsqueda de la satisfacción total. 7 http://comunidad.ciudad.com.ar/argentina/entre_rios/dbinternet/estruc3.htm

Page 17: Usos Pedagogicos de internet

17Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

La WWW (World Wide Web) o mejor conocida como la Web es el servicio de Internet más utilizado y que hace uso del software gráfico, conocido como navegador o explorador y, de los archivos guardados en el lenguaje HTML.8

La web es entonces un servicio más que consiste en un inmenso conjunto de páginas conectadas unas a otras por un sistema de enlaces.9

El sistema con el que está construido el web se llama hipertexto y es un entramado de páginas conectadas con enlaces.

La Web no sólo se limita a presentar textos y enlaces, sino que también puede ofrecernos imágenes, videos, sonido y todo tipo de presentaciones, llegando a ser el servicio más rico en medios que tiene Internet. Para acceder a la Web es necesario contar con un navegador. El navegador o explorador es un programa que realiza las peticiones de información a un servidor, descargándola y mostrándola posteriormente. Los más utilizados son Internet Explorer y Netscape.

La Web, gracias a su versatilidad, puede soportar los otros servicios de Internet: Correo Electrónico, FTP y TELNET.

El correo electrónico es un sistema para enviar mensajes a través de Internet. El emisor de un correo electrónico remite los mensajes a un servidor y éste, a su vez, se encarga de enviarlos al servidor del receptor. Para poder ver el correo electrónico es necesario que el receptor se conecte con su servidor.

8 CAÑIZARES, Carmen. Creación de página Web con Office 2000. Ediciones Anaya Multimedia 9 http://www.desarrollo web.com/manuales/3/

FTP (PROTOCOLO PARA TRANSMISIÓN DE ARCHIVOS)

CORREO ELECTRÓNICO

TELNET

HIPERTEXTO

NAVEGADOR

WORLD WIDE WEB

SERVICIOS DE INTERNET

Page 18: Usos Pedagogicos de internet

18Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

El Correo Electrónico nos permite enviar cartas escritas con el ordenador a otras personas que tengan acceso a la Red. Las cartas quedan acumuladas en Internet hasta el momento en que se piden. Es entonces cuando son enviadas al ordenador del destinatario para que pueda leerlas. El correo electrónico es casi instantáneo, a diferencia del correo normal, y además muy económico. Podemos cartearnos con cualquier persona del Mundo que disponga de conexión a Internet.

En vista de las dimensiones de Internet y para no “perderse” en la red, cada usuario, servidor, proveedor de servicios y sitio o página web, se identifican de acuerdo a unas direcciones definidas según estándares internacionales establecidos. Estas direcciones son las que identifica el navegador junto con el protocolo de comunicación TCP/IP - Protocolo de Control de Transmisión/Protocolo de Trabajo de Internet (Transmission Control Protocol/Internet Working Protocol).

¿Qué es una dirección?

Para conectarse al sitio se debe especificar una dirección única, conocida como dirección de Internet o URL - Localizador Uniforme de Recursos (Uniform Resource Locutor). Al establecer una conexión a Internet, se puede suministrar la dirección URL, a través de la lista de “Favoritos”, accediendo a través de un hipervínculo o escribiéndola directamente en el Explorador de la forma siguiente:

http://www.microsoft.com/spain/default/html

Protocolo Servidor–Dominio Ruta de Acceso

La primera parte de la dirección URL especifica el protocolo (reglas o estándares de comunicación entre computadores) que utilizará el navegador y el servidor para comunicarse. En el ejemplo, se especifica un protocolo http: Protocolo de Transmisión de HiperTexto (Hyper Text Transmisión Protocol), utilizado para transferir diferentes tipos de documentos en el World Wide Web.

La segunda parte de la dirección, las letras WWW, indica el servidor/servicio de Internet en el que reside la información a la que desea acceder y el dominio principal .com, es decir, el servidor opera en una empresa comercial (.edu es para instituciones docentes, .gov para instituciones gubernamentales, entre otros).

Page 19: Usos Pedagogicos de internet

19Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Finalmente la tercera parte, /spain/default/html, expresa la ruta de acceso que indica la carpeta donde se encuentra la información concreta a la que se desea acceder.

A continuación se muestra gráficamente la estructura de Internet con los elementos físicos (hardware) y lógicos (software) que se encuentran relacionados para el funcionamiento de la red, para la web.

¿Qué es la interactividad?

El acceso a la información en Internet es no lineal, puesto que el usuario determina el orden en el que accede a cada temática. Ya que la exploración de recursos multimedia depende del usuario, puede hablarse de cierta comunicación establecida entre el ordenador y la persona que accede a la información.

10 http://comunidad.ciudad.com.ar/argentina/entre_rios/dbinternet/estruc3.htm

Páginas WebArchivos HTML

Servidor de InternetServidor HTTP

Servidor de Internet

Protocolo HTTP

Protocolo TCP/IP

Enrutadores

Enrutadores

Proveedor de Internet 1

Proveedor de Internet 2

Proveedor de Internet Usuario N

Dirección IPNavegador

Usuario 2Dirección IPNavegador

Usuario 1Dirección IPNavegador

Fax/Módem

Fax/Módem

Fax/Módem

Estructura de Internet

Page 20: Usos Pedagogicos de internet

20Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

En algunos casos esta comunicación tiene un mayor grado que en otras situaciones, pero en general, siempre que el usuario puede decidir sobre la información que recibe existe esta comunicación. Esta comunicación se denomina interactividad.

La interactividad representa los procedimientos por medio de los que una persona se comunica para:

o Controlar los procedimientoso Seleccionar la información o Retroalimentar el sistema

La comunicación que se establece con el programa se realiza en forma instantánea, casi en tiempo real.

¿Qué es un hipertexto?

El concepto de hipertexto tiene sus orígenes en el campo de la informática; es aquí donde se ha desarrollado y tomado fuerza hasta ingresar al campo de la pedagogía e incluso más específicamente en el de la literatura.

Corresponde a una forma de presentar la información que se caracteriza porque la lectura no se realiza en forma lineal, sino que se basa en una serie de enlaces que relacionan unos textos con otros, es decir, trabaja por medio de asociaciones en las que el usuario decide en que orden realizar su exploración sin que esto afecte la coherencia del contenido.El hipertexto atiende a un mecanismo tecnológico mediante el cual es posible acceder a múltiples maneras de información recorriendo o estableciendo relaciones o enlaces particulares entre nodos (conjunto de ordenadores que reciben la llamada del usuario y la dirigen hacia el servicio solicitado allá donde se encuentre) y redes.

¿Qué es un hipervínculo?

Un hipervínculo es un enlace existente en un documento hipertexto que une un documento con otro que puede ser o no otro documento hipertexto. Este puede tener forma de icono (símbolo gráfico), texto resaltado o texto acompañado de icono.

Page 21: Usos Pedagogicos de internet

21Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

ENSEÑANZAS EXPRESIVAS

¿Qué es una barra de herramientas?

Es un conjunto de iconos con los cuales accedemos rápidamente a herramientas sin tener que abrir los menús

¿Cómo navegar en Internet?

Page 22: Usos Pedagogicos de internet

22Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Navegar por la World Wide Web es muy sencillo. Para empezar debemos introducir una dirección de partida en el espacio señalado. El navegador que aparece a continuación como ejemplo es Internet Explorer

Si la página Web que aparece a continuación dispone de enlaces a otras páginas, no tenemos más que hacer un clic con el ratón sobre alguno de los enlaces (que normalmente suelen ser palabras o frases resaltadas y/o subrayadas en un color diferente al del texto, o bien imágenes e iconos), y aparecerá la página correspondiente al enlace marcado.

De esta manera vamos recorriendo una serie de páginas Web enlazadas hasta el punto que nuestra búsqueda lo requiera o hasta que lleguemos a una sin enlaces, de modo que ya no podremos seguir avanzando.

Todos los navegadores tienen dos botones que se usan mucho en la navegación. Son los botones de avanzar y retroceder. El botón de retroceder nos permite volver a la página de la que provenía la actual que estemos visualizando. De este modo, pulsando consecutivamente este botón por medio del ratón, podemos volver a todas las páginas por las que hemos pasado durante la navegación hasta llegar al punto de partida. El botón de avanzar realiza la función inversa. Cuando hemos retrocedido una página, podemos volver a la posterior pulsando este botón. Así pues, podemos ir y volver desde la primera página Web a la última que hayamos navegado con sólo pulsar estos dos botones. El botón Actualizar sirve para restablecer la página actual si no aparece la información última o la que esperaba. Esto es útil si ve información antigua en una página que se actualiza con frecuencia o si los gráficos no aparecen correctamente.

1

Botón de retroceder

Botón de avanzar

Botón Actualizar

Page 23: Usos Pedagogicos de internet

23Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Pulse el botón Inicio cuando quiera regresar a la página inicial, es decir, la primera que ve cuando abre el explorador. El botón de Búsqueda, como su nombre lo indica, tiene la función de acceso a la barra de búsqueda y desde allí explorar en Internet. La barra de Favoritos. Permite almacenar vínculos (accesos directos) a los sitios Web o documentos que visita con más frecuencia o que cree volverá a visitar nuevamente. Esta es una herramienta muy útil, ya que funciona como un archivo personal en el que podemos guardar y acceder rápidamente a páginas de nuestro interés.

Sin embargo, si usted desea volver a visitar una página que encontró hace una semana y no la guardó en la opción de favoritos, Internet cuenta con la herramienta de Historial. Al hacer clic en este botón, inmediatamente verá en pantalla un barra que le muestra el registro de todos los sitios visitados los últimos 20 días. Puede cambiar el número de días que desea mantener el Historial. Puede ordenar la lista de varias formas para hacer más fácil la búsqueda del sitio: por el nombre, la frecuencia con que lo visita o el orden de visita. Además, puede buscar por palabras clave del sitio Web.

1Botón Inicio

Botón de Búsqueda

Carpeta Favoritos

Page 24: Usos Pedagogicos de internet

24Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Finalmente, en la parte inferior izquierda de la pantalla encontrará la Barra de estado que señala el proceso de carga de la página Web. En la parte derecha verá la zona de seguridad de la página actual, si aparece un candado quiere decir que se encuentra en una zona segura.

A la hora de navegar es conveniente tener en cuenta algunos detalles importantes

o Desde el momento que solicitamos ver una página Web hasta que ésta aparece en nuestra pantalla, pueden transcurrir unas décimas de segundo o bien unos pocos minutos, y esto depende de muchos factores, como son el que dicha página haya sido visitada anteriormente y esté en la memoria del ordenador que estamos usando, o que entre el servidor y nuestro ordenador haya un canal rápido de transferencia de la información, o incluso puede depender de la hora local tanto en el lugar que se encuentra nuestro ordenador, como del lugar del servidor.

o Es muy recomendable que cuando naveguemos manejemos con precisión el ratón, ya que a veces se cree que por pulsar repetidamente sobre el enlace, las páginas Web se van a cargar más rápidamente. Esto es falso, todo lo contrario, podemos entorpecer el proceso de carga e incluso bloquear el sistema.

o Durante el proceso de carga de una página Web, lo cual puede llevar varios segundos, se nos va mostrando en pantalla la información que se va recibiendo. De este modo, lo normal es que primero nos aparezca el esqueleto de la página Web. El esqueleto es el texto y los enlaces. Allá donde deba aparecer una imagen, primero nos aparecerá un icono con un pequeño dibujo, indicando que todavía no se ha recibido la imagen. Cuando el navegador consiga reunir toda la información de la imagen, se sustituirá el icono por la imagen real.

o Hay ocasiones en que una imagen no se ha podido transferir hasta nuestro ordenador de manera correcta. Entonces, en la pantalla veremos un icono pequeño con un dibujo roto. Esto quiere decir que si queremos ver la imagen debemos volver a intentar traerla. Para ello, lo que podemos hacer es navegar un paso hacia atrás y otro hacia adelante. Otra posibilidad es pulsar el botón de recargar página, pero de este modo, se volverá a solicitar toda la información de la página Web, no sólo la que falta por recibir.

o Es menos frecuente que la información del esqueleto de la página Web no llegue correctamente, puesto que ocupa menos que las imágenes, y necesita menos tiempo de transferencia, por lo que es más difícil que se corte la transferencia. Sin embargo, a veces ocurre. Cuando esto suceda, aparecerá al final de la pantalla del navegador el siguiente mensaje: “Transfer Interrupted”, o sea, Transferencia Interrumpida. En

1

Barra de Estado

Page 25: Usos Pedagogicos de internet

25Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

estos casos, lo mejor es volver a solicitar la página Web completa, pulsando el botón de Recarga del navegador.

¿Cómo funciona un buscador?

En la actualidad, es tal la cantidad de información que se encuentra en Internet, que se la puede considerar como una base de datos global. Los sitios Web incluyen todos los temas imaginables y también algunos inimaginables. Sobre cada tema hay miles o millones de páginas distribuidas por todo el mundo, escritas en varios idiomas y con distintos niveles de dificultad.

Ante tanta información, se requiere de verdaderos “expertos” para encontrar lo que se busca, para dicha tarea existen los buscadores de Internet.Los Buscadores son sitios Web especializados en la búsqueda y clasificación de la información disponible en Internet. La oferta actual es muy variada: buscadores locales, regionales y globales. Los buscadores son sitios que permiten encontrar páginas relacionadas con un asunto particular de interés.

Aunque el modo de utilización es muy sencillo, los buscadores permiten opciones avanzadas para refinar la búsqueda, cuyo resultado puede ser en muchas ocasiones de miles de páginas. Mediante estas opciones avanzadas se puede acotar la búsqueda y obtener un número de páginas más manejable.

Debido al gran tamaño de Internet y a su naturaleza cambiante, ningún buscador posee registro de todas las páginas que se encuentran en la red. Por ello es aconsejable visitar más de un buscador para contrastar los resultados y en ningún caso pensar que si una página no aparece en un buscador, es que no existe. Los buscadores poseen enormes bases de datos que contienen información referente a páginas web. Estas bases de datos se generan por las altas de usuarios que han creado sus páginas web (esto equivaldría a poner tus datos en un listado telefónico). En muchos buscadores, si el creador de la página no se da de

alta en el buscador, la página no aparecerá. Para las empresas es muy importante promocionar sus páginas en los buscadores para que la gente las encuentre fácilmente.

Otros buscadores, no contentos con ello, poseen programas específicos que rastrean la red 24 horas al día, todos los días. Estos programas procesan una gran cantidad de información y extraen palabras clave que puedan servir para identificar la temática de la página web. Debido a que esta acción se realiza por programas y no por personas, la temática de una página web puede confundirse y aparecer por ejemplo un enlace a la marca de Jeans “Pepe Pardo” cuando estemos realizando una búsqueda sobre el Oso pardo.

Quien busca, ... encuentra

Viajar por Internet es una tarea fácil gracias a los Buscadores. A través de ellos es posible recuperar información de cualquier país del mundo. Basta con conocer la dirección donde se encuentran, para poder acceder a ella.

No siempre es fácil encontrar la información deseada ya que, dentro de Internet, los recursos y datos están dispersos por todo el mundo sin orden alguno. Localizar un tema concreto resulta muy difícil debido a que en la gran telaraña mundial (World Wide Web) existen millones de páginas Web y cualquier búsqueda que se realice, sin el criterio adecuado, proporcionará un resultado muy distinto del adecuado. Por ello, los buscadores son las páginas más visitadas de la Red ya que constituyen el punto de partida para obtener cualquier información que se encuentre en Internet sobre un tema concreto. Por este motivo existe una lucha sin cuartel entre los desarrolladores por ofrecer el buscador o motor de búsqueda más completo, rápido y exacto de la Red.

Hoy en día, la mayoría de los buscadores incluyen otros servicios como directorios, selección de los servidores más interesantes o visitados, noticias, deportes, mapas, páginas amarillas y enlaces a ciertas herramientas de búsqueda especializadas en ciertos temas.

Page 26: Usos Pedagogicos de internet

26Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Divide y Vencerás:

Los directorios en que están divididas estas brújulas en Internet, tratan de clasificar las páginas según los temas que tratan (arte, ciencia, comercio, salud, deporte, etc.). Si se busca información que entre claramente dentro de alguna de estas categorías, el paso principal es seleccionar una de ellas, ya que son el mejor sistema para hallarla, aunque ninguno de los motores existentes ha conseguido catalogar una gran parte de los contenidos de la Red. Y probablemente no puedan conseguirlo nunca, debido al gran dinamismo y continuo cambio que vive Internet.

Búsquedas por Indexación:

Los buscadores, en definitiva, son grandes bases de datos con un lenguaje de consulta potente que permite buscar palabras claves y frases en todas las páginas Web que tienen registradas. Este tipo de búsqueda es muy útil cuando tratamos de realizar una búsqueda específica. Cuanto más precisa sea la clave de búsqueda proporcionada, más fácil será encontrar el documento deseado. Para hallar la información, el motor de búsqueda seleccionará todos los documentos que contengan en el título o en el texto las palabras introducidas.

Yahoo!, la pieza clave:

Uno de los más antiguos, y sin duda el más popular buscador de categorías es Yahoo!. Creado por dos estudiantes (David Filo y Jerry Yung) de la Universidad de Standford en Abril de 1994 como una iniciativa para catalogar los recursos más atractivos de Internet, ahora mismo se ha convertido en una fructífera empresa que incluso cotiza en la bolsa neoyorquina. No en vano es la dirección más consultada a diario de toda la Red.

Se trata de un directorio, es decir, un índice por temas que intenta catalogar y organizar toda la Red. Yahoo examina páginas Web y recursos de todo el mundo y las incluye en una guía jerárquica al ritmo de unas 2.000 entradas diarias. Incorpora cada una de ellas en una categoría determinada, hace un pequeño resumen y lo publica en el catálogo general, un árbol que recoge una parte de lo que pueda existir en ese océano de información que es Internet, un árbol completamente organizado en más de 20.000 categorías con cientos de miles de páginas.

Artículo publicado en la Revista Super Net Magazine en el número 18, con título “Quien busca, ... encuentra”.

Yahoo y google son los principales representante de este modo de búsqueda. Los podemos encontrar en la dirección:

http://www.yahoo.com/. http://www.google.com/.

Este tipo de búsqueda es ideal para cuando estamos buscando información sobre un tema específic. Ejemplo: “Revistas en Internet”, “Astronomía”, o “Música Moderna”.

Por cada uno de estos temas, se nos mostrarán en el buscador muchísimas opciones de páginas. Cada una de ellas trae: un título y una pequeña

Page 27: Usos Pedagogicos de internet

27Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

explicación, que nos dan una idea más concreta acerca de lo que podemos encontrar en esa página sin necesidad de entrar a verla. Es muy importante leer esta información si se quiere hacer una búsqueda más veloz y asertiva.

En caso de que realmente nos interese ver toda la información de la página escogida, no tenemos mas que pulsar sobre su título, e inmediatamente se realizará el enlace hacia la página señalada.El tiempo que tarde cargando, depende en gran medida de lo atascada que esté la máquina que sirve esa página a Internet.

Ejemplo: la siguiente es la ventana principal del buscador Google:

Page 28: Usos Pedagogicos de internet

28Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

En el espacio que está sobre los botones “Búsqueda en Google” y “Voy a tener suerte” usted debe escribir el tema que le interese buscar en la red. Abajo debe señalar si desea buscar en toda la Web (Si elige esta opción aparecerán páginas con este tema en todos los idiomas), en páginas en español o páginas en Colombia.

Ejemplo: En el siguiente recuadro vemos que el tema de Búsqueda es Mario Benedetti y que la opción de búsqueda es en toda la red.

A continuación, el buscador nos devolverá una lista de páginas relacionadas con el tema:

Page 29: Usos Pedagogicos de internet

29Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

El buscador nos presentará una serie de vínculos y elegir el que se ajuste a nuestras necesidades. Podemos ayudarnos de la pequeña descripción de las páginas de enlace.

Formas de búsqueda

Existen dos modos de búsqueda por la WWW:

Por Temas: Este tipo de búsqueda es ideal para cuando estamos buscando información sobre un tema importante, como puede ser, “Revistas en Internet”, o “Astronomía”, o “Música Moderna”.

Por cada uno de estos temas, se nos mostrarán en el buscador muchas páginas que hablan de dicho tema. Cada página viene indicada con un título y una pequeña explicación, que nos puede dar una idea más concreta sobre lo que podemos encontrar en esa página sin necesidad de entrar a verla. En caso de que realmente nos interese ver toda la información de la página escogida, no tenemos mas que pulsar sobre su título, y automáticamente aparecerá la información en nuestra pantalla. El tiempo que tarde depende en gran medida de lo atascada que esté la máquina que sirve esa página a Internet.

Por Palabras Claves: Hay ocasiones en que buscamos temas demasiado concretos como para que se puedan categorizar en un buscador por temas.

Por ello hacemos uso de las palabras claves, (que son aquellas palabras que usamos para describir los conceptos o ideas que buscamos). No son sólo las palabras habituales, sino también cualquier secuencia de caracteres que sirva para localizar nuestro objeto, aunque no sean pronunciables.

Estas palabras están normalmente separadas por espacios en blanco. Y no se debe incluir signos diferentes a los alfanuméricos, a no ser que representen alguna función especial como + - & | ! ya que la mayoría de los buscadores no los tendrán en cuenta.

Técnicas de Búsqueda

Las técnicas de búsqueda son similares en todos los buscadores. Si el programa lo permite, primero se selecciona el idioma de búsqueda en el cuadro correspondiente y también el tipo de elemento que se busca: sitios Web, imágenes, videos, sonidos, etc. Luego, en el cuadro de búqueda se escribe el patrón de búsqueda, que puede ser una palabra, una frase, un conjunto de palabras.

Page 30: Usos Pedagogicos de internet

30Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Para la búsqueda existen dos tipos de técnicas: las básicas y las avanzadas.

Técnicas Básicas:

Búsqueda por ... Ejemplo Resultado

... palabra Borges Lista todas las páginas clasificadas y referidas al apellido Borges

... Frase “ Jorge Luis Borges” Lista todas las páginas clasificadas y referidas específicamente a la persona llamada Jorge Luis Borges

... conjunto de palabras

Jorge Luis Borges Lista todas las páginas clasificadas y referidas a: todos los Jorge, todos los Luis, todos los Borges

... conjunto de palabras y símbolos

Jorge+Luis-Borges Lista todas las páginas clasificadas y referidas a: todos los Jorge y todos los Luis pero ningún Borges

Técnicas Avanzadas:

Nos permite buscar utilizando operadores lógicos como: AND, OR, NOT

Operador Ejemplo Resultado

AND Es la intersección de los dos conjuntos de búsqueda. Apareciendo en el resultado únicamente los elementos que aparecen en los dos conjuntos. Es un operador de reducción

estudiantes AND europeos Lista todas las páginas clasificadas y referidas a estudiantes europeos

NOT Excluye los elementos de uno de los dos conjuntos de la búsqueda.

estudiantes AND NOT europeos

Lista todas las páginas clasificadas y referidas a: todos los estudiantes pero no a europeos

OR Unión de los elementos de los dos conjuntos de la búsqueda. Apareciendo en la búsqueda todos los elementos. Es un operador de ampliación.

estudiantes OR europeos Lista todas las páginas clasificadas y referidas a:estudiantes o europeos

Los buscadores temáticos funcionan de la siguiente manera: al conectar con algún buscador nos encontraremos con una página que contiene una estructura jerárquica de temas, es decir, hay un grupo de temas generales, al seleccionar uno nos sale otro grupo de temas dependiente (cada vez más específico) del que nos llevó allí, y podemos seguir así hasta que localicemos el tema de nuestro interés o se acaben las categorías creadas por el autor del buscador. Ejemplos de buscadores temáticos: Yahoo, Olé.

Los buscadores automáticos son aquellos que a partir de cierta información entregada en lenguaje natural o en alguna especificación puede deducir y recuperar la información que uno está buscando. Para este tipo de búsqueda utilizamos buscadores en donde en el cuadro de búsqueda del mismo se coloca la palabra o frase que mejor represente el tema que se está buscando.

Page 31: Usos Pedagogicos de internet

31Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Están compuestos por tres partes :

o los robots (Son programas que buscan continuamente por todos los servidores de WWW (también en los de News , Gopher y FTP), construyendo un índice de lo hallado que recorren la red escrutándola.

o la base de datos (Contiene todos los URL encontrados, y asociados a ellos). que es construida por los robots.

o el motor de búsqueda (Es la parte que vemos cuando realizamos la búsqueda) que facilita la consulta a la base.

En estos momentos existen métodos variados de búsqueda: los buscadores automáticos, los índices temáticos y los metabuscadores.

Un buscador automático es una base de datos que aloja gran cantidad de páginas sin clasificación temática con tres componentes:

o Un robot o programas que barren continuamente los servidores de www y otros (grupos de noticias, Gopher y FTP).

o La base de datos elaborada por los robots. o El motor de búsqueda que propicia la búsqueda en

la base de datos. Colocando palabras claves sobre el contenido del material que estamos buscando nos presenta una lista de páginas relacionadas.

Hay buscadores generales y especializados. En este tipo de buscadores hay que adoptar estrategias de búsqueda de información a la hora de usarlo como herramienta para la clase, para evitar emplear tiempo excesivo y porque nos podemos encontrar con resultados inapropiados, en la cantidad o en el tema. No vamos a extendernos en este asunto, pero los interesados en profundizar en el tema pueden consultar el completo trabajo de Antonio Vincent (profesor de E.S.) y Juan Manuel Aparicio (profesor

universitario), que trata extensamente las técnicas de búsqueda eficiente y el uso de los operadores lógicos. Otra página de interés es la que realiza la Dirección de Enseñanza Virtual de la Universidad de Málaga. En el artículo de Adell (1995) se incluyen también valiosos consejos para facilitar la búsqueda. Los índices temáticos son elaborados por equipos de personas que catalogan las páginas y las agrupan en directorios por temas, que van de lo más general a lo específico. Los metabuscadores son sistemas de búsqueda que recurren simultáneamente a varias de las bases de datos de otros buscadores, lo que multiplica los resultados. Sin estas poderosas herramientas sería imposible obtener información en Internet; de todas formas, se estima que el volumen de información que contiene la red es 500 veces mayor a la que almacenan todos los buscadores de información, lo que se ha denominado la “Internet invisible”, el agujero negro de Internet. También hay buscadores que intentan cubrir este espacio. Se ha caracterizado a los buscadores en tres grupos, pero en la práctica, por cuestiones de competitividad, para captar internautas y conseguir visitas, es frecuente ver sitios de esta especie que incluyen motores de búsqueda e índices temáticos. Servidores y empresas han puesto de moda los portales, o puertas de acceso a los más variados servicios de Internet: buscadores, recursos, noticias, correo electrónico gratuito, charlas, ocio, compras y un largo etcétera, que tienen gran éxito entre los usuarios. Dentro de este grupo tenemos los portales educativos, que se centran en la oferta de servicios para la docencia: formación de profesores a la información sobre todos los niveles educativos, documentos didácticos, buscadores de servicios y recursos, material didáctico, foros de debate y comunicación...

Page 32: Usos Pedagogicos de internet

32Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Cómo funciona una cuenta e-mail?

Cada usuario de Internet que tenga una cuenta de correo, dispone automáticamente de una dirección de correo. Todo el correo que envía y recibe un usuario de la Red, pasa a través de su Proveedor Internet. Éste dispone de un ordenador dedicado a gestionar el servicio de correo de sus clientes. En este ordenador quedan almacenados los correos electrónicos que reciben los clientes a cualquier hora del día hasta el momento en que el usuario se conecta a la Red y recibe en su propio ordenador el mensaje. Dicho ordenador tiene un nombre de dominio con el que se identifica en Internet. Por ejemplo, si nuestro Proveedor es redp, el nombre de dominio será redp.edu.co. De este modo todos los correos que se envíen a estos clientes, en primer lugar viajarán hasta el Proveedor, y luego hasta el usuario.

Para diferenciar un cliente de otro, hay que añadir un nombre de cliente a la dirección de correo. Normalmente, este nombre es un alias, o sea, un apodo o unas siglas, puesto que el Proveedor tiene varios miles de clientes y muchos de ellos pueden tener el nombre repetido. Así pues, un cliente que

se llame “Fulanito de Copas”, podrá escoger, por ejemplo, sus iniciales: “fdc” como alias.

La dirección de correo completa es la unión del alias y del nombre de dominio del Proveedor, separados por una árroba: “@”. Por lo tanto, la dirección de correo de Fulanito de Copas, cliente de redp será:

[email protected]

¿Cómo funciona un chat?

El servicio IRC (Internet Relay Chat) nos permite entablar una conversación en tiempo real con una o varias personas por medio de texto. Todo lo que escribimos en el teclado aparece en las pantallas de los que participan de la charla. También permite el envío de imágenes u otro tipo de ficheros mientras se dialoga.

Existen muchísimas páginas dedicadas a ofrecer diversos servicios tales como: Noticias, E-mail, E-groups, chat, buscador, etc.

Page 33: Usos Pedagogicos de internet

33Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

TALLER1. Una vez esté conectado a Internet, ingrese la dirección: www.mincultura.gov.co

a) ¿De qué es esta página? _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

b) ¿Qué información observa? _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

c) Sin hacer clic todavía, mencione algunos de los hipervínculos que identifica. _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

d) ¿Existen iconos como hipervínculos? ¿Se imagina con qué lo pueden enlazar? _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

e) Elija el hipervínculo Plan nacional de lectura y bibliotecas que se encuentra en la parte derecha de la pantalla en amarillo. ¿A dónde lo envía éste?, es decir, ¿Qué información le muestra?

_________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

f ) Explore si hay otros hipervínculos en esta pantalla. ¿Cuáles son? Haga enlace con algunos. _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

Page 34: Usos Pedagogicos de internet

34Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

g) Retorne a la página principal. Identifique hipervínculos de su interés y explórelos. Describa brevemente su ruta y la información que encontró.

_________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

2. Ahora vamos a crear un correo electrónico

a) Ingrese a la página www.yahoo.comb) Busque en la pantalla la opción de Yahoo en español (parte inferior), haga clicc) En la parte superior de la pantalla hay un icono de un sobre con la palabra correo, haga clicd) A continuación aparece la pantalla de inicio para ingresar a su cuenta de correo (si ya la tiene) o

crear una nueva. En este último caso, haga clic en la opción de Abrir cuenta.e) Este vínculo generalmente, en casi todos los servidores de correo, le mostrará las condiciones en

que usted aceptaría el servicio de correo. Es importante leer esta información.f ) Luego de haber hecho clic en el hipervínculo de aceptación, deberá llenar el formulario con sus

datos personales. Hay algunos datos necesarios y obligatorios para adquirir una cuenta y otros prescindibles. Allí estará especificado. Siga todas las instrucciones hasta que aparezca la confirmación de que su inscripción ha sido finalizada

g) Haga clic en el enlace “Continúe a Yahoo mail” y explore los servicios que le ofrece su nueva cuenta de correo electrónico. Seguramente al ingresar, encontrará un mensaje de bienvenida del servidor en el cual le presentarán los servicios más útiles y novedosos.

NOTA: No olvide revisar cómo quedó su dirección de correo completa!

3. Vuelva a la página de Yahoo en español

a) Busque la palabra “Chat” en la pantalla, que funciona como un hipervínculo. Haga clic.b) Escriba su Id Yahoo (el mismo del e-mail) y su contraseña. Ingresec) Ahora se encuentra en la página principal de Chat, donde hay diversas opciones de salas de

conversación. Elija la opción lista completa de salas.d) En la parte izquierda puede ver las categorías, haga clic en zonas geográficas y después en

Colombia e) Explore las opciones que le ofrece esta página. Describa lo que va descubriendo: _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________ _________________________________________________________________________

Page 35: Usos Pedagogicos de internet

FUNDAMENTACIÓN PEDAGÓGICAUnidad 2

Page 36: Usos Pedagogicos de internet
Page 37: Usos Pedagogicos de internet

37

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

JUSTIFICACIÓN

Algunos expertos manifiestan que los estudiantes de este tiempo son reacios a la metodología clásica de comprensión, análisis y síntesis, y haciendo vigente aquello de que una imagen vale más que mil palabras, aprenden de manera intuitiva a través de impulsos visuales11. Detrás de la pantalla de un computador, los jóvenes acceden de igual manera a diversión, educación y a un conglomerado de información que dada la cantidad y la diversidad, puede resultar abrumadora y confusa. Es decir que, si queremos asesorar a los jóvenes en el buen uso de Internet, es apremiante conocer lo mejor posible a esta titánica tecnología a la que nos enfrentamos y de la que día a día dependemos más.

Sin embargo, en este caso conocer no es solamente «saber hacer», porque incluso eso lo podemos aprender fácilmente desde Internet mismo; lo que verdaderamente determinará un óptimo uso de éste, es la postura que adoptemos frente a él, lo cual se logra a través de la reflexión acerca del papel que cumple Internet en la vida del hombre y la implementación de estrategias para el establecimiento de rutas y objetivos de uso de la Red.

El programa Usos pedagógicos de Internet, es un espacio para dicha reflexión con miras a que tanto docentes como alumnos desarrollen y perfeccionen destrezas para la búsqueda y la explotación del entorno informático, desde una perspectiva de conciencia colectiva, es decir, reconociendo a Internet como un medio de congregación y no de alineación, como lamentablemente termina siendo en muchos casos.

Precisamente con el objetivo de evitar que nuestros jóvenes caigan en prácticas virtuales asociales, que en vez de producir conocimiento provoquen confusión y tergiversen la cultura en lugar de enriquecer las

ideologías, la Secretaria de Educación de Bogotá, la Fundación Internacional de Pedagogía Conceptual Alberto Merani y la Fundación para el Desarrollo de destrezas Intelectuales Nous, proponen un programa en el cual la comunidad educativa, encabezada por los docentes, adquiera el compromiso de crear modelos reguladores y orientadores del uso de Internet, dentro y fuera del ámbito escolar. Una de las principales ambiciones de este módulo es involucrar a la comunidad en los proyectos planteados desde el aula y por ello es fundamental que tanto docentes como estudiantes se formen en la comprensión de los lenguajes de la red y en estrategias que permitan su máximo aprovechamiento.

Si nos aproximamos a Internet desprovistos de un plan, sin criterios y propósitos definidos, es como si estuviéramos frente a una enorme biblioteca en desorden. Por ello, adoptarlo como un recurso principalmente comunicativo, requiere no sólo de una sistematización planteada desde un modelo pedagógico, sino también de la constante creación de estrategias, planes, guías, metodologías, etc. que permitan potencializar las funciones de la Red.

Día a día, la preocupación por sistematizar el uso de Internet desde el aula es más latente alrededor del mundo. En Latinoamérica, por ejemplo, países como Chile y Argentina, están a la vanguardia en proyectos investigativos y creativos en cuanto a la implementación de TICs (Tecnologías de la Información y la Comunicación) en procesos escolares. Jaime Sánchez DCC de la Universidad de Chile12, resalta el manejo de Internet como:

o Recurso de información o Recurso metodológico o Medio de difusióno Herramienta pedagógicao Medio de construcción (creación de paginas Web)

11 CATALÁN, Xavier. Nuevas tecnologías en el aula. .http://www.educaweb.com/esp/servicios/monografico/ntaula/107729.asp 12 SÁNCHEZ, Jaime. Usos educativos Internet. http://www.dcc.uchile.cl/~jsanchez/

Page 38: Usos Pedagogicos de internet

38

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

o Administrador (Para el uso de gestiones relacionadas con el funcionamiento de la entidad educativa)

Lo anterior demuestra como a través de Internet las instituciones educativas ocupan un papel fundamental en la red constitutiva de cultura y conocimiento a escala global, por lo tanto, la negación o la ignorancia de este recurso, implica la privación a toda una comunidad y su entorno social, de una forma de aprendizaje y expresión plurilinguística, es decir, que ofrece la posibilidad de acceder y utilizar diferentes tipos de lenguajes (icónico, textual, sonoro) a través de una forma sistémica.

Por último, y por si acaso todo lo anterior no fuese suficiente, vale la pena resaltar uno de los aspectos que más nos aproximan y, por qué no, humanizan Internet: Su funcionamiento interno es análogo al pensamiento humano. Janet Fiderio afirma que “los sistemas Hipertextuales – los que constituyen la Red – imitan la habilidad del cerebro para adquirir, almacenar y retener información por lazos referenciales en accesos rápidos e intuitivos”13. Es decir que, la Red de información distribuida (Internet) se configura a partir de asociaciones, tal y como nosotros conocemos y damos cuenta de las distintas realidades. “Igualmente, la memoria no es asunto de un órgano especializado, pero pone verdaderamente en juego un gran número de mecanismos heterogéneos y, sobre todo, está distribuida en el conjunto de la red neuronal. En fin, el cerebro no sigue un programa muy definido, no obedece a ningún supercerebro; se dice, por lo tanto, que se auto organiza”14. Siendo así, sería un desatino intentar relacionarnos con Internet asumiéndolo como un mecanismo ajeno a nosotros, – un invento más que hace parte de la lista de objetos que facilita la vida del hombre – en vez de un mecanismo propio del hombre relativo al aprehendizaje y a la comunicación.

INTERNET Y EL HOMBRE

Mucho se ha hablado de Internet como la más grande de las Nuevas Tecnologías, pero poco se ha dicho de aquello que tiene de humano. Si bien la sigla de TICs bajo la que se ha acogido favorablemente Internet, se refiere a la comunicación a través de tecnologías informáticas, estos dos últimos conceptos (tecnología e informática) siempre terminan por opacar al primero. Esto es un gravísimo error y una enorme contradicción, teniendo en cuenta que la capacidad de inventar nuevas tecnologías relacionadas con el manejo y la difusión de información ha sido desarrollada por el hombre gracias a la transmisión de diversos conocimientos, es decir, gracias a la comunicación. De hecho hay quienes afirman que al contrario de lo que postula Engels, fue la comunicación y no el trabajo, la que llevó al desarrollo y a la evolución del hombre, ya que sin la capacidad de transmitir conocimiento, el hombre viviría por siempre atascado en una etapa de perenne descubrimiento pero ausencia absoluta de progreso. Por lo tanto, es a partir de allí que debería plantearse la reflexión acerca de Internet y su relación con el hombre y las distintas comunidades a las que este pertenece.

Si miramos las características esenciales de Internet y las características esenciales del Hombre, encontraremos más de una analogía que nos hace pensar acerca de la pequeña distancia que nos separa, es más, nos hace dudar si realmente están distantes el uno del otro, o si acaso pudieran ser uno solo. Tal vez en un principio suene algo osado afirmar que Internet y el hombre son la misma cosa, pero si seguimos la lógica que nos propone la comunicación como punto de partida para un trabajo intelectual en torno a Internet, veremos que poco a poco los puntos de convergencia entre ambos servirán de directrices a esta reflexión.

13 FIDERIO, Janet. A grand vision. En: Byte, October 1988.pp. 237-245 p.242. 14 LEVY, Pierre. El tiempo real, una velocidad trascendental, entrevista realizada por Patrick Javault. (Este documento se encuentra completo en la página web de curso, en el área de «Recursos»)

Page 39: Usos Pedagogicos de internet

39

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Como ya se mencionó, Internet no sólo es reconocido como el máximo medio de comunicación de nuestros tiempos, sino que se constituye como la fusión de múltiples lenguajes manejados por el hombre, esto hace de él un escenario donde la comunicación se hace posible a través de casi cualquier código deseable, posibilitando el proceso de significación y la composición o producción de mensajes prácticamente a cualquier nivel, siendo la Virtualidad el más grande alcanzado. Este concepto trascendió el signo lingüístico, que hasta antes de la aparición de Nuevas Tecnologías Informáticas, era la única forma de conocer la realidad en ausencia de ésta. Así, la virtualidad incorpora una nueva forma de conocimiento que no es la representación a través del símbolo y la significación, ni el contacto directo con la realidad, aunque su intención es aproximarse al máximo a esta última a través de la simulación.

En este punto, vale la pena recordar que conocimiento no es sinónimo de aprehendizaje, y mucho menos que todo conocimiento es útil y beneficioso. Sin embargo, satanizar a Internet, como medio de acceso, carente de control, a cualquier realidad, es como satanizar a la realidad misma, por ello la propuesta y el llamado a la comunidad educativa, es a la promoción de espacios para la reflexión académica en torno a este tema.

Comunicación y comunidad

Desde el principio de los tiempos el hombre vive en función del aprendizaje y la transmisión de saberes, y es gracias a ello que se puede establecer la vida en comunidad. Uno de los fines de la comunicación fue y sigue siendo el aprendizaje, la enseñanza y el desarrollo del conocimiento al interior de las colectividades. Por jugar un papel muy importante en la evolución – en el más amplio sentido de la palabra– del hombre, la comunicación es la facultad que más hemos desarrollado. En este sentido el arte y la tecnología han estado al servicio de la naturaleza expresiva de los seres humanos y de la necesidad de diversificar los vínculos con la realidad.

Entendemos por comunicación todo proceso en el que se intercambian mensajes codificados en diversos tipos de lenguajes. Gracias al esquema que representa el proceso comunicativo, podemos entender cómo se estructura éste para cada caso particular:

Recordemos la función de cada elemento para manejar el mismo lenguaje de aquí en adelante en lo que se refiere a la comunicación, finalmente, el éxito de cualquier proceso comunicativo depende de la optimización de cada una de estas funciones.

o Emisor: Aquel que transmite una informacióno Receptor: Aquel que recibe dicha informacióno Mensaje: información configurada en un lenguaje

conocido por el emisor y, para que pueda ser comprendida, por el receptor.

o Código: Conjunto de señas propias de un lenguaje, usado para configurar un mensaje.

o Canal: Es el medio por el cual se desplaza el mensaje.

o Contexto: Conjunto de circunstancias dadas que posibilitan el proceso comunicativo.

o Retroalimentación: Es la respuesta producida por el receptor con respecto al mensaje.

Aunque muy elementales, las anteriores definiciones son de vital importancia para establecer un lenguaje común en torno al aprehendizaje y a la reflexión de la implementación de TICs en el aula.

Cuando hablamos de medios de comunicación masivos tales como Internet, sabemos que un mismo canal permite el intercambio de información entre miles de personas y comunidades de manera simultánea. Por lo tanto, se constituye en un propulsor de múltiples

CANAL CONTEXTO

EMISOR MENSAJE

CODIGO

RETROALIMENTACIÓN

RECEPTOR

Page 40: Usos Pedagogicos de internet

40

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

TALLER

Las siguientes actividades tienen como propósito comenzar un acercamiento a los lenguajes manejados en Internet de una forma más sistemática, e ir formando un criterio en torno a la estética compuesta por estos, ya que la presentación del contenido, determina en gran parte, la lectura que de éste se haga.

1. Visite la página www.bogotaturismo.gov.co. Haga una descripción detallada de lo que aparece en la pantalla: imágenes, Títulos, Textos (especifique cuáles son hipervínculos).

2. De acuerdo a lo que ve en la página principal diga qué información le presentan y cómo está clasificada.

3. ¿Cree usted que los elementos presentados en esta página están dispuestos en lenguajes claros y atractivos para usted y sus estudiantes? ¿Por qué?

4. ¿Cómo cree usted que favorece el diseño de la página a la función de ésta, – el turismo en Bogotá - ? ¿Por qué?

5. ¿Qué servicio ofrecido por esta página le llama más la atención? ¿Por qué?6. Después de hacer una libre exploración de este portal (acceder a algunos de los hipervínculos

presentados) realice una valoración de su recorrido teniendo en cuenta:o La calidad de información de acuerdo a las expectativas generadas a través de la página principal.o La facilidad y pertinencia de los diferentes enlaces.o La cantidad y calidad de apoyos visuales.

mensajes de diversa índole, que pueden ser captados de manera indiscriminada por n receptores. Las grandes ventajas y los enormes peligros que dicha situación suscita son temas de reflexión obligados, no sólo a lo largo de éste módulo, sino también a lo largo de todos los procesos escolares.

En todo proceso comunicativo es indispensable manejar lo mejor posible los códigos con los que se han de articular los mensajes, con el fin de garantizar

una óptima producción y recepción de información. Por ello, al iniciar procesos comunicativos a través de Internet es necesario tener en cuenta los distintos lenguajes con que éste trabaja, - icónicos, textuales y sonoros - y elaborar un plan de competencia en tales lenguajes. Es decir, que una de las primeras tareas del docente consiste en desarrollar, tanto para sí mismo como para con sus estudiantes, un estudio de lectura y producción de los códigos que encierran esos lenguajes.

TICs: Tecnologías de Información y Comunicación

Antes de abordar directamente los procesos informáticos relativos a la comunidad educativa, es preciso tener claro el término en torno al cual adquiere sentido el uso de Internet como herramienta pedagógica: Tecnologías Informáticas de la Comunicación. Sin embargo, si existe un concepto

que tiene prioridad dentro de esta denominación es comunicación, por ello se ha dedicado con antelación un apartado a la introducción de ésta, para desde allí tratar de entender como funciona una sociedad que se establece desde ese principio.

Los caminos hacia la sociedad de la información pueden ser múltiples, dependiendo de los objetivos que una sociedad se plantee. Con el fin de abordar el

Page 41: Usos Pedagogicos de internet

41

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

debate sobre estos objetivos de una forma coherente, y para establecer las prioridades de la agenda política, es necesario distinguir con claridad entre objetivos y medios.

El concepto de “Sociedad de la Información” es muy complejo y su nivel de desarrollo es aún incipiente. La comunidad intelectual tendrá que reducir esta complejidad mediante un proceso de abstracción que permita expresar la “realidad”paradigmática en términos de entidades concretas e interrelaciones. Será necesario establecer los términos y los esquemas que permitan debatir el concepto de “sociedad de la información” puesto que este modelo es esencial para plantear objetivos específicos de desarrollo. El marco conceptual utilizado por la CEPAL se basa en las características generales de las tecnologías de la información y las comunicaciones (TIC) y del proceso de digitalización resultante, que son el núcleo de este paradigma emergente.

El comportamiento humano se basa en el intercambio de información y en la comunicación. La comunicación puede verificarse mediante diversos canales: el habla, textos, gestos, movimientos, expresiones, afectos; hasta la falta de expresión puede transmitir cierto tipo de información. Al fin y al cabo en las relaciones humanas resulta imposible no comunicarse.

Un porcentaje creciente de la comunicación humana puede digitalizarse y de hecho está digitalizado. Este proceso comenzó hace unas décadas y se acelera a medida que evolucionan las soluciones tecnológicas. Estos sistemas tecnológicos son lo que se suele denominar TICs. La utilización de TIC tiene consecuencias significativas en el modo de pensar y distribuir por todo el mundo la información y los conocimientos codificados.

Las TICs se definen como sistemas tecnológicos mediante los que se recibe, manipula y procesa

información, y que facilitan la comunicación entre dos o más interlocutores. Por lo tanto las TICs son más que informática y computadoras, puesto que no funcionan como sistemas aislados sino en conexión con otras mediante una red. También son algo más que tecnologías de emisión y difusión (TV, radio) puesto que no sólo dan cuenta de la divulgación de información, sino que además permiten una comunicación interactiva.

La utilización de TIC conlleva necesariamente al proceso de digitalización, mediante el cual se codifican en números binarios los flujos de información, las comunicaciones y los mecanismos de coordinación, ya sea en forma de textos, sonidos, voz, imágenes u otros medios. Las TIC digitales utilizan un lenguaje binario para recibir y manipular la información, y también para comunicarse entre ellos. La sociedad de información es una consecuencia directa de este desarrollo en el campo de la información y las comunicaciones.»15

Tecnología como lenguaje

Ya se ha hablado de la comunicación y del papel de esta en la sociedad actual, sin embargo, no es suficiente con enumerar las diferentes formas en que las comunidades de hoy en día intercambian y generan información, es necesario, si se quiere participar como sujeto activo, conocer los diferentes lenguajes que maneja la nueva sociedad de la información a través de diversas tecnologías. Por ello, a continuación se presentan una serie de herramientas básicas para elaborar una lectura audiovisual más rica y completa, teniendo en cuenta la diversidad de elementos que componen los códigos utilizados en tecnologías como Internet. Para hablar de la tecnología como lenguaje, antes, es preciso tener en claro qué es la tecnología y cuál es la parte tecnológica de Internet, y las posibilidades que ésta ofrece.

15 Los caminos hacia una Sociedad de la información en América Latina y el Caribe. http://www.psi.gov.ar/documentos.htm

Page 42: Usos Pedagogicos de internet

42

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Las personas tenemos diversas necesidades, que con el paso del tiempo se han ido complejizando. Dichas necesidades plantean problemas concretos que requieren una satisfacción, pueden ser bienes, procesos o servicios, denominados productos tecnológicos.

El rendimiento de los productos tecnológicos depende directamente del uso racional, organizado, planificado y creativo de los recursos materiales.

Toda tecnología es por esencia una labor colectiva, ya que desde el principio de su desarrollo hasta el uso de ésta, involucra y convoca diversos grupos de personas. La tecnología usada en la Red no es la excepción, al contrario, es el paradigma de las tecnologías sociales teniendo en cuenta que uno de sus principales objetivos es la difusión de información a nivel global. Por lo tanto, la tecnología de Internet está referida a los medios de comunicación.

A continuación presentaremos los diferentes mecanismos utilizados en Internet para disponer la información, es decir, las principales características de los medios audiovisuales, con el fin de realizar lecturas y propuestas más competentes basadas en la Red.

El lenguaje audiovisual-interactivo, propio de Internet, maneja códigos tales como: imágenes, sonidos, texto.

Nuestro cerebro procesa las informaciones abstractas, tales como palabras, esquemas, etc. mediante un proceso lineal de análisis, síntesis, abstracción, deducción y lógica, que consiste en captar de manera sucesiva la información y decodificarla poco a poco hasta llegar a su significado. Dicha información casi siempre es unisensorial, es decir, que proviene de una única fuente y suelen referirse a contenidos conceptuales. Ejemplo: la lectura de un libro.

Por otra parte, las informaciones concretas (dibujos analógicos, fotografías, etc.) se procesan de manera global, es decir, intuitiva, holística y analógicamente. Debido a que este tipo de informaciones son multisensoriales y en ellas predominan los contenidos formales como medio de conceptualización, son captadas por nuestro cerebro de manera simultánea, provocando una serie de reacciones emotivas portadoras de significados.

Este tipo de información facilita el aprehendizaje mediante la asociación imagen-concepto. En Internet los dibujos y fotografías son utilizadas aprovechando su cualidad llamativa (en diseño, color, forma) con diferentes funciones. Entre las más comunes están los íconos, que sirven de enlace con otras páginas o funciones. La siguiente imagen, por ejemplo, está relacionada con los conceptos de diversión, juegos, variedad, espectáculo, etc. y para un niño sería de fácil identificación, entendimiento y aceptación.

EL CIRCO

Page 43: Usos Pedagogicos de internet

43

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Aspectos visuales

Las imágenes se caracterizan por representar visualmente cosas que existen y no existen, y de acuerdo a este criterio se clasifican:

La Iconicidad o abstracción está determinada por el grado de reflejo de la realidad. De acuerdo a esto las imágenes pueden ser:

o Figurativas: Cuando son un reflejo fiel de la realidad (Dentro de estas clasifican las fotos lógicamente)

o Esquemáticas o simbólicas: Reflejan la realidad análogamente, es decir, a través de un parecido. (Por ejemplo una señal de tránsito que indica la proximidad de un restaurante)

o Abstractas: Su significado es arbitrario, está dado por convenciones

SE PROCESA HOLÍSTICA, ANALÓGICA

E INTUITIVAMENTEMULTISENSORIAL

INFORMACIÓNABSTRACTA

INFORMACIÓN CONCRETA

INFORMACIÓN

DIBUJOS FOTOS

Imágenes fiel reflejo de

la realidad

ESQUEMÁTICA

ABSTRACTA

FOTOGRAFÍAS ILUSTRACIÓN REALISTA

FIGURATIVA

IMAGEN ICÓNICA

Page 44: Usos Pedagogicos de internet

44

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

De acuerdo con su significado las imágenes pueden ser denotativas (un significado) o connotativas (más de un significado), sin embargo casi siempre a una imagen, por no ser la realidad, podrán corresponderle varios significados.

Por otra parte, la configuración (tamaños, colores, diseño, etc.) de una imagen puede hacerla original o redundante, ello depende de qué tan nuevos o estereotipados sean los elementos que la componen. La distribución de estos elementos equivale a la COMPOSICIÓN, los siguientes son los aspectos que ésta tiene en cuenta: LÍNEASo Líneas Verticales y horizontales: Provocan una sensación de quietud y

estabilidad. Las líneas verticales dan la sensación de vida y sugieren una situación de vigilancia. Mientras que las líneas horizontales producen paz e incluso sugieren una idea de muerte. El exceso de este tipo de líneas puede generar monotonía en el observador.

o Líneas Oblicuas y curvas: Estas producen impresión de movimiento y dinamismo. En general las líneas inclinadas y curvas dan relieve y sensación de continuidad a las imágenes. Las curvas además sugieren sensualidad. Este tipo de líneas son en su mayoría más agradables que las líneas horizontales y verticales.

AIREEste se refiere al espacio que existe entre los objetos principales de una imagen y los límites del encuadre. Por ejemplo en el primer plano y en el plano medio es conveniente dejar un espacio encima de los objetos, así, al tratarse de video es necesario dejar aire delante de objetos que se desplacen.

Una de las principales reglas de la composición es la REGLA DE LOS TERCIOS. Según ésta, los personajes u objetos principales deben ponerse en las intersecciones resultantes de dividir la pantalla en tres partes iguales de manera vertical y también de manera horizontal. De esta manera se consigue evitar la monotonía que producen los encuadres demasiado simétricos. Para ello hay que tener en cuenta que los objetos principales de la imagen no deben ocupar el centro del encuadre, así como tampoco la línea de horizonte deberá dividir el encuadre en dos partes iguales.

Existe un factor que resulta muy agradable en la composición de imágenes: La simetría. Ésta se da cuando aparece repetido un elemento de manera que uno de ellos parece el reflejo del otro en un espejo.

1

VISITE LA PÁGINA www.icarito.tercera.cl OBSERVE LOS DIFERENTES TIPOS DE IMÁGENES DE ACUERDO A SU ICONICIDAD. EJEMPLOS:

• Lafotodeunincendioforestalhace referencia precisamente a un incendio forestal (FIGURATIVA)

• En la sección de comunidadIcarito se muestran varios servicios entre ellos GALERÍA DE ARTE representada por la imagen de unos pinceles. Esto corresponde a la construcción de una analogía entre el arte y un tipo de herramientas para la creación artística. (ESQUEMÁTICA)

• En la página principal hay unhipervínculo de ESPECIALES, haga clic. En la siguiente página encuentra un cuadro en el que aparece una cinta roja, junto a esta dice DIA MUNDIAL DEL SIDA. Este es un símbolo arbitrario determinado por convención. (ABSTRACTO)

Page 45: Usos Pedagogicos de internet

45

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Los elementos mencionados anteriormente dependen en gran medida del uso del color, ya que éste despierta diferentes sensaciones. Dentro de los colores cálidos, aquellos que provocan excitación, estimulación y hacen ver los espacios más espacios, se encuentran:o El blanco: que además de dar luz y brillo a la composición, produce

calma. o El amarillo: un color vivaz y divertido.o El naranja: Un color familiar y llamativo.o El rojo: Comunica sensaciones de excitación, agresividad y

movimiento.Los colores fríos en cambio, provocan sensación de lejanía y adormecimiento, dentro de estos se distinguen:o El azul: autoridad, lealtad, dignidad, el infinito.o El verde: Es relajante, aunque también se asocia a la esperanza, salud,

vitalidad, seguridad.o El negro: Se relaciona con el misterio, la ignorancia, el miedo, la

muerte

Recursos visuales y lingüísticos16

o ELIPSIS. La ELIPSIS consiste en la omisión de un elemento que, aun así, se adivina.

o METONIMIA. La METONIMIA consiste en la sustitución de un elemento por otro con el que tiene una relación de tipo causa-efecto, continente-contenido, proximidad o contexto.

La sinécdoque es un tipo de metonimia que consiste en coger el todo por las partes o viceversa. También puede suponer la sustitución de elementos con una contigüidad espacial, temporal o nocional. Por ejemplo: mostrar con un plano de detalle sólo una parte del objeto, la más significativa, la que pueda despertar más el interés del espectador. A partir de ella, el espectador tendrá que reconstruir lo que falta.

1

Observe los planos en que se divide la página de Icarito, verá que horizontalmente se diferencian tres espacios: • Dondeseencuentraeltítulo

(Icarito) y el menú principal• Laseccióndeartículosconsus

respectivas fotos• Laseccióndelíndice(guíapara

estudiantes, comunidad Icarito, etc.)

Verticalmente también notará una división marcada en tres partes de la pantalla

1

OBSERVE LA PÁGINA www.elsabio.com Y COMPARE SU IMPRESIÓN ESTÉTICA CON LOS CRITERIOS DE COMPOSICIÓN AQUÍ DADOS

16 http://dewey.uab.es/pmarques/avmulti.htm

1Esta imagen se caracteriza por tener unos rasgos exagerados: La nariz y la boca, por ejemplo, son muy grandes para la cara, al igual que los pies con respecto al cuerpo. La flor en su mano también es sobredimensionada, es prácticamente igual a la cara.

Hipérbole

Page 46: Usos Pedagogicos de internet

46

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

o HIPÉRBOLE. La HIPÉRBOLE es una exageración que busca provocar un mayor impacto al espectador. Se suelen presentar utilizando imágenes irreales, trucos y efectos especiales.

o COMPARACIÓN. La COMPARACIÓN consiste en la presentación de dos elementos con el fin de que se puedan comparar sus cualidades y propiedades. Es un recurso muy utilizado. En el lenguaje verbal un ejemplo puede ser decir: “Es lento como una tortuga.”

o METÁFORA. La METÁFORA consiste en una comparación muy exagerada en la que se elimina la comparación entre un producto y el otro; y se sustituye directamente un producto con el otro. Se identifica un término real con uno imaginario con el que tiene una determinada semejanza. En el lenguaje verbal un ejemplo puede ser decir: “Es una tortuga.”

o SÍMBOLO. El SÍMBOLO es un tipo de metáfora que representa un valor o un conjunto de valores de una sociedad. Su significado trasciende del significado que tendría normalmente para evocar otra realidad.

o PERSONIFICACIÓN. La PERSONIFICACIÓN consiste en dar a un

objeto o animal atributos propios de las personas. Por ejemplo cuando se presenta a unos animales hablando. Las

personificaciones pueden producir un gran impacto en los espectadores, sobre todo a los jóvenes.

o CONTRADICCIÓN. La CONTRADICCIÓN o antítesis consiste en mostrar una contradicción. Cuando la contradicción sólo es aparente se denomina paradoja.

o HIPÉRBATON. El HIPÉRBATON consiste en una alteración del orden lógico de los elementos de una imagen o secuencia. Por ejemplo: personas que andan por el techo, cambios de perspectiva...

o ALITERACIÓN. La ALITERACIÓN consiste en la repetición de una serie de elementos que tienen sonidos parecidos. Por ejemplo: “Pásate a la pasta”

o REPETICIÓN. La REPETICIÓN, iteración o redundancia, consiste en la repetición de determinados elementos en una imagen o secuencia.

11

1

EXPLORE LAS PÁGINAS http://www.teddi.ua.es/infantil/TeddiInfantil.htm Y http://www.aldeaeducativa.com/ E IDENTIFIQUE QUÉ RECURSOS VISUALES Y LINGÜÍSTICOS UTILIZA

JUSTICIA =

Símbolo

Personificación

Page 47: Usos Pedagogicos de internet

47

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

o JUEGOS DE IDEAS. Los JUEGOS DE IDEAS y los juegos de palabras consisten en establecer asociaciones, presentar ideas chocantes utilizando palabras de doble sentido, conceptos ambiguos, ironía...

RECURSOS SÓLO LINGÜÍSTICOS

o FRASES HECHAS. Citas y refranes utilizados popularmente. “CAMARON QUE SE DUERME SE LO LLEVA LA CORRIENTE”

o IDENTIFICACIÓN PALABRA-MARCA. Se aprovecha una palabra que tiene letras o fonemas parecidos a los de la marca.

o DILOGÍA. Uso de palabras polisémicas (banco, rollo...)

o IRONÍA. dar a entender lo contrario de lo que se expresa.

o ONOMATOPEYA. Palabras cuya lectura imita un sonido (clic, guau...).

o INTERJECCIÓN. Uso de combinaciones de letras que expresan un estado de ánimo (uuaauuu!...)

o EXHORTACIÓN. Advertencia o consejo (busque, compare...)

o INTERROGACIÓN RETÓRICA. Pregunta innecesaria que no espera respuesta.

“¿TE GUSTARÍA PARTICIPAR?”

o ALUSIONES. Frases con las que se alude (sin nombrarlo, tabú, motivos estéticos...) a una persona o palabra.

o NEOLOGISMO. Creación de una nueva palabra.

o PALABRAS COLOQUIALES Y VULGARISMOS, FRASES POÉTICAS, RIMA...

FUNCIONES DE LA IMAGEN17 A partir de las aportaciones de Rodrígez Diéguez (1977) y Santos Guerra (1983): - Función motivadora- Función vicarial (es necesaria para el aprendizaje de algunos contenidos

de naturaleza icónica)

1

EXPLORE LA PÁGINA www.maloka.org Y ENCUENTRE ALGUNOS RECURSOS LINGÜÍSTICOS.

17 Ibid.

Page 48: Usos Pedagogicos de internet

48

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

- Función informativa- Función explicativa (favorece la comprensión) - Función de comprobación (facilita la verificación de una idea)- Función redundante (de refuerzo)- Función sugestiva (potencia la imaginación, creatividad...)- Función estética (origina nuevas sensaciones)- Función recreativa (lúdica)- Función expresiva (facilita la expresión personal)

TEXTOS Y GRÁFICOS. A veces las imágenes van acompañadas de texto (verbal o escrito) y gráficos sobreimpresos. Sus funciones pueden ser diversas según la intencionalidad del creador de las imágenes:- Ampliación de la información que muestran las imágenes. Expresión de ideas y conceptos o de emociones y

sentimientos. Invitación a la reflexión.- Presentación de un logotipo o marca que pretende llamar la atención y facilitar la memorización de la marca.- Repetición del significado de las imágenes. A veces sintetiza con una frase o palabra el significado de una

secuencia (eslogan...).- Proponer una comparación entre las imágenes y lo que evoca el texto.- Presentar una contradicción, cuando las palabras dicen lo contrario de lo que se ve. Esto impresiona y provoca

curiosidad.

TALLER

1. Elabore un cuadro descriptivo y crítico de la página principal de www.aulainfantil.com, teniendo en cuenta los siguientes criterios:

o Cantidad de textoo Tamaño y fuente (tipo de letra) del textoo Cantidad y calidad de imágenes (exceso, carencia, nitidez fotográfica, tamaños, etc.)o Uso del color (resaltar títulos, resaltar imágenes, etc.) o Significado o sugerencia del color en texto o imagen.o Uso de informaciones abstractas o concretas.o Uso de líneas.o Recursos visualeso Recursos lingüísticos o Función de la imagen.o Función del texto con relación a la imageno Uso de imagen en movimiento.

2. Compare las siguientes páginas, y determine las ventajas y desventajas de cada una para su uso pedagógico de acuerdo a los criterios de diseño mencionados anteriormente. Tenga en cuenta qué tanto apoyan el aprendizaje del concepto...

Page 49: Usos Pedagogicos de internet

49

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

(Recuerde que para este ejercicio no es muy importante manejar el (los) concepto(s) presentados, sino tener en cuenta la propuesta estética de la página)

o www.contraclave.org, menú EDUCACIÓN: Biología / La expresión del mensaje genético. (Es necesario tener flash para ver esta página)

o http://www.um.es/~molecula/dupli01.htmo http://www.ciencia.net/VerArticulo/ADN-y-Transmisi%C3%B3n-del-mensaje-gen%C3%A9tico?idArticu

lo=51411

VISITE LA PÁGINA http://www.eduteka.org/ComprensionLecturaInternet.php, LEA EL DOCUMENTO QUE ALLÍ APARECE Y ELABORE UN ENSAYO DONDE PLANTEE SUS PUNTOS DE VISTA CON RESPECTO A LA LECTURA EN INTERNET, CON EL FIN DE ORGANIZAR UN DEBATE EN EL SEMINARIO.

Conclusiones

El uso de Internet como medio de comunicación, dentro del cual se dispone de una gran cantidad de información de toda clase, requiere de la competitividad en diversos aspectos tales como:

o El conocimiento básico de su estructura con el fin de ejecutar tareas tales como navegar, buscar, establecer contactos (chat, e-mail , etc.). Todos estos aspectos son más de índole técnico o teórico.

o El manejo de códigos (lenguajes) elementales que cumplen diferentas funciones de acuerdo al contexto.

o Las posibles funciones que desempeñan imágenes fijas, imágenes en movimiento, texto, texto-imagen, etc. De acuerdo a los contenidos o servicios presentados en los diversos portales.

Sociedad de la información

«Se llama Sociedad o Era de la Información a la utilización masiva de herramientas electrónicas con fines de producción, intercambio y comunicación. Estas herramientas son conocidas como Tecnologías de la Información y las Comunicaciones (TICs) y pueden clasificarse de la siguiente manera:- PC, servidores o cualquier otro dispositivo de hardware.- Telecomunicaciones,- Herramientas de productividad administrativas (por ejemplo, un

sistema de liquidación de haberes).- Herramientas de productividad material (como un sistema de control

de planta)- Productos inteligentes (por ejemplo, alarmas con detectores de

movimientos o microondas que pueden programarse para tener listo el café de la mañana).

Page 50: Usos Pedagogicos de internet

50

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Las TICs están transformando profundamente la economía porque permiten generar riqueza a distancia y en red, superando las fronteras geográficas y políticas. La nueva economía no está centrada en los recursos naturales ni en las materias primas, sino en los flujos electrónicos de información. Pero el valor diferencial, en términos de productividad y competitividad, no está ceñido a lo que las computadoras pueden producir, sino a la creatividad del hombre que innova sobre los usos de estas herramientas.

Nadie podrá permanecer al margen de este proceso revolucionario que supone la incorporación masiva de estas herramientas en la sociedad, puesto que los beneficios que aportan son por demás relevantes:- Elimina las barreras de tiempo y espacio.- Facilita las comunicaciones.- Internet, como herramienta estándar de

comunicación, permite un acceso igualitario a la información y al conocimiento.

- Favorece la cooperación y colaboración entre distintos estamentos.

- Aumenta la producción de bienes y servicios de valor agregado.

- Potencialmente, eleva la calidad de vida de lo individuos.

Los gobiernos inteligentes tampoco pueden permanecer indiferentes a la sociedad de la información, ya que son conocidos los beneficios de estas nuevas tecnologías aplicadas a su propia gestión:- Constituyen pilares fundamentales para

modernización y eficacia del estado.- Aportan transparencia al sector público.- Acercan el gobierno a los ciudadanos y permiten

la participación de la población en los procesos de tomas de decisiones.

- Favorecen a la descentralización.- Aceleran los tiempos de gestión y permiten la

producción de mayor cantidad de resultados.- Facilitan las tareas de control internas y externas.- Aumentan considerablemente la posibilidad de

compartir recursos.

Las TICs aplicadas a la gestión de gobierno permiten invertir el modelo tradicional “hacia dentro” de la tecnología en la administración pública, transformándolo en un planeamiento “hacia fuera”, donde es el ciudadano el eje conductor de los sistemas de información públicos. De esta manera rompe con el prejuicio del “Estado ineficiente” y de “la democracia sin participación real en el control”.

Sin embargo, en este contexto global -que propone un nuevo escenario de ventajas competitivas-, dentro del cual la informatización de las organizaciones constituye un hecho prácticamente ineludible, Latinoamérica, como otras regiones en desarrollo, no se encuentra suficientemente preparada para enfrentar la revolución digital y la nueva noción de bienestar que conlleva.

La capacidad para utilizar las TICs en el desarrollo de la vida política, económica y social, dependerá principalmente del éxito en formar una fuerza de trabajo a escala global y estimular la capacitación laboral continua en tecnologías digitales.

Los gobiernos responsables no pueden ignorar que las TICs libradas a las fuerzas del mercado muy probablemente acentúen la concentración económica, generen homogeneidad cultural y se constituyan como una nueva fuente de desempleo, sea por la sustitución de mano de obra por tecnología o porque la carencia de capacitación de los ciudadanos en su uso y explotación no les permita acceder al mercado laboral. Estas son sólo algunas de las razones por las cuales garantizar el acceso universal a las TICs adquiere tal importancia estratégica.

Con base a esta creencia, los gobiernos y administraciones de diversos niveles del mundo entero, crean infraestructuras y redes, páginas Web, fomentan el comercio electrónico, desarrollan o estimulan nuevas formas de educación y formación no presenciales, otorgan beneficios y bonificaciones para el acceso, ofrecen o facilitan la instalación de telecentros comunitarios, entre otras acciones..»

Page 51: Usos Pedagogicos de internet

51

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

La brecha digital

«El término brecha digital refiere no sólo a la diferencia entre los individuos sino también entre grupos familiares, comunidades educativas, empresas y áreas geográficas que tienen o no la oportunidad de acceder a las tecnologías de la información y las comunicaciones (TIC) y utilizarlas con fines diversos.

Por otro lado, la brecha no remite únicamente al acceso, sino también al uso y aprovechamiento inteligente de las TICs vinculado a la producción, comunicación, comercialización y administración. Partiendo de la base que las TICs se vienen posicionando fuertemente como los ejes de la sociedad y la economía, la brecha digital implica que aquellos “no informatizados e informados” no tienen la opción de participar en empleos que requieren de estos conocimientos, en estrategias de gobierno electrónico y de educación en línea.»18

Una de las brechas entre las NTICs y la comunidad educativa, radica precisamente en los canales comunicativos utilizados tradicionalmente en la educación, dominado uso de la palabra, relegando los medios audiovisuales a la subcultura de la alineación televisiva. No podemos seguir negando la realidad: estamos en una era de la imagen y por tanto la Reforma educativa está en la obligación de responder a las expectativas de una sociedad que funciona bajo unos parámetros tecnológicos y comunicativos que se sirve de múltiples lenguajes.

18 http://www.psi.gov.ar/queeslasi.htm

1

Lectura sugerida “Los entornos virtuales de aprendizaje como instrumento de mediación”. Ubicada en la página web del curso en el área de «Recursos»

TALLER

Ingrese a la página www.psi.gov.ar , haga clic en el hipervínculo de documentos relacionado con la sociedad de información, ubicado en la parte inferior derecha. Abra la declaración de principios establecida en la CUMBRE MUNDIAL SOBRE LA SOCIEDAD DE INFORMACIÓN.

De acuerdo a las políticas establecidas en este documento y las lecturas anteriores, elabore un ensayo de mínimo dos cuartillas, que plantee una reflexión acerca del papel de la Comunidad Educativa en la Sociedad de Información.

Page 52: Usos Pedagogicos de internet

52

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

INTERNET COMO RECURSO PEDAGÓGICO

Internet hace parte de las NTIC (Nuevas Tecnologías de Información y Comunicación) de mayor difusión y de más fácil acceso. En poco tiempo el funcionamiento de universidades, empresas, pequeñas y grandes entidades, depende en gran medida de la llamada Red. El papel que cumple este servicio a nivel global es tan importante y abarca tantos ámbitos, que se nos hace imperioso saber hacer uso de él. Además, por qué negarse la posibilidad de acceder al conocimiento de culturas, personas, educación, lugares, etc. teniéndola al alcance de la mano.

Sin embargo, Internet no representa sólo ventajas y soluciones rápidas e inmediatas. Internet puede convertirse en toda una fuente de contrariedades cuando no se sabe utilizar, ya que no todo lo que encontramos allí es la última palabra y mucho menos información del todo confiable. Se hace necesario entonces, acercarse a Internet no sólo con herramientas teóricas en cuanto al manejo de servicios sino también con herramientas de discernimiento, que nos permitan clasificar (elegir y desechar) de manera adecuada todo lo que éste nos ofrece, pero principalmente que nos permitan enriquecer nuestra cultura y otras culturas, para que de este modo construyamos identidad, en lugar de perderla en un mar de información.

Según Jaime H Sánchez, del Departamento de Ciencias de la Computación de la Universidad de Chile, Internet comparte características significativas con el conocimiento, en tanto puede ser entendido “a través del uso que hace cambiar la visión del usuario y adopta un sistema de percepciones de la cultura en la cual son usadas. Aprender a usar una herramienta según los autores, va más allá de un conjunto de reglas explícitas (manuales). Sus condiciones y ocasiones resultan del contexto de actividades de cada comunidad que usa la herramienta, enmarcada en la forma que miembros de esa comunidad ven al mundo. De esta forma, la comunidad y sus puntos de vista,

más que la herramienta, determinan cómo es usada la herramienta”. Así pues, Internet nos pertenece a todos por definición y cada uno de nosotros tiene la responsabilidad de incorporarlo adecuadamente a nuestra ideología y no incorporarnos nosotros al océano de ideologías que lo componen, es decir que, como una facultad más de la que podemos gozar, como el hablar, desplazarnos, etc. debemos controlar y utilizar en nuestro beneficio sin atentar contra la integridad de otros. Es por eso que la parte conceptual presentada a continuación en cuanto al manejo de los recursos de Internet, estará soportada en modelos pedagógicos que contemplan al ser humano en todas sus dimensiones y estrategias de clasificación de información, con el fin de garantizar el máximo rendimiento de lo hallado.

Internet como un recurso pedagógico ofrece la posibilidad de ser utilizado tanto por profesores, como por alumnos, no sólo en doble vía, (profesor ð alumno / alumno ð profesor) sino en infinitas vías, accediendo a un sin número de interlocutores.

Como consumidores de Internet, es posible hacer uso de servicios tales como el aprovechamiento de la información ubicada en los diferentes sitios web, el acceso a cursos gratuitos ofrecidos por miles de portales en la Red, la recepción de noticias de interés vía e-mail, etc.

Por otro lado, como constructores de Internet, los actores del ámbito educativo cumplen un importante papel, a través de la elaboración de páginas web, la creación de cursos interactivos, el desarrollo de proyectos colaborativos, etc.

De hecho, del cumplimiento de estos roles, depende el enriquecimiento de Internet como un instrumento al servicio de la pedagogía. Así pues, la comunidad educativa al asumir el reto de incorporar Internet dentro de sus dispositivos de aprendizaje, adquiere una responsabilidad dentro de un circuito de reciprocidad y constante multiplicación del conocimiento.

Page 53: Usos Pedagogicos de internet

53

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Para valorar Internet como un recurso pedagógico hay que tener en cuenta los siguientes puntos:

o Complementa la ejecución del currículo escolar en tanto hace posible el acceso a todo tipo de información (educativa, científica, cultural, etc.) proveniente de todo el mundo.

o Facilita la comunicación y, por tanto, la integración y colaboración entre personas e instituciones.

o Funciona como un espacio de intercambio de ideas y recursos, es decir, que puede ser utilizado como una motivación a la investigación y el debate, dos aspectos fundamentales en los procesos educativos.

o Permite la consulta directa a fuentes especializadas o expertos, con el fin de resolver dificultades o profundizar en contenidos de investigación

o Por estar Internet basado en sistemas Hipertextuales19, donde el usuario determina qué recorrido hacer y qué incluye en él, fomenta el aprehendizaje autónomo.

“A pesar de las ventajas que plantean las múltiples investigaciones realizadas sobre los sistemas hipertextuales, estas también han dado a conocer los problemas que con ellos suelen presentarse en el trabajo de aula. Son entre otros:

o Si no se tiene claro el recorrido planteado y los intereses, la información puede ser de difícil acceso y los enlaces erróneos.

o Debe conocerse la estructura del sistema y sus formas de acceso o se corre el riesgo de tomar caminos equivocados y perderse en la red.

o Los sistemas de Hipertexto le dan al usuario el control total del aprendizaje cuando realmente éste puede necesitar una ayuda. (Fideiro, 1988).

o Cuando se rompe un segmento de información dentro de un nodo amplio, la pérdida de información

en los nodos pequeños o discretos, causa mucho daño al contexto.

o En textos muy amplios se pueden romper inconscientemente enlaces discretos, y al llegar al final se encontrará poca o nula coherencia en el recorrido.”20

PROPÓSITOS

o Apreciar Internet como un recurso pedagógico con enormes potencialidades para el desarrollo de sus prácticas educativas.

o Comprender cuáles son los elementos asociados a Internet que pueden generar impacto sobre sus prácticas pedagógicas.

o Estar en capacidad de diseñar clases, actividades y guías de trabajo en las que aprovechen las posibilidades de Internet basados en un modelo pedagógico coherente.

ENSEÑANZAS

ENSEÑANZAS AFECTIVAS

a. UNA NUEVA ERA21 “La educación digital es ciertamente un trabajo de amor. Al mismo tiempo es una discusión reflexiva y detallada sobre la

forma de la educación del futuro.”

La globalización, primer signo de cambio

No quedan dudas sobre el impacto del fenómeno de la globalización en las relaciones humanas y en las transacciones de todo tipo, pero debemos reconocer que paradójicamente, hasta ahora, el principal sector que ha resistido frontal y tenazmente a esta globalización es la propia educación. No existe una “educación global”, planetaria, en el sentido, por ejemplo, del turismo, que se encuentra en explosivo

19 Hipertexto es una forma de presentar la información que se caracteriza porque la lectura no se realiza en forma lineal, sino que se basa en una serie de enlaces que relacionan unos textos con otros, es decir, trabaja por medio de asociaciones. 20 DELGADO, Maritza Angélica. QUINTANA, Antonio. Delgado. El hipertexto. Las otras rutas del juego. 21 BATOR, Antonio. DENMA, Percival. “Una nueva era”, Fragmento de Educación. http://www.byd.com.ar/edwww.htm

Page 54: Usos Pedagogicos de internet

54

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

crecimiento y moviliza ingentes recursos en todo el mundo. En lugar de promover esa tendencia centrífuga que será fuente de riqueza y de bienestar muchos gobernantes y educadores se esfuerzan por defender lo indefendible. Se aplican tozudamente en proteger su jurisdicción educacional, con los viejos argumentos nacionalistas, que en este campo, como en tantos otros, han sido superados por los acontecimientos. Esa actitud localista y centralizadora está profundamente errada y deberá cambiar. Además, ¿qué mejor manera de defender una cultura local o nacional que abrirse al mundo y hacerla conocer a todos?Lamentablemente, cuando se proponen modificaciones en los programas de educación para integrar las nuevas tecnologías digitales sucede que el punto de vista localista es tan arraigado que estas iniciativas muchas veces sólo sirven para proteger el statu quo, para hacer más de lo mismo. Se cambia simplemente el “soporte” para que nada cambie... No se piensa explícitamente en la integración de los conocimientos dentro de una escuela, entre las mismas escuelas y entre regiones y países.Pero creemos que en el futuro será imprescindible que todas nuestras acciones educativas estén diseñadas para que también tengan sentido fuera de nuestro circuito local. Son todavía pocos los que se atreven a impulsar la idea de convertir a la educación en una empresa cultural de carácter global, integrada regional e internacionalmente, en una genuina actividad “globalizada”. En tal sentido, es bien conocido el aporte de la escuela piagetiana en el reconocimiento de los procesos de “descentración” y de “co-operación” en la constitución del conocimiento. Piaget decía que “es imposible en cualquier nivel separar al objeto del sujeto. Sólo existen las relaciones entre ambos, pero estas relaciones pueden estar más o menos centradas o descentradas y el pasaje de la subjetividad a la objetividad consiste precisamente en esta inversión de sentido”. Por esta razón, tomar en cuenta el punto de vista del otro es una condición de crecimiento y de desarrollo personal. Comunicarse, además, con personas de otros ambientes y culturas es potenciar la solidaridad social y el talento individual.A pesar de algunas iniciativas promisorias como las asociaciones internacionales de colegios universitarios que incluyen un intercambio permanente de alumnos y profesores, o los sistemas de reconocimiento de cursos superiores entre países, como sucede en algunos programas universitarios dentro de la comunidad europea, poco se hace aún para la integración sistemática de la enseñanza a nivel regional o mundial. Las becas y subsidios de viajes demuestran la conveniencia de “sacar” a un individuo de su medio habitual para su progreso personal y el de toda la comunidad. Es cierto que hay miles de becarios dando vueltas por el mundo, pero son legión los que deciden quedarse en los centros de mayor atracción cultural. En tales casos fracasa el propósito de “intercambio educativo”, la necesidad imperiosa de establecer una doble vía de comunicación. Creemos que, frente a esta situación, la educación digital inventará nuevos caminos para mantener en contacto a los estudiantes y profesores a través de las distancias y acercará más a todos.En efecto, sabemos que las nuevas redes digitales podrán revertir algún día ese proceso de dispersión y despilfarro de recursos. Por el momento, las comunicaciones educativas son extremadamente restringidas y no se pueden comparar a ningún sistema exitoso en vigencia en otros ámbitos. Consultemos simplemente la información on line para las reservas de vuelos aéreos o los sistemas bancarios. ¿Acaso hay algo parecido en educación? Este es el drama actual: no hay suficiente conciencia del inaceptable atraso en el tema de las comunicaciones en educación. Pero el destino de la educación dependerá, en gran medida, de la libertad para aprender y enseñar que nos otorgarán las comunicaciones por encima de todas las fronteras físicas y mentales.

1. ¿De qué manera los conceptos de globalización y educación se combinan según la propuesta de la lectura “Una nueva era”?

2. ¿Qué papel cumplen las nuevas tecnologías de comunicación en la evolución de los procesos educativos?

Page 55: Usos Pedagogicos de internet

55

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

TALLER

El siguiente taller pretende ser un diagnóstico de la actual situación de su institución con respecto a las NTICs. El propósito es que usted reconozca las fortalezas y debilidades al interior de la comunidad educativa y el uso de recursos de vanguardia, como Internet, en la pedagogía.

Potencial de Aplicación1. ¿Cuáles cree usted que son las dificultades para la implementación de Internet en su comunidad

educativa? 2. ¿Desde su área, cuáles cree que serían algunos beneficios específicos de la utilización de Internet?3. ¿Cómo cree que Internet favorece los procesos de aprehendizaje?4. En su comunidad educativa se hace uso de Internet? Si es así, describa brevemente de que forma(s), de

lo contrario, explique por qué no.5. El uso de Internet ha facilitado algunas tareas en su institución? Por qué?6. Los estudiantes muestran interés por la utilización de Internet como un recurso en su educación? ¿De

qué forma?7. ¿Sus estudiantes hacen uso de Internet? ¿Qué servicios y de qué manera los utilizan?8. Ha planeado alguna vez una clase o desarrollado una investigación utilizando los recursos de Internet?

Comparta esta experiencia9. ¿Ha buscado alguna vez nuevos métodos o recursos didácticos en Internet? ¿Cuáles?10. ¿Ha utilizado Internet con el propósito de intercambiar información con otros docentes o sus

estudiantes? De ser así cuáles fueron los beneficios pedagógicos de esta práctica?

¿Se ha materializado la reflexión pedagógica alrededor de la utilización de recursos informáticos?

1. Si usted o su institución han utilizado alguna tecnología informática, diferente a Internet, en el proceso educativo, explique cómo lo han hecho.

2. Se ha elaborado un plan de implementación de Internet en su institución? De ser así descríbalo brevemente.

3. La ejecución del currículo escolar se apoya de alguna manera en Internet?4. Se ha elaborado material instructivo que guíe el trabajo con Internet (Sea para docentes o alumnos)? Si

es así, describa este material, de lo contrario explíque por qué no.5. ¿Cuáles cree usted que son las ventajas de la creación de material de este tipo?6. Si valora la implementación de Internet en los procesos educativos, elabore una pequeña reflexión al

respecto. Si no, exponga las razones por las cuales no la considera significativa.

Page 56: Usos Pedagogicos de internet

56

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

COMPROMISO DOCENTE22

Federico Martín Maglio

Marzo de 1999

¿Bastaría que cada docente desde su sector REVISE su accionar y haga su aporte para mejorar la educación?El que cada uno se replantee el accionar educativo es fundamental para la educación en lo general y personal; pero nos estaremos equivocando si consideramos la revisión personal como suficiente.Bajo ningún punto de vista debemos considerarnos como un Dios, solamente somos humanos, con defectos y virtudes. Dentro de estas últimas está la autocrítica, el replanteo sobre la tarea realizada en nuestra vida. La autocrítica es saludable y fundamental para nuestra salud psíquica, mental, espiritual y física. Nos ayuda a vernos a nosotros mismos y así evaluar lo siguiente:1. Si lo que hacemos es lo que realmente pretendemos.2. Si la manera de hacer las cosas es eficaz.3. Si se nos ocurren otras formas de encarar las tareas.4. Rectificar los errores. 5. Rectificar las metas.

No obstante debemos tener en cuenta que la educación es un hecho social y, por lo tanto, implica que nuestro accionar depende de una ida y vuelta con nuestros semejantes.

Yo me autocritico permanentemente, una autocrítica saludable por no ser obsesiva. Me sirve por tres cosas:1. Considero que voy mejorando como persona. 2. Considero que voy mejorando como profesional. 3. Considero que voy mejorando como ser social.

Pero tiene sus problemas. La mayoría de los colegas, muchos padres y la sociedad en general no se replantean nada, consumen lo que les “tira” la sociedad. Una persona que se mira críticamente es un reformador en lo personal y en lo social: nunca estará conforme del todo con lo que es ni con la sociedad en la que se desenvuelve. ¿Problemas? ¡SI, PROBLEMAS!, porque pasa por ser un “loco”, “zurdo”, “pesimista”, “que tira malas ondas”, etc.. ¿Consecuencias?, sí, porque la labor que uno emprende no siempre será apoyada ni por los compañeros y, a veces, por las autoridades.El problema principal es que lamentablemente el ser humano ha sacralizado, venerado a las instituciones y éstas llegaron a ser más que el creador de las mismas. Las instituciones son conservadoras, en todo caso retrógradas, interesadas en mantener el statu quo del poder en unos pocos.El replanteo personal sirve, pero debemos tener conciencia sobre la realidad que ello implica: tendremos inconvenientes para insertarnos en los grupos de trabajo social y nunca pasaremos desapercibidos, siempre seremos “tema” de conversación de otros y no en muy buenos términos. ¿Por qué?, porque el replanteo tiene que ver con nuestras propias prácticas pedagógicas (vínculos entre docente y alumnos) que, si no se tiene una amplitud bastante amplia de criterio, se lo sentirá como un ataque a nuestro ego, a nuestro individualismo (y los docentes somos un gran ejemplo de individualismo). El replanteo deja al desnudo nuestras falencias y vernos al espejo puede ser doloroso...

Siempre he dicho que desde chico he cometido tres herejías para la sociedad actual:1. Estudiar.

22 http://www.fmmeducacion.com.ar/Pedagogia/compromiso.htm

Page 57: Usos Pedagogicos de internet

57

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

2. Pensar. 3. Replantear. La sociedad de consumo no postula el estudiar, postula la instrucción y el moldeado de las personas para que “entren” en el modelo dirigido por “otros”. No pensar, los “otros” piensan por nosotros. No replantear porque significa criticar lo que está establecido.Es aquí donde rescato una pregunta de Braslavsky: ¿quiénes son los responsables por la selección y distribución equitativa de saberes, de contenidos pertinentes para el desarrollo económico autosostenido, el desarrollo nacional integrado y la construcción de un modelo político democrático?. Este planteamiento me parece sumamente pertinente porque el ser humano vive en sociedad, la hace, la recrea a cada instante. Todos los seres humanos componen la sociedad pero solamente algunos tienen el poder de manejarla ¿por qué?. Pienso que se debe a la falta de educación de la mayoría de las personas ¿educación?.Somos los docentes en gran parte responsables de que la situación esté como está. El sistema puede ser malo, la política dirigencial corrupta, las instituciones obsoletas, etc., pero los docentes tenemos, o se supone que tenemos, un nivel educacional alto en relación al resto de la sociedad y por ello no puede haber justificativo para la falta de replanteos y la inercia en la acción. Es como dice Gadamer: debemos dar significado y sentido a los acontecimientos...Su lectura me ha ayudado grandemente a comprenderme y a convencerme -una vez más- de que el camino que estoy siguiendo es el correcto. He visto que tengo varias facetas como docente, incluso contradictorias ya que me he sentido identificado de una u otra forma con algunas escuelas pedagógicas y no “encerrado” a una en especial.El tema que más me preocupa es si las investigaciones áulicas que realizo son pertinentes o no, cómo puedo hacer para mejorarlas, dónde buscar más información técnica y didáctica.Estoy convencido que los docentes tenemos una actividad que está ligada a la ética más que otras. Se debe a que somos transformadores de seres humanos en formación, responsables en gran medida de la vida de las personas que tenemos como alumnos. Es una responsabilidad tremenda, enorme, la cual nos exige:1. Conocimiento científico. 2. Capacidad de reflexión crítica sobre la realidad. 3. Compromiso político y actitudes para realizarlo. 4. Actitudes éticas y morales guiadas por la rectitud, la verdad y el amor. 5. Comprensión, equilibrio emocional y manifiesta afectuosidad hacia los alumnos y la realidad.

Para finalizar la respuesta, quiero decir que considero que la tarea educativa puede ser individual en algunos casos, pero por lo general es una práctica grupal. Los docentes -como dice Elliot- “debemos requerir un proceso de reflexión cooperativa más que privada; al enfocar el análisis conjunto de medios y fines en la práctica; al proponerse la transformación de la realidad de la escuela y del aula mediante la comprensión previa y la participación de los profesores/as en el diseño, desarrollo y evaluación de las estrategias de cambio; al plantear como imprescindible la consideración del contexto psicosocial e institucional, no sólo como marco de actuación, sino como importante factor inductor de comportamientos e ideas...”.Vienen bien unas palabras de Paulo Freire para reflexionar sobre el compromiso...“¿Cómo comprometerse?.En el momento, sin embargo, en que la sociedad se vuelve sobre sí y se inscribe en la búsqueda difícil de su autenticidad, comienza a dar señales inequívocas de preocupación por su proyecto histórico.Cuanto más crece esta preocupación, más se torna favorable el clima para el compromiso.Estamos convencidos de que el momento histórico de América latina exige de sus profesionales una seria reflexión sobre su realidad, que se transforma rápidamente, de la cual resulte su inserción en ella. Inserción que, siendo crítica, es compromiso verdadero. Compromiso con los destinos del país. Compromiso con su pueblo. Con el hombre concreto. Compromiso con el ser más de este hombre”.

Freire, Paulo, Educación y Cambio, páginas 19 y 20.

Page 58: Usos Pedagogicos de internet

58

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

TALLER

1. En el anterior artículo el autor plantea la importancia del replanteamiento y la autocrítica tanto individual como colectivamente. Realice una reflexión en la que exponga sus puntos de vista con respecto a replantear y auto-criticar su papel como docente. Y otra en la que habla de replantear y auto-criticar los procesos educativos y los modelos pedagógicos.

2. ¿Cómo cree que afecta el acto de replantear y auto-criticar, tanto a nivel personal como a nivel social, la construcción de una ideología tanto para los estudiantes como para usted?

3. ¿De qué manera cree que los docentes contribuyen en el desarrollo de un sentido crítico en los estudiantes?

4. ¿De qué forma implementaría usted Internet como incentivo en procesos de replanteamiento y autocrítica?

5. ¿Cree que el ámbito docente tiene la responsabilidad de implementar nuevas tecnologías en los procesos educativos? ¿Cuáles y por qué?

6. Elabore un documento en el que proponga una serie de pasos a seguir para la implementación de Internet desde su área, teniendo en cuenta las observaciones que hace el autor acerca del compromiso docente

ENSEÑANZAS COGNITIVAS

ASPECTOS GENERALES

El aprendizaje de la tecnología en la escuela ha sido, por lo general, algo marginal y aislado Esto se debe en gran parte a la imagen social, que por mucho tiempo ha relacionado la tecnología con la capacitación y la división del trabajo, es decir, con fines laborales en alguna rama de producción. Otra posible causa de esta marginalidad quizá se encuentre en una concepción de la tecnología como ejercicio de la ciencia.

El aprendizaje de la tecnología en la escuela, también tiene en su contra “la visión cultural occidental, que subvalora la actividad práctica y pese a que la Educación en Tecnología implica una relación teórico-práctica, la reflexión sobre su importancia no ha tenido aún cabida en la escuela”23. Por último tenemos que la presencia de la informática y de los computadores en todos los

espacios, tanto cotidianos como especializados, hace que se confunda la Tecnología aplicada en la Educación con la enseñanza de principios informáticos.

Todas estas son razones suficientes para elaborar un programa completo de implementación de Nuevas Tecnologías en el aula, que tenga en cuenta dentro de los primeros pasos el planteamiento de objetivos claros y específicos que encaminen hacia un proceso de aprehendizaje de conceptos y ejercitación de competencias, en las diferentes áreas que componen el currículo. Sólo de este modo se garantizará que el uso de Tecnologías Informáticas en la escuela estará verdaderamente al servicio de la Educación integral.Desde hace varios años se ha venido experimentando la aplicación de TICS en los procesos educativos. Uno de los modelos pioneros con mayor éxito en la actualidad es La Educación a distancia y con ella, el uso de material didáctico como: Casettes, Multimedia, Fonolibros, DVD, y por supuesto Internet. La gran

23 http://contexto-educativo.com.ar/2001/5/nota-10.htm.

Page 59: Usos Pedagogicos de internet

59

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

acogida de este modelo se debe en parte al auge y a la necesidad de la educación especializada, es decir, el aprendizaje de lenguas extranjeras, la adquisición de un diploma de pre y postgrado, etc.

Otra forma de implementación de Tecnologías informáticas son los sistemas hipertextuales, que inicialmente fueron usados para manejar grandes cantidades de información, pues facilitaban el acceso a bases de datos, documentos o archivos determinados a la vez que lograban relacionarlos de acuerdo a una organización específica, mediante enlaces asociativos. “Dadas las múltiples posibilidades de conocimiento, dichos sistemas están siendo utilizados, y desarrollados más ampliamente en programas de aprendizaje en diferentes países de Europa y Estados Unidos con excelentes resultados en lo referente a la organización y el desarrollo de conceptos por parte de los estudiantes.”24

Modelo Pedagógico: Teoría del Aprehendizaje“Dímelo y lo olvidaré, enséñamelo y tal vez lo recuerde,

implícame y lo aprenderé.”

Confucio

Es importante realizar una breve revisión al proceso que lleva a cabo el hombre para adquirir conocimientos, cualquiera que estos sean, antes de abordar directamente una propuesta pedagógica para la implementación de nuevos recursos en el aula.

Entender cómo nos apropiamos de la realidad y la transformarnos es indispensable para un buen manejo de los lenguajes propios y artificiales. Teniendo en cuenta que hemos concebido a Internet como una tecnología al servicio de la comunicación, y que su estructura es análoga al cerebro humano, dedicaremos un apartado para el conocimiento del funcionamiento de éste último.

EL PROCESO DE APRENDIZAJE

El aprendizaje es el proceso que permite a los individuos aprender instrumentos de conocimiento y operaciones intelectuales. Los instrumentos de conocimiento son todas aquellas herramientas que permiten conocer y comprender la realidad, y las operaciones intelectuales son aquellas acciones de la mente que ponen a funcionar los instrumentos para establecer relaciones entre los objetos que lo rodean. De esta forma, cuando un individuo aprende algo, lo que está haciendo es integrando a sus conocimientos, nuevos instrumentos y realizando operaciones intelectuales con éstos.

24 QUINTANA, Antonio. De la palabra artesana al texto hipermedial. 25 DE ZUBIRÍA, Miguel. Pedagogía Conceptual. Desarrollo Filosófico, Pedagógico y Psicológico.

Hace más de dos décadas Bloom propuso una teoría en torno a los factores que inciden en el aprendizaje de un individuo. Dicha propuesta sostenía que las variables decisivas de un proceso de aprendizaje son: los aspectos afectivos, los mecanismos de cognición básica, los mecanismos de cognición avanzada y la calidad de la educación.

Factor Afectivo

Este factor se refiere a la forma como el individuo se relaciona consigo mismo, con otras personas y con el mundo que lo rodea. En este punto cobran especial importancia sus relaciones con profesores y compañeros, la percepción de los sentimientos de

125

Page 60: Usos Pedagogicos de internet

60

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

sus padres y su nivel de adaptación en su entorno educativo.

Adicionalmente encontramos la afectividad específica asociada a la motivación y gusto del estudiante frente a los contenidos particulares de una asignatura. Es posible que un joven se encuentre a gusto en su institución y tenga buenas relaciones con sus compañeros y docentes. Sin embargo, si le disgusta una asignatura en particular, ya sea porque su desempeño histórico es bastante bajo o porque no encuentra ninguna relevancia a los contenidos abordados, el proceso de aprendizaje no será exitoso.

Por este motivo, es vital que en el proceso de aprendizaje se destinen esfuerzos para identificar las motivaciones que predisponen a un individuo a adquirir conocimiento. Es claro que un individuo aprenderá aquellas cosas que representen algo para él, es decir, que generen alguna motivación o interés particular.

No considerar la dimensión afectiva dentro del aprendizaje puede representar el fracaso del proceso, pues de la atención que se fije sobre los objetos que serán aprendidos depende la valoración que se posea sobre los conocimientos; esto significa que el individuo, a partir de los juicios que realice sobre una temática determinada, decidirá si desea o no aprender tal conocimiento y es este el momento que define el éxito del aprendizaje.

Cognición Básica

En el proceso de aprendizaje es fundamental garantizar que los individuos tienen los elementos de comprensión básicos para abordar cualquier proceso de aprendizaje. Aun cuando el conjunto de factores asociados a la cognición básica es bastante amplio, se identifican como centrales los asociados a atención, memoria y percepción.

En metodologías que apuntan a la práctica de un aprendizaje autónomo, como será en algunos casos

el uso de Internet, debe prestarse mucha atención al diagnóstico de los estudiantes, ya que el proceso de aprendizaje se puede ver entorpecido ante la carencia de un ente externo que centre su atención, lo guíe y verifique constantemente el cumplimiento de una ruta adecuada.

Cognición Avanzada

Los procesos de cognición avanzada están asociados a macroprocesos intelectuales más complejos de metacognición: lectura, razonamiento abstracto, etc. Comúnmente, se entienden como las operaciones intelectuales que permiten al individuo el aprendizaje de nuevos contenidos o instrumentos de conocimiento. Es sobre este nivel, que cualquier proceso que pretenda que los jóvenes aprehendan a aprehender y creen estrategias que les permita comprender, debe orientarse.

Eso significa que los estudiantes realizan y comprenden procesos de razonamiento, (no sólo aprenden, si no que comprenden la forma como su mente integra los nuevos instrumentos de conocimiento y operaciones intelectuales). El proceso que permite lograr una comprensión del aprendizaje se apoya generalmente por medio de herramientas como mapas conceptuales, mentefactos diagramas de flujo, etc.

En tanto que las pedagogías de aprendizaje autónomo dan prelación al aprendizaje sobre la enseñanza, los aspectos de cognición avanzada deben ser la base de desarrollo en las edades más pequeñas. Prácticas de aprendizaje autónomo requieren atención especial sobre esto procesos, de lo contrario el proceso no rendirá los resultados esperados.

Calidad de la educación

El cuarto factor de influencia se refiere a la calidad de la educación. Generalmente se cree que este factor es el que explica en mayor medida el éxito de un proceso de enseñanza, sin embargo, este factor explica a lo más el 25% del bajo desempeño académico.

Page 61: Usos Pedagogicos de internet

61

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

En este factor interviene: la intuición e ingenio del docente, la calidad y el aprovechamiento del material académico, lo acogedor del entrono escolar y todas aquellas variables que modifiquen la calidad del proceso de enseñanza.

Debe anotarse que un buen proceso de enseñanza no garantiza necesariamente buenos procesos de aprendizaje si los otros tres factores no son tenidos en cuenta. Por lo tanto, una propuesta seria de enseñanza – aprendizaje, debe involucrar respuestas para el análisis y abordaje de los cuatro factores previamente mencionados.

PRINCIPIOS DE APRENDIZAJE26

Los siguientes, son los principales aspectos a tener en cuenta en todo proceso de aprendizaje:

1. MOTIVACIÓN

La motivación depende directamente de dos cosas: primero, saber exactamente lo que se espera obtener al iniciar un proceso de aprendizaje y, segundo, establecer intereses (Por ejemplo: cómo afecta mi vida el aprehendizaje de este conocimiento) para alcanzar esos objetivos. Así pues, sabemos que un estudiante está motivado cuando comprende la utilidad de adquirir una habilidad o manejar determinado concepto.

2. CONCENTRACIÓN

La concentración está determinada por el potencial de atención que tiene un individuo sobre determinada tarea: leer, escribir, responder, etc.

3. ACTITUD

Ésta se refiere a la postura que tiene el individuo frente a determinado proceso de aprendizaje. Es importante cuestionarla en todas las etapas del proceso, ya que de esto depende el sólido desarrollo de la capacidad crítica de estudiante.

Por otro lado, la actitud también puede ser entendida como la manera en que asume su propio proceso educativo, es decir, cómo lee, cómo estudia, cómo toma apuntes, etc.

4. ORGANIZACIÓN

Antes de utilizar el material del que se dispone para la aprehensión de un conocimiento, es importante establecer la forma en que se debe estructurar para garantizar un uso optimo de este. Por esto, si se puede comprender la idea básica y los puntos principales de la temática abordar, será posible establecer donde encaja cada idea. Ejemplo: Si al iniciar un curso se examina la guía de trabajo – libro, o cualquier otro material – se tendrá una idea global de la estructura de contenidos.

5. COMPRENSIÓN

La comprensión equivale a tener conciencia del por qué del conocimiento, es decir, por qué ese concepto o herramienta es así y no de otra manera. En la comprensión se asimila el principio de lo que sé esta explicando, se descubren los conceptos básicos, y por último, se organiza la información y las ideas para que se transforme en conocimiento.

Mediante la comprensión es posible desarrollar en mayor medida habilidades adquiridas, buscando y examinando el significado de las razones que vamos asimilando.

6. REPETICIÓN

Pocas cosas tienen un efecto emocional tan fuerte como para quedársenos grabadas el primer contacto. Por eso para recordar una cosa debemos repetirla.

La repetición no tiene que consistir en volver a leer un material, o hacer nuevamente un mismo ejercicio. Es más conveniente unir el proceso repetitivo con el proceso creativo o innovador, es decir, que se

26 http://www.monografias.com/trabajos12/pedalpro/pedalpro.shtml

Page 62: Usos Pedagogicos de internet

62

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

retome lo aprehendido para darle una nueva aplicación. Ejemplo: si se ha aprendido a leer, no es de mayor utilidad volver a leer el texto con el que se aprendió, mejor se practica con un texto desconocido, de este modo se perfeccionará, en este caso, la habilidad adquirida.

EL BUEN APRENDIZAJE E INTERNET“Yo creo que, originariamente, el cerebro de una persona es como un pequeño ático vacío en el que hay que meter el mobiliario que uno prefiera. Las gentes necias amontonan en ese ático toda la madera que encuentran a mano, y así resulta que no queda espacio en él, para los conocimientos que podrían ser útiles, o, en el mejor de los casos, esos conocimientos se encuentran tan revueltos con otra montonera de cosas, que les resulta difícil dar con ellos. Pues bien: el artesano hábil tiene muchísimo cuidado con lo que mete en el ático del cerebro. Sólo admite en el mismo las herramientas que puedan ayudarle a realizar su labor; pero de éstas si que tiene un gran surtido y lo guarda en el orden más perfecto. Es un error creer que la

pequeña habitación tiene paredes elásticas y que puede ensancharse indefinidamente. Créame: llega un momento en que cada conocimiento nuevo que se agrega, supone el olvido de algo que ya se conocía. Por consiguiente, es de

mayor importancia no dejar que los datos inútiles desplacen a los útiles”

–Sherlock Holmes –

En «Estudio en Escarlata» Sir Arthur Conan Doyle

La visión que nos ofrece Sherlock Holmes, ese famoso personaje de la literatura, no sólo ejemplifica la manera en que el cerebro almacena información, sino también resalta la importancia de la clasificación de los conceptos o herramientas que elegimos adquirir. Una mala elección nos puede costar valiosa información almacenada previamente en nuestro cerebro, un riesgo bastante alto que se corre al navegar en Internet. Pero, si de lo contrario, el uso de Internet – para cualquiera que sea el interés – es mediatizado por un plan claro que en vez de despelotar nuestro arsenal de conocimientos, fomente el caos y nos prive de recuerdos preciados o saberes verdaderamente importantes, suscite la organización y enriquezca lo allí almacenado, lograremos convertirnos en personas más competentes y menos dispersas.

TALLERSENSIBILIZACIÓN CON RESPECTO AL APREHENDIZAJE E INTERNET

1. ¿Qué cree usted que puede significar la expresión “Las gentes necias amontonan en ese ático toda la

madera que encuentran a mano” aplicada al contexto del uso de Internet?2. Teniendo en cuenta la visión de Sherlock Holmes, ¿cuál cree usted que debería ser el plan de un

artesano hábil para hacer uso de Internet?3. ¿Considera que dentro del programa curricular manejado en su área, se cae en el error de pretender

que los alumnos acumulen información inútil?

Page 63: Usos Pedagogicos de internet

63

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

4. ¿Cuándo elabora el programa académico a desarrollar (por bimestres, semestres o en el año) cuestiona la utilidad de los conceptos que planea enseñar? ¿Por qué?

5. ¿Qué estrategias tiene usted como docente para garantizar que los conceptos contemplados en su plan de estudios, sean aprendidos por sus alumnos de manera permanente?

6. ¿De qué manera el uso de Internet puede contribuir a la sistematización del aprendizaje, es decir, a la adquisición de conocimientos útiles de modo que no desplacen saberes importantes.

7. En un párrafo, escriba una reflexión acerca del fragmento de «Estudio en Escarlata»

Modelo pedagógico: aplicaciones de pedagogía conceptual

Introducción

La aplicación de Internet en el aula, constituye un mecanismo educativo en el que prima el aprendizaje sobre la enseñanza, así que el protagonista del proceso educativo no es el docente, ni la institución, sino el alumno. Por ello, dentro de un proceso de aprendizaje que contempla al estudiante capaz de elegir una ruta que lo conduzca a un objetivo preestablecido, el interés no se centra en lo que un docente pueda enseñar si no en lo que un alumno aprende por sí mismo guiado por un tutor.

Lo anterior representa una innovación importante sobre los procesos tradicionales de enseñanza-aprendizaje, por cuanto el proceso se centra en quien realmente es el actor principal, sin desconocer por su puesto que todos los integrantes de una comunidad educativa son igualmente importantes, aquí nos estamos refiriendo a un proceso específico.

En los procesos académicos tradicionales, en los que el docente es el responsable de lo que sus alumnos aprenden, la capacidad de aprender por sí mismos no es desarrollada y el proceso depende siempre de un actor externo al individuo (el profesor). Razón por la cual, el aprendizaje autónomo, estimulado a través de la implementación de Internet, más que una metodología educativa, se convierte en una capacidad o competencia de los estudiantes, es decir, en una

destreza que éstos adquieren y gracias a la cual pueden aprender por sí mismos.

Como ya se mencionó en el punto anterior, los procesos de aprendizaje parten de las motivaciones que se generan en el individuo para aprender unos conceptos y unas destrezas determinadas. En la educación que se sirve de Internet, la dimensión afectiva del estudiante cobra una especial importancia, por cuanto el éxito del proceso depende del compromiso y la responsabilidad que el individuo asuma. Dicho compromiso es proporcional a las motivaciones que determinado conocimiento genere. Este nivel de motivación afectará directamente los niveles de atención, punto de partida de los procesos de aprendizaje.

Por otra parte, al asumir Internet como una herramienta pedagógica el rol del docente cambia: se convierte en tutor, es decir, se convierte en una persona que encargada de guiar el proceso de aprendizaje más que de transmitir conocimientos. Las tutorías son procesos de acompañamiento en los que un tutor se dedica a un grupo reducido de estudiantes para ayudarlos a explorar sus capacidades, encontrar las debilidades y presentar guías para fortalecerlas.

El tutor proporcionará las orientaciones para que el aprendizaje se oriente coherentemente y realizará la evaluación del proceso de sus alumnos. Igualmente, sugerirá fuentes y enfoques y retroalimentará continuamente los avances de su grupo.

Page 64: Usos Pedagogicos de internet

64

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Los procesos de aprendizaje autónomo poseen un sistema de evaluación muy definido a partir de niveles secuenciales de logro. Esto garantiza el seguimiento y la continuidad del proceso.

Ya que la fuente de conocimiento no es el profesor, los estudiantes deberán aprovechar de la mejor forma todos los recursos que encuentren en su contexto para desarrollar sus temáticas. Por esto, deben generarse destrezas para identificar y seleccionar de acuerdo con las necesidades específicas las fuentes primarias y los métodos de consulta e investigación y aprovechar herramientas didácticas y tecnológicas.

Estas labores de autoaprendizaje requieren el fortalecimiento de las competencias lectoras de los individuos pues a diferencia de los procesos tradicionales de enseñanza basados en la transmisión oral del conocimiento, en el autoaprendizaje un porcentaje muy alto del conocimiento de recibe a través de la lectura. Por ello, paralelamente a la implementación de proyectos de aprendizaje autónomo es fundamental generar espacios para el desarrollo de las competencias lectoras.

Fundamentos de Pedagogía Conceptual

Si bien durante un proceso de aprendizaje autónomo la responsabilidad del aprendizaje es del individuo, es necesario que dicho proceso se encuentre guiado por parámetros claros y que exista un alto nivel de coherencia al interior del mismo, por esto, debe ser gestionado como un proyecto y debe contemplar como los aspectos básicos de un diseño pedagógico.

No es posible garantizar que un recurso educativo favorece en mayor medida el aprendizaje si su uso no está orientado por un diseño pedagógico claro. Por ello, es necesario considerar el conjunto de elementos propios de un acto pedagógico que acompañan a los recursos: los propósitos, las enseñanzas, la evaluación, la secuencia y la didáctica. Así, el recurso no es un protagonista del proceso por sÍ mismo, sino un componente más del proceso que debe estar en

concordancia con los otros elementos para garantizar el logro de sus propósitos de uso.

Por lo mismo, deben diseñarse otras estrategias, como las guías de trabajo y las actividades complementarias que permitan acompañar el proceso. Estos acompañantes deben guardar estrecha relación con el modelo pedagógico y el recurso multimedia.

A continuación se presentan algunos de los fundamentos pedagógicos que han orientado el desarrollo de la propuesta para la utilización de Internet dentro de procesos en el aula.

¿Qué es pedagogía conceptual?

Es un modelo pedagógico estructural desarrollado por Miguel de Zubiría Samper.

1

Sistema cognitivo

Sistema expresivo

Sistema afectivo

Pedagogía Conceptual, el Modelo Pedagógico que soporta esta propuesta, concibe al ser humano en tres sistemas fundamentales: el sistema afectivo, el sistema cognitivo y el sistema expresivo. Esto quiere decir que para pedagogía conceptual la esencia del hombre está compuesta por sus afectos, sus conocimientos y sus comportamientos.

Al sistema afectivo lo componen instrumentos valorativos o afectivos dentro de los cuales se encuentran las emociones, sentimientos, actitudes, valores, principios y axiologías.

Page 65: Usos Pedagogicos de internet

65

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

El sistema cognitivo está conformado por instrumentos de conocimiento, operaciones intelectuales y sus productos, los conocimientos. En este sistema se encuentran los conceptos que los individuos aprehenden y es donde se desarrollan las operaciones cognitivas. La dimensión cognitiva de un ser humano está compuesta por todos los instrumentos (nociones, proposiciones y conceptos) que le permiten comprender su realidad. Gracias a esta dimensión los individuos pueden clasificar los objetos de su realidad de acuerdo con sus características y pueden explicar las relaciones y transformaciones entre los mismos.

Por último, el sistema expresivo está relacionado con las formas de expresión de los saberes. Es el conjunto de destrezas y habilidades que una persona posee para expresar su saber, es decir, corresponde al saber hacer a partir de los conocimientos que se poseen. La dimensión expresiva está asociada al lenguaje, es decir, a las formas como el individuo expresa lo que sucede al interior de su dimensión afectiva y cognitiva. Dentro de esta dimensión se contempla la destreza práctica y la capacidad de creación.

En resumen, en esta dimensión se encuentra lo que una persona puede hacer o expresar, a partir de sus conocimientos y guiada por sus afectos.

Pedagogía Conceptual propone un modelo de enseñanza en donde los individuos no sólo se formen a nivel conceptual sino que también valoren el saber y posean destrezas para aplicar sus conocimientos en diferentes situaciones.

Al analizar el concepto de competencia se encuentra que la definición más común es “saber hacer en contexto”. Sin embargo, teniendo en cuenta que un ser humano está compuesto por las tres dimensiones mencionadas anteriormente, una competencia corresponde a la unión de la dimensión afectiva, cognitiva y expresiva alrededor de un conocimiento determinado. Así, un estudiante es competente cuando quiere aprender algo porque valora este conocimiento, comprende los conceptos asociados al tema y puede aplicarlos en diferentes situaciones de su contexto. Por esto, el concepto de competencia, más allá de saber hacer en contexto corresponde a un querer saber hacer en contexto, pues cada una de las tres dimensiones es determinante en el momento en el que los estudiantes aprehenden algo y por ello, es fundamental que los esfuerzos pedagógicos se destinen hacia cada una de estas dimensiones, pues sólo así puede decirse que dentro de un proceso educativo se forman individuos competentes.

Page 66: Usos Pedagogicos de internet

66

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Teniendo en cuenta que el protagonista de un proceso de aprendizaje es el ser humano, lo primero que se debe garantizar es que se reconocen y comprenden las características que lo definen como tal. Esto significa que un proceso en el que se forman seres humanos debe partir de la comprensión del individuo y garantizar que se destinan esfuerzos para todas las dimensiones que lo conforman.

TALLER

CLASIFICACIÓN DE CONTENIDOS DESDE EL TRIÁNGULO HUMANO

A Continuación vamos a realizar un ejercicio que nos ayudará a diferenciar los contenidos afectivos, cognitivos y expresivos ubicados en cualquier tipo de página Web.

1. Ingrese a la página http://www.naveguitos.com.ar/comun/v2/vis_1103.asp Como verá se trata de una página dirigida a los niños para acercarlos al universo del cuerpo humano.

Las gráficas, los colores, el diseño pretenden llamar la atención del público infantil, por lo tanto esto hace parte del contenido afectivo, ya que su intención es motivar e interesar al niño en las temáticas tratadas en la página.

2. Observe el icono de Nutrición, lleve el mouse hasta allí y espere a que aparezca un listado de hipervínculos relacionados con este tema (No tiene que hacer clic para que aparezcan).

3. Haga clic sobre la opción ¿Qué sentimos cuando comemos? A continuación se presenta un texto en el que se le propone al niño hacer una clasificación de los alimentos que más le gustan, los que más o menos le gustan y los que no le gustan, de acuerdo a su sabor. Además se sugieren otros para que pruebe, y determine si son dulces, salados, etc. Si bien aquí se plantea una actividad, el objetivo de esta no es poner en práctica una enseñanza anterior, sino despertar el interés en el niño por aprender ¿cómo sentir los gustos?, Por lo tanto esta también constituye una información afectiva.

4. Ahora vuelva a la página anterior y continúe explorando esta página en busca de información afectiva. Explique algunos ejemplos

5. Ingrese a la página http://usuarios.lycos.es/teoriadelcaos/, y haga clic en el hipervínculo de Introducción.

Como verá, este texto es de contenido netamente cognitivo, ya que corresponde a la exposición de un concepto: La teoría del Caos.

Dentro de la introducción que se hace a la Teoría del Caos se plantean tres subtemas: El Control, la Creatividad y la Influencia Sutil. Explore cada uno de ellos, resuma el que más le llame la atención y diga a qué clase de contenido corresponde y por qué.

6. Ingrese a la página www.elhuevodechocolate.com, observe el menú que se encuentra a la izquierda y elija la opción MATEMÁTICAS PARA NIÑOS. Allí encontrará otro menú, seleccione la opción CUADRADOS MÁGICOS.

Page 67: Usos Pedagogicos de internet

67

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

7. Cuadrados Mágicos se divide en dos partes: la primera es de carácter cognitivo, ya que explica el concepto de cuadrado mágico, presenta los tipos de este y nos cuenta su historia. La segunda, en cambio corresponde a la dimensión expresiva, ya que le propone al individuo la construcción de cuadrados mágicos de acuerdo a la información que se le dio en la primera parte.

8. Explore las siguientes páginas y clasifique la información que encuentre en cada una de ellas en: afectiva, cognitiva y/o expresiva.o http://www.internetaleph.com/o www.matematicas.neto http://www.webdianoia.com/

Modelo del Hexágono

Ningún recurso didáctico es suficiente por sí mismo, por eso es necesario que se incluya dentro de un modelo pedagógico que lo complemente y permita maximizar su beneficio.

El caso de Internet no es la excepción y por ello, se propone que su utilización se encuentre enmarcada dentro de un modelo que incluya las diferentes etapas de un acto pedagógico. El modelo pedagógico del hexágono, propio de Pedagogía Conceptual, establece que todo acto pedagógico debe contemplar 6 etapas fundamentales:

Propósitos

La formulación de los propósitos permite saber cual es la meta hacia la cual se debe orientar la labor educativa. Estos deben responder a la pregunta ¿Qué va a aprehender el estudiante?Existen tres tipos de propósitos: cognitivos, expresivos y afectivos.

Enseñanzas

Las enseñanzas deben conducir al alumno al cumplimiento de los propósitos.Deben responder a la pregunta ¿Qué enseñar para cumplir con los propósitos?

En el sistema cognitivo se privilegia la enseñanza de operaciones intelectuales y de instrumentos de conocimiento, en el sistema afectivo los valores y normas y en el sistema expresivo el dominio de códigos (lenguajes).Al igual que con los propósitos, las enseñanzas se dividen en afectivas, cognitivas y expresivas.

Evaluación

La evaluación está directamente relacionada con las enseñanzas. Debe responder a las preguntas ¿Qué logros deben alcanzar los alumnos? Y ¿Cómo va el proceso?La evaluación pedagógica tiene la función de informar, al maestro y al alumno, acerca del proceso.

Por ello, en el momento de utilizar un recurso como apoyo a un proceso pedagógico es indispensable hacer una reflexión alrededor de cada uno de las etapas del modelo pues la información de la red por sí misma no es el eje central del proceso sino un recurso que permite acompañar los aprehendizajes.

1

Recursos ¿Con qué?

Didáctica ¿Cómo?

Secuencia ¿Cuándo?

Evaluación ¿Logros?

Enseñanzas ¿Qué?

Propósitos ¿Para qué?

Componente Didáctico

Componente Pedagógico

Page 68: Usos Pedagogicos de internet

68

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

La evaluación debe ocurrir al menos durante tres momentos especiales:o Antes de iniciar la enseñanza (evaluación diagnostica)o En la fase intermedias (evaluación procesal)o Al finalizar el aprehendizaje (evaluación final)

La evaluación debe darse en tres niveles: elemental, básico y de dominio.

Secuencia

Es la manera como van a ser distribuidas las enseñanzas. Es conveniente considerar la edad mental de los estudiantes y los aprendizajes previos.

Debe responder a la pregunta ¿Cuándo enseñarlo?

Pedagogía conceptual propone que para las secuencia de las enseñanzas se tenga en cuenta el orden genético en que se escalonan los sucesivos instrumentos de conocimiento y sus operaciones intelectuales.o Nociones o Proposicioneso Conceptoso Procesos formaleso Precategoríaso Categorías

Didáctica

La didáctica se basa en las técnicas que se deben emplear par impartir las enseñanzas.Debe responder a la pregunta ¿Cómo voy a enseñar?

Recursos

o Son las herramientas con las cuales el docente llevará a cabo su trabajo.

o Los recursos están ligados a la didáctica elegida por el docente.o Debe responder a la pregunta ¿Con qué apoyar las enseñanzas?

Fundamentos de Pedagogía conceptual: Los Propósitos

Desde pedagogía conceptual, la formulación de propósitos siempre debe ser el primer paso de cualquier proyecto educativo, por más pequeño y sencillo que sea, ya que su principal función consiste en concretar el

1

¡Sólo se evalúa lo que se enseña y sólo se enseña lo que se plantea en los propósitos!

Page 69: Usos Pedagogicos de internet

69

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

concepto o la habilidad que espera el docente que aprehenda estudiante, así como también la pertinencia de ésta, de acuerdo a sus conocimientos, capacidades y contexto curricular.

No es conveniente realizar clases sin plantear propósitos claros, es necesario determinar qué es lo que se quiere lograr en determinado espacio de tiempo. Si no se ha establecido a dónde se quiere llegar será muy difícil que las actividades que se realicen tengan coherencia entre ellas y permitan alcanzar un fin determinado.

Por otra parte, los recursos de Internet pueden presentar una gran cantidad de distractores generados por la no linealidad de la exploración y la presencia de diferentes símbolos e imágenes en movimiento que pueden ocasionar que los estudiantes dispersen su atención. Por ello, un propósito muy bien definido es, tanto para el profesor como para los estudiantes, un hilo conductor muy claro que permitirá centrar la atención sobre los elementos que son determinantes para el aprehendizaje. Los propósitos servirán de faro para guiar tanto a docentes como a estudiantes, ya que de su buena formulación depende la disminución en el rango de búsquedas y hallazgos erróneos que entorpezcan o atrasen el curso de una ruta exitosa hacia el objetivo final.

En el apartado anterior se expusieron las dimensiones que contempla Pedagogía Conceptual para construir una teoría del aprendizaje. Pues bien, si se quiere ser consecuente con esos fundamentos, éstos se deben tener en cuenta a lo largo de todo el proceso; por ello al plantear los propósitos se tendrá en cuenta de igual manera la parte afectiva, la parte cognitiva y la parte expresiva.

Propósitos Afectivos: Son aquellos propósitos que persigue un fin de tipo emotivo bien sea intrínseco o extrínseco. Están relacionados con la valoración por parte del estudiante de los contenidos que va a aprehender. ¿Por qué es importante que yo aprenda esto?

Ejemplo: Si el contenido que se piensa abordar es la suma, uno de los propósitos a plantear será:

Valorar la importancia que tiene la operación aritmética suma en tu vida diaria.

Si el estudiante sabe de antemano la utilidad del conocimiento que está próximo a adquirir, su percepción y motivación se incrementarán, beneficiando directamente la aprehensión de éste.

Propósitos Cognitivos: Éstos hacen referencia al horizonte cognitivo a desarrollar y se relacionan directamente con los conceptos que aprenderá el joven.

Ejemplo: En el área de biología uno de los conceptos fundamentales es LA CÉLULA; por lo tanto, el propósito cognitivo referido a éste será:

Comprender el Concepto de [CÉLULA]

En este punto es muy importante resaltar que la determinación del concepto no corresponde a la simple enunciación a manera de propósito, – así sólo se hace explícito – una verdadera conceptualización consiste en establecer el lugar que ocupa un concepto en determinado contexto. Esto se ampliará más adelante en el apartado de las enseñanzas cognitivas.

Propósitos Expresivos: Son los propósitos que hacen referencia al tipo de destreza que el estudiante tendrá después del proceso de aprendizaje y ejercitación. Este propósito está relacionado con el saber hacer, es decir, con lo que se espera que el estudiante exprese, realice, a partir del conocimiento recibido.

Ejemplo: Si el propósito cognitivo se inscribe en el área de Geometría, un propósito expresivo podría ser:

Estar en capacidad de calcular el perímetro de una figura geométrica

Page 70: Usos Pedagogicos de internet

70

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

La formulación de propósitos expresivos garantiza que el ciclo de aprehendizaje se cierre exitosamente y sobre todo, en manos de los verdaderos protagonistas: los estudiantes.

Por otra parte, la implementación de Internet favorece este propósito en tanto anima al estudiante a adquirir autonomía y apropiarse de su proceso educativo.

1

Los propósitos poseen las siguientes características:

1. Formulan una expectativa referida al estudiante

2. Requieren la comprensión o el aprehendizaje de un saber o de operaciones necesarias para ello.

3. Todo propósito debe enunciarse en torno a lo que el joven debe lograr, no define el objetivo pedagógico del docente

PARA TENER EN CUENTA

TALLER PROPÓSITOS – formulación y análisis curricular – A continuación desarrollaremos un taller que busca desarrollar destrezas para la construcción de propósitos relacionados con la utilización del Internet.

1. Visite la página www.bogota.gov.co. Observe con atención la página principal; ésta ofrece varios servicios y distintos tipos de información, ¿verdad? Haga clic en el hipervínculo Información, plantee 5 propósitos afectivos para visitar este apartado de la página (puede acceder a los hipervínculos que encuentre aquí relacionados con este tema). Ejemplo:

o Comprender la importancia que tiene Bogotá como centro económico del país a)__________________________________________________________________________

b)__________________________________________________________________________

c)__________________________________________________________________________

d)__________________________________________________________________________

e)__________________________________________________________________________

2. Regrese a la página principal, haga clic en el hipervínculo Bogotá por temas (menú de la izquierda). Aparecerá un nuevo menú a la izquierda, elija la opción Cultura y tiempo libre.

A continuación se le dará una lista de propósitos relacionados con este tema, determine si es un propósito afectivo (PA), un propósito cognitivo (PC), un propósito expresivo (PE), o un propósito mal formulado (NP). - No olvide que en la parte inferior de la página está la opción de ver la continuación de la lista. Abra los hipervínculos que considere necesarios -

Page 71: Usos Pedagogicos de internet

71

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

a) Clasificar los centros culturales de Bogotá de acuerdo a las actividades que realizan y a los servicios que ofrecen (____)

b) Valorar la diversidad de centros dedicados culturales que tiene nuestra ciudad (_____)

c) Visitar los centros culturales que existen en Bogotá (_____)

d) Reconocer las diferentes actividades a las que se dedica el Centro Cultural CAB (_____)

e) Identificar cuáles son las bibliotecas que prestan servicio al público particular en Bogotá (_____)

f ) Identificar los teatros más próximos a tu casa (______)

3. A continuación encontrará un listado de páginas sugeridas para el trabajo por área; elija la que considere conveniente o busque una nueva, y plantee 2 propósitos afectivos, 2 propósitos cognitivos y 2 propósitos expresivos:• www.biologia.edu.ar• www.literart.com/antologia• www.primeraescuela.com• www.papalote.org.mx• http://www.chicos.net/minis/la-web.htm• www.kokone.com.mx• www.losmapas.com• http://www.kelpienet.net/rea/• http://descartes.cnice.mec.es/enlaces/enlaces.htm

Fundamentos de Pedagogía Conceptual: Enseñanzas afectivas

¿Por qué son necesarias las enseñazas afectivas?

El bajo desempeño académico está asociado a problemas de afectividad general. Este factor se refiere a la forma como el individuo se relaciona consigo mismo, con otras personas y con el mundo que lo rodea. En este punto cobran especial importancia sus relaciones con profesores y compañeros, la percepción de los sentimientos de sus familiares y su nivel de adaptación en el entorno educativo.

Adicionalmente, se encuentra la afectividad específica asociada a la motivación y gusto del estudiante frente

a los contenidos particulares de una asignatura. Es posible que un joven se encuentre a gusto en su institución y tenga buenas relaciones con sus compañeros y docentes; sin embargo, si le disgusta una asignatura en particular, ya sea porque su desempeño histórico es bastante bajo o porque no encuentra ninguna relevancia a los contenidos abordados, el proceso de aprendizaje seguramente no será exitoso.

Por tales motivos, es de vital importancia destinar esfuerzos para identificar las motivaciones que predisponen a un individuo a adquirir conocimiento. Es claro que un individuo aprenderá aquellas cosas que representen algo para él, es decir, que generen algún interés particular.

Page 72: Usos Pedagogicos de internet

72

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

No considerar la dimensión afectiva puede representar el fracaso del proceso educativo, pues de la atención que se fije sobre los objetos que serán aprendidos depende de la valoración que se posea sobre los conocimientos; esto significa que el individuo, a partir de los juicios que realice sobre una temática determinada, decidirá si desea o no aprender tal conocimiento, y es este el momento que define el éxito del aprendizaje.

Estructura de las enseñazas afectivas

Las enseñanzas afectivas están basadas en estructuras que buscan demostrar una tesis a partir de una serie de argumentos. Esta tesis corresponde a la justificación de un saber. Para la construcción de enseñanzas afectivas es importante reconocer:

¿Qué es la argumentación?

Llamamos argumentación a un tipo de razonamiento que empleamos para demostrar la validez de una determinada proposición y convencer a nuestro interlocutor acerca de la conveniencia de nuestro punto de vista.

¿Qué es una tesis?

Una tesis es una posible respuesta a un interrogante generado en torno a situación planteada desde una problemática. La tesis también puede ser entendida como la opinión que alguien tiene acerca de un tema, planteando una polémica o discusión entre un determinado grupo de personas.

Una tesis siempre pretende ser justificada o demostrada a través de evidencias o razones. Dichas evidencias o razones se plantean por medio de un tipo particular de proposiciones a las que llamamos argumentos.

¿Qué es un argumento?

Un argumento es una razón para creer en la conveniencia de aceptar como válida la tesis planteada por algún autor o por alguna persona.

Las enseñanzas afectivas poseen:

o Una estructura argumental donde se representan gráficamente las relaciones entre:• Tesis• Argumentos• Derivadas

o Proposiciones: corresponden a cada uno de los argumentos, enunciados por separado.

o Texto de enseñanzas afectivas: es un texto escrito en el que se desarrollan las proposiciones. Es importante que el texto ejemplifique muy claramente cada una de las ideas y esté escrito en forma motivante pues su propósito es despertar el interés por el conocimiento.

o Además de la estructura argumental y su texto correspondiente, cabe la alternativa de anexar un texto independiente – preferiblemente menos académico – que cumpla la función de iniciación al tema y despierte el interés en el estudiante por el tema. Este texto puede ser un artículo, un cuento, una reseña, etc.

Cómo construir enseñanzas afectivas

En la construcción de enseñanzas afectivas es importante considerar los siguientes aspectos:

o La enseñanza afectiva debe responder al propósito afectivo

o La enseñanza afectiva está orientada a convencer al estudiante del valor que tiene un conocimiento determinado.

o Al elegir una tesis para una enseñanza afectiva deben considerarse la mayor cantidad de argumentos posibles que justifican la importancia del saber, desde diferentes puntos de vista.

Page 73: Usos Pedagogicos de internet

73

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

o Al seleccionar los argumentos considere: el contexto del joven, las aplicaciones del concepto en la vida real, la relevancia para el estudiante en su vida personal y las posibilidades que da el concepto para comprender mejor la realidad en la que se desenvuelve el joven.

o Mencione tantos ejemplos como le sea posible, pues de esta forma es más fácil evidenciar la utilidad o relevancia del concepto.

o En el caso de la incorporación de Internet, es claro que esta red ofrece innumerables testimonios, aplicaciones, lecturas, etc., asociadas a un tema que pueden ser insumos o complementos para las enseñanzas afectivas.

EJEMPLO

El siguiente es un ejemplo de una enseñanza afectiva construida a partir del propósito: “Valorar la importancia de dominar el concepto de variable aleatoria”.

ESTRUCTURA ARGUMENTAL

Sub Derivada

2.1

Sub Derivada

3.1

Derivada 1 Derivada 2 Derivada 3

Argumental 1

Argumental 2

Argumental 3

Argumental 4

Sub- Argumental

1.1

Sub- Argumental

1.2

Sub- Argumental

1.3

Sub- Argumental

2.1

Sub- Argumental

2.2

Sub- Argumental

3.1

Sub- Argumental

4.1

Sub- Argumental

4.2

Sub- Argumental

4.1.1

Sub- Argumental

4.2.1

Sub- Argumental

4.2.2

Tesis

Page 74: Usos Pedagogicos de internet

74

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

TEXTO DE ENSEÑANZAS AFECTIVAS

T. La comprensión del concepto de variable aleatoria te brindará herramientas útiles para la comprensión de la realidad que te rodea, porque a partir de este concepto A1. entenderás que es una variable y por lo tanto A.1.1. comprenderás por qué en algunas situaciones, al observar una característica en diferentes elementos, ésta toma valores diferentes. Igualmente, A.1.2. encontrarás la forma de representar e interpretar la realidad por medio de variables que te permitan medir características o contar eventos en situaciones cotidianas. A.1.3. También podrás identificar cuándo te enfrentas a eventos que no representan variaciones, es decir, situaciones que poseen un comportamiento constante, por ejemplo la cantidad de minutos que tiene una hora.

A.2. Por otra parte, si tienes claro el concepto de variable aleatoria, podrás analizar los sucesos que no están determinados o programados con anterioridad. A.2.1. Dentro de los eventos y situaciones que observas a diario encuentras infinidad de comportamientos aleatorios A.2.2. y si los identificas y analizas tendrás herramientas para conocer cuales son los posibles resultados de las situaciones.

Igualmente, al comprender qué es una variable aleatoria A.3. entenderás qué es una variable no aleatoria, así que A.3.1. comprenderás en qué casos las variaciones de los eventos de tu realidad están programados con anterioridad. Esto te permitirá conocer con certeza el resultado de algunos acontecimientos, conocer de qué dependen y estar preparado para enfrentar sus consecuencias.A.4. Junto con el concepto de variable aleatoria también conocerás las clases que existen, lo que te ayudará a A.4.1. identificar una variable aleatoria continua y una variable aleatoria discreta. De este modo, sabrás determinarlas y reconocerás las situaciones que se describen por medio de mediciones y las que se describen por medio de conteos. A.4.1.1. Lo anterior te servirá en infinidad de eventos, ya que a diario estás describiendo tu realidad y analizando características

como tu estatura o tu peso. Tales características son continuas, mientras que la cantidad de goles que marca tu equipo favorito en un partido corresponde a una variable discreta.

A.4.2. Por otra parte, los conceptos propios de la presente unidad te ayudarán a entender qué es una variable aleatoria muestral y qué es una variable aleatoria poblacional y, gracias a ello, diferenciarás los casos en los que es conveniente la utilización de cada una de ellas. A.4.2.1. Esto te permitirá comprender cómo se realizan los censos de población, en los que se tienen en cuenta a todos los integrantes de una sociedad. A.4.2.2. Igualmente, comprenderás por qué en algunos casos no se tiene en cuenta la opinión de todas las personas para llegar a ciertas conclusiones sobre un tema determinado o por qué para determinar las preferencias de los consumidores de un producto tan sólo se consulta a una parte de quienes lo consumen.Una vez tengas claro el concepto de variable aleatoria, verás que por medio de éstas D.1. puedes analizar el comportamiento de situaciones en las que el azar determina el resultado de los acontecimientos y formular proyecciones sobre eventos futuros haciendo que tus decisiones sean más acertadas y estén basadas en un análisis que contemple las diferentes alternativas y sus probabilidades. Por otra parte, D.2. si comprendes el concepto de variable aleatoria, tendrás bases sólidas para continuar con el estudio de la estadística, pues este concepto es fundamental dentro de esta rama de la matemática. D.2.1. Ya que la estadística se encarga de recopilar, organizar y analizar el comportamiento de variables propias de conjuntos de datos para hallar conclusiones válidas, la comprensión de las variables aleatorias y no aleatorias es básica para continuar con tu aprendizaje en esta área.

Así mismo, debes saber que D.3. las variables aleatorias, como instrumentos fundamentales de la Estadística, tienen múltiples aplicaciones en todos los campos del conocimiento. D.3.1. Encontrarás que la utilizan dentro de las ciencias exactas y naturales, en el análisis del comportamiento de las personas,

Page 75: Usos Pedagogicos de internet

75

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

en los estudios de mercadeo que buscan determinar las preferencias de los compradores, en los análisis económicos y sociales o en las empresas que desean controlar los productos defectuosos.

MODELACIÓN

Para desarrollar la enseñanza afectiva nos basaremos en el contenido de la página:

http://www.monografias.com/trabajos16/libertad/libertad.shtmlhttp://www.e-torredebabel.com/Historia-de-la-filosofia/Filosofiacontemporanea/Sartre/Sartre-Libertad.htm1. De la primera página realice las lecturas:

Introducción, Concepto de libertad y persona y libertad.

2. De la segunda página realice la lectura del texto “Libertad: Para Sartre, la categoría antropológica fundamental, el rasgo más típicamente humano.”

3. A continuación plantearemos un propósito afectivo con relación al contenido de estos textos.

Propósito afectivo:COMPRENDER LA IMPORTANCIA DE REFLEXIONAR ACERCA DEL CONCEPTO DE LIBERTAD

4. Este propósito será ahora planteado a manera de tesis para posteriormente desarrollar un texto argumentativo

Enseñanza Afectiva:T. La Reflexión acerca de la libertad te brindará la posibilidad de construir un concepto ecuánime para poder hacer pleno uso de esa facultad sin dañarte a ti mismo ni a los demás. A.1. Teniendo en cuenta que el significado de esta palabra es tan relativo, es decir, que cada quien lo entiende según su “conveniencia”, se hace necesario pensar acerca de los límites de la libertad, ya que en nombre de ésta muchas veces se atenta contra la integridad de sí mismo o del otro.

A.2. Sabiendo que el poder de tomar decisiones es una de las facultades que se relaciona con la libertad, deberíamos pensar que tanto hacemos uso de ella para plantear nuestro proyecto de vida, A.2.1 ya que de este depende nuestra felicidad y realización personal. A.2.1.1 Esta última se construye a lo largo de nuestra vida a partir de cada elección que hacemos. A.2.1.2 Nuestro destino es constantemente transformado por cada decisión que tomamos. A.2.1.2.1 Y es precisamente esta capacidad de discernimiento la que va construyendo nuestra filosofía de vida.

ARGUMENTO 1 ARGUMENTO 2

ARGUMENTO 2.1.1

TESIS

ARGUMENTO 2.1.2

ARGUMENTO 2.1

ARGUMENTO 2.1.2.1

Page 76: Usos Pedagogicos de internet

76

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

5. Como ya se mencionó, el texto afectivo creado por el docente puede ser reforzado por otra clase de texto, en este caso seleccionamos un pequeño fragmento del texto sobre la visión sartriana, con el fin de suscitar una discusión entre los estudiantes acerca de la propuesta filosófica de este autor con respecto al concepto de libertad.

“Los fines que perseguimos no nos vienen dados ni del exterior ni del interior, de una supuesta naturaleza, es nuestra libertad la que los elige. Como dice en “El existencialismo es un humanismo”, no se nace héroe o cobarde, al héroe siempre le es posible dejar de serlo, como al cobarde superar su condición. Estamos condenados a ser libres: condenados porque no nos hemos dado a nosotros mismos la libertad, no nos hemos creado, no somos libres de dejar de ser libres. Aunque todo hombre está en una situación, nunca ella le determina, antes bien, la libertad se presenta como el modo de enfrentarse a la situación (al entorno, el prójimo, el pasado). Ni siquiera los valores, la ética, se presentan como un límite de la libertad, pues en realidad, dice Sartre, los valores no existen antes de que nosotros los queramos, no existen los valores como realidades independientes de nuestra voluntad, los valores morales los crea nuestra determinación de hacer real tal o cual estado de cosas. Al escoger unos valores en vez de otros, la voluntad les da realidad. La libertad se refiere a los actos y voliciones particulares, pero más aún a la elección del perfil básico de mí mismo, del proyecto fundamental de mi existencia, proyecto que se realiza con las voliciones particulares.”

Javier Echegoyen Olleta

TALLER

1. Busque en Internet información relacionada con los siguientes temas: o Mitos y Leyendas colombianaso Reciclajeo Ecuacioneso Descubrimiento de América1.1. De acuerdo a lo que haya encontrado en la Red, plantee un propósito afectivo y construya la

estructura argumentativa correspondiente. Algunas páginas sugeridas son:

o http://www.ecodes.org/lifepapel/htm/bp/o http://www.unimag.edu.co/antropologia/mitos_y_leyendas_colombianas.htmo http://www.galeon.com/home3/damerica/damerica.htmlo http://fresno.pntic.mec.es/~jvaamond/index.htm

2. De acuerdo con su área, seleccione un concepto y plantee un propósito afectivo para el aprendizaje de éste.

2.1 Busque una página de Internet que le brinde información con respecto a este propósito y de acuerdo cona la información que encuentre, elabore la estructura argumental correspondiente.

2.2 Busque un texto afectivo de apoyo (artículo, esquema, cuento, etc) para la motivación del aprendizaje del concepto.

3. Proponga una actividad para sus alumnos en la que ellos deban construir enseñanzas afectivas a partir de textos o información que aparezca en Internet alrededor de un tema determinado.

Page 77: Usos Pedagogicos de internet

77

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Fundamentos de Pedagogía Conceptual: Enseñanzas cognitivas ¿Qué son las enseñanzas cognitivas?

Esta es la parte central del proceso, ya que aquí quedarán establecidos y expuestos las nociones, proposiciones o conceptos (dependiendo del nivel educativo del estudiante). Sin embargo, solamente nos concentraremos en el aspecto conceptual de las enseñanzas, teniendo en cuenta que el objetivo de presentar este modelo pedagógico es proporcionarle al docente herramientas para la construcción de guías académicas que orienten al estudiante en su proceso de aprendizaje a través del uso de Internet. Las nociones y las proposiciones son la manera en que los más pequeños definen su realidad, pero, tratándose de un instrumento para el uso de docentes en la creación de estrategias pedagógicas, son ellos quienes determinan QUÉ se aprehenderá, ya que los estudiantes carecen de las herramientas para hacerlo.

¿Por qué son importantes las enseñanzas cognitivas?

Las enseñanzas cognitivas tienen el importante papel de delimitar el objeto de estudio a través de Operaciones intelectuales e Instrumentos de Conocimiento. Las primeras se definen a partir de cuatro proposiciones:o La primera proposición define la clase a la que pertenece el conceptoo La segunda, las clases que están al mismo nivel del concepto pero que

se excluyen u oponen a éste.o La tercera determina la característica que diferencia al concepto de los

de su misma clase.o Y finalmente, la cuarta enuncia las subclases que se desprenden del

concepto.

Para entender los Instrumentos de Conocimientos es necesario establecer la diferencia entre información e Instrumentos de conocimiento. Por un lado, tenemos que la información es aquello singular y específico, es todo aquéllo que entendemos como dato (Ejemplos: La masa atómica del aluminio es 27 gm/mol, la raíz cúbica de 729 es 9, etc.). Lo que nunca nos hemos puesto a pensar es que el cerebro no está diseñado para almacenar información, por lo menos no para mantenerla. Por otra parte, los Instrumentos de comunicación son análogos a los conocimientos en tanto ambos actúan como herramientas para interpretar realidades-reales o realidades-simbólicas (textos y discursos).27 Si, en cambio, «masa

27 DE ZUBIRÍA, Miguel. Pedagogías del siglo XXI: Mentefactos 1. Fondo de Publicaciones Fernando Herrera Merino. Fundación Alberto Merani.

Page 78: Usos Pedagogicos de internet

78

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

atómica» y «raíz cuadrada» son aprehendidos como conceptos por los estudiantes, ellos estarán en capacidad de comprender y producir informaciones relacionadas con dichos conceptos.

¿Cómo se construyen las enseñanzas cognitivas?

La pedagogía conceptual propone como alternativa para la esquematización del conocimiento LOS MENTEFACTOS CONCEPTUALES, que, al contrario de los esquemas o los llamados mapas conceptuales, sistematiza los conceptos con una propuesta clara de jerarquización.

Mapa conceptual:

Como verá no existe ningún criterio claro para la disposición de la información en el anterior cuadro, mientras que en el mentefacto conceptual se grafican cuatro proposiciones aristotélicas definidas como las operaciones intelectuales:

o Supraordinar: A través de esta operación se identifica el género del concepto en cuestión, es decir, se determina la clase inmediatamente superior a la que pertenece.

o Excluir: Identificar los conceptos de la misma clase pero que se le oponen o son excluyentes.

o Isoordinar: Consiste en encontrar las características propias del concepto, es decir, aquello que lo diferencia de los de su misma clase.

o Infraordinar: Determinar las clases inmediatamente inferiores al concepto.

EL MAR

ANIMALES PLANTAS EL HOMBRE Y EL MAR

DELFÍN ALGAS LA PESCA

Page 79: Usos Pedagogicos de internet

79

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Así, un concepto responde a 4 preguntas:

Un concepto responde a la pregunta ¿Qué es algo? A partir de 4 preguntas fundamentales:1. ¿De qué clase (inmediatamente superior) es el concepto?, es decir, el

concepto es un tipo de qué? 2. ¿Cuáles otros conceptos hay dentro de la clase superior que se

diferencian del concepto?3. ¿Por qué el concepto es diferente de sus exclusiones?4. ¿Cuáles son las clases del concepto?

Usted determinará el criterio de la clasificación de acuerdo al enfoque que quiera darle al concepto; sin embargo, debe tener en cuenta que entre una clase y otra no queden vacíos, porque éstos se pueden prestar para confusión. Ejemplo: la clase inmediatamente superior a perro no es animal, debe darle un enfoque más específico de acuerdo a lo que quiera enseñar, una opción puede ser: animal doméstico.

Es importante que al momento de elaborar los mentefactos consulte distintas fuentes y compare la información para construir un mentefacto objetivo. Ya que no todas las páginas que consulte le ofrecerán la misma calidad.

Ejemplo de un mentefacto:

ISOORDINAR EXCLUIR

SUPRAORDINADA

INFRAORDINAR

CONCEPTO

METALES NO METALES METALOIDES

COMPUESTO

Sustancias puras más simples

No pueden descomponerse químicamente

SUSTANCIAS PURAS

ELEMENTO

Page 80: Usos Pedagogicos de internet

80

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Para explicar el mentefacto se utilizan las cuatro proposiciones que salen de las operaciones intelectuales. Así, para el metefacto anterior quedarían propuestas las siguientes proposiciones:

P1. Un elemento es un tipo de sustancia pura.P2. Un compuesto es también una sustancia pura pero se diferencia de

un elemento.P3. Un elemento se caracteriza por ser la sustancia pura más simple y

por no poderse descomponer químicamente.P4. Hay diferentes clases de elementos: los metales, los no metales y los

metaloides. Veamos otro ejemplo:

A continuación, sugerimos realizar mentefactos con los alumnos, apoyados en páginas de Internet. De esta forma, podrán realizar procesos de conceptualización utilizando el recurso mediático. Así, lo que obtienen de la red deja de ser información específica para convertirse en instrumento de conocimiento.Observe el siguiente ejemplo:

Partiremos del propósito cognitivo: “Comprender qué es un cuadrilátero”. Recordemos que las preguntas conceptuales son determinantes para construir un concepto:

¿De qué clase superior es el concepto?

1. Ingrese a la página www.icarito.tercera.cl a la sección de guía para estudiantes, siguiendo la ruta: Matemáticas Õ Geometría Õ Revisando cuadriláteros

Según la definición que allí encontramos, un cuadrilátero es una clase de polígono.

LOBO COMÚN

PERROCHACALZORRO

CANINO

LOBO

LOBO DE CRIN ROJA

SUPERDEPREDADOR

Page 81: Usos Pedagogicos de internet

81

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Si nos devolvemos un paso en la ruta (Geometría), encontraremos la opción: polígonos, elementos y clasificación, la cual nos ayudará a esclarecer el concepto de Polígono y a identificar otros tipos de polígonos que no son cuadriláteros, como el triángulo, el pentágono, el hexágono, etc.

Siguiendo con los cuadriláteros, busque en qué se diferencia de otros polígonos. Encontrará que éstos son polígonos de cuatro lados, ni uno más ni uno menos.

o En la parte inferior de la pantalla en la ruta: Matemáticas Õ Geometría Õ Revisando cuadriláteros, encontrará que los cuadriláteros se pueden clasificar de acuerdo a la existencia de lados paralelos en:

Paralelogramos Trapecios Trapezoides

Ahora, observe el mentefacto del concepto que acabamos de construir:

TALLER

1. Utilice la siguiente lista de términos para elaborar conceptos y estructúrelos en mentefactos. De acuerdo a lo que halle en Internet, agregue o elimine las clases que considere necesarias (Deben salir mínimo tres mentefactos)

Molusco/hongos/cefalópodo/penicilina/levadura/mohonegro/ballenas/mamíferosmarinos/calamar/pulpo/

2. Busque una o varias páginas que le sirvan de soporte para construir los mentefactos de los siguientes conceptos:

TRAPECIO

TRIÁNGULOPENTÁGONOHEXÁGONO

N-GONO

POLÍGONO

CUADRILÁTERO

TRAPEZOIDE

4 LADOS

PARALELOGRAMO

Page 82: Usos Pedagogicos de internet

82

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

• Hipérbaton • Archipiélago • Artebarroco • Sofistas

3. Realice una selección de páginas que tengan alto contenido cognitivo para su área, recuerde que los criterios de búsqueda dependen de los conceptos básicos manejados en su materia. Por ejemplo: Ciencias naturales buscará conceptos tales como célula o sistema óseo, etc.

4. Busque una página cuyo diseño sea atractivo y de alta calidad cognitiva en su área y proponga a sus alumnos la elaboración de mentefactos a partir de los conceptos allí tratados. Preste especial atención al criterio de clasificación y a la manera en que jerarquizan los conceptos.

Fundamentos de pedagogía conceptual: enseñanzas expresivas

¿Qué son las enseñanzas expresivas?

Las enseñanzas expresivas son aquellas encargadas de proporcionar las herramientas de dominio o uso del concepto, culminando el ciclo de apropiación de éste. Es en esta fase en la que el estudiante practica y confronta la parte cognitiva con la realidad, es decir, se enfrenta con la aplicabilidad del concepto.

Las enseñanzas expresivas se caracterizan porque:

o Están orientadas hacia el logro de propósitos expresivos.o Requieren el uso del concepto para llevarlo a la práctica. (Ponen en

acción al concepto).o Implican creación o ejecución de procedimientos establecidos.

¿Por qué son importantes las enseñanzas expresivas?

Son importantes ya que permitirán al estudiante adquirir confianza y seguridad con respecto al conocimiento o la competencia adquirida. En este proceso, además de corroborar las proposiciones que construyen el concepto, se dará el espacio para: hacer asociaciones entre el concepto (o la competencia) aprendido y otros aprendidos previamente, desarrollar propuestas prácticas, literarias o de otra índole con el fin de fomentar de la creatividad.

Page 83: Usos Pedagogicos de internet

83

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

¿Cómo se construyen?

Como su nombre lo indica, las enseñanzas expresivas pretenden orientar al estudiante hacia un proceso de saber hacer. Por ello, la pedagogía conceptual ha implementado una serie de elementos que encaminan de manera organizada este propósito. Dicha estructura está compuesta por:

• AlgoritmooHeurístico• Modelación• Simulación• Ejercitación

¿Qué es un algoritmo y un heurístico?

Un algoritmo es un procedimiento basado en un conjunto de pasos o instrucciones que unidos permiten el logro de un objetivo determinado. Los algoritmos son secuenciales y el cumplimiento de sus pasos debe ser estricto para garantizar el cumplimiento del objetivo.

EJEMPLO:

Vamos a tomar como base la actividad planteada en la página http://www.icarito.cl/icarito/2003/917/gas.htm. Este ejercicio le sirve al estudiante para observar y provocar, de acuerdo a sus conocimientos, reacciones químicas.

¿Cómo quedaría planteada esta tarea en forma de algoritmo?

1. Verter un poco de vinagre en una botella de vidrio de cuello estrecho2. Poner una cucharadita de bicarbonato dentro de un globo de caucho

CIENCIASHUMANAS

Estructura para Enseñanzas Expresivas

ALGORITMO

CIENCIASEXACTAS

Procedimiento basado en una serie de pasos que deben ser seguidos en

orden estricto para lograr el objetivo.

HEURÍSTICO

Page 84: Usos Pedagogicos de internet

84

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

3. Colocar el globo sobre la boca de la botella sin dejar caer bicarbonato dentro de ella

4. Levantar el globo para que caiga el bicarbonato dentro de la botella

Reacción: Ni el vinagre ni el bicarbonato están ahora como tales, ambos se han mezclado para formar un gas que infla el globo.

El propósito expresivo que correspondería a la elaboración de este algoritmo sería:o Provocar reacciones químicas con elementos sencillos

Un heurístico, que también es un procedimiento, permite variaciones en el orden de ejecución de las instrucciones, pues corresponde a un conjunto de orientaciones o guías para lograr un objetivo, sin que los cambios en algunos pasos acarree errores en el resultado.

Estas estructuras son muy eficientes porque:

o Muestran en forma muy clara el cómo realizar una actividad determinada, disminuyendo las probabilidades de error y el tiempo de aprendizaje.

o Con su uso frecuente generan en los estudiantes estructuras de pensamiento sistemáticas que les permitirán diseñar sus propios procedimientos en forma ordenada y estructurada.

o Para el profesor, son una forma muy acertada para ordenar las ideas que trasmitirá a los estudiantes.

¿Qué es la modelación?

La modelación corresponde a la ejemplificación de la forma como se ejecuta el algoritmo. Una modelación contiene el desarrollo de cada uno de los pasos con las explicaciones pertinentes para su comprensión.

CIENCIASHUMANAS

Estructura para Enseñanzas Expresivas

HEURÍSTICO

CIENCIASEXACTAS

Procedimiento basado en una serie de pasos que varían en su ejecución de acuerdo a los recursos y

al objetivo.

ALGORITMO

Page 85: Usos Pedagogicos de internet

85

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Para el algoritmo «Reacciones químicas», la modelación correspondería a la ejemplificación en vivo del proceso. Por ejemplo: El profesor mostrando a los alumnos el experimento paso a paso. También nos sirve como ejemplo las fotografías que acompañan las instrucciones, ya que nos enseñan lo que va ocurriendo y cómo hacerlo correctamente.

¿Qué es la simulación?

La simulación consiste en un conjunto de ejercicios que permiten adquirir destrezas para cada una de las instrucciones del algoritmo en forma separada. Se proponen ejercicios para cada paso por separado.Éste se utiliza sobre todo para procedimientos que requieren algo de práctica en sus pasos. Por ejemplo, para el algoritmo de reacciones químicas no necesitaríamos practicar pasos tales como: verter vinagre en una botella. Sin embargo, existen otros tipos de operaciones que sí necesitan de la ejercitación para perfeccionar la ejecución de todo el procedimiento.

EJEMPLO: Para realizar un análisis comunicativo se puede plantear un heurístico en el que cada paso sea identificar uno de los elementos: EMISOR – RECEPTOR – MENSAJE – CÓDIGO, etc. De modo que podrían darse ejemplos de procesos comunicativos para identificar los diferentes códigos utilizados.

¿Qué es la ejercitación?

La ejercitación corresponde a un conjunto de ejercicios y actividades en las que el estudiante debe poner en práctica el algoritmo completo. Estos ejercicios deben estar diseñados de forma que permitan verificar el cumplimiento del propósito o propósitos expresivos correspondientes.

Ahora, veamos un ejemplo completo de Algoritmo, modelación, simulación y ejercitación:

Algoritmo para realizar cálculos de interés simple

1. Se analiza el problema y se determinan las magnitudes conocidas y desconocidas (Interés, Capital inicial, Tasa de interés y tiempo).

2. Se establece la relación entre las variables conocidas que permita resolver el problema. Dichas relaciones parten de:

3. La tasa de interés debe ser expresada como tasa por uno al realizar los cálculos: es decir, debe ser dividida por 100.

4. Se reemplazan por valores numéricos las variables de la igualdad y se realizan los cálculos para obtener el valor del interés.

Modelación.

¿Cuál será el interés que debes pagar por un préstamo de $ 1.000.000 realizado por un año con una tasa de interés de 20 %?

1. Analizamos el problema y determinamos las magnitudes que conocemos y desconocemos.

El valor presente, es decir, la cantidad de dinero que se presta en este caso es $1.000.000. Conocemos el tiempo que dura el préstamo y la tasa de interés. Se pide determinar el valor del interés generado así que esta será nuestra variable desconocida.

VP= $ 1.000.000 t= 1 año i= 20 % I = ?

2. Establecemos la relación entre las variables conocidas y planteamos la forma de resolver el problema.

I = VP x i x t

Page 86: Usos Pedagogicos de internet

86

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Ya que conocemos el Valor Presente, la tasa de interés y el tiempo, la relación que permite hallar el Interés es:

3. Expresamos la tasa de Interés en tasa por uno. i = 20/100 = 0.2 Es decir, si por prestar $100 se realiza un cobro

de $20, por prestar $1 se cobrará $0.24. Reemplazamos por valores numéricos las variables

de la igualdad y realizamos los cálculos para obtener el valor del interés.

Respuesta: Un capital inicia de $1.000.000 generará un interés de $200.000 después de un año.

SIMULACIÓN:

PASO 1.

a) En los siguientes casos determina cuál valor corresponde al capital inicial, al Interés, la tasa de interés y el tiempo.

Una persona trabaja en un concesionario en el que pagan $Q cada mes. Además, cada vez que vende un auto recibe $R independientemente del valor de la venta. Dicha persona necesita ahorrar para adquirir un carro propio que cuesta $J así que decidió poner en un CDT durante un año el producto de las comisiones de los últimos 3 meses. El mes 1 vendió 9 carros, el mes 2 vendió 10 y el mes 3 vendió 6 carros. Pasado el año recibió $P mas de los que había invertido inicialmente por que el CDT pagó una tasa de interés de J% anual.

b) En una ocasión Alejandro se interesó en una bicicleta que costaba $P. Busco sus ahorros pero como no le alcanzaba le pidió $A a Andrés durante 6 meses.

Andrés le aseguró que le prestaría el dinero pero que al cabo de los 6 meses debía cancelarle $C aparte de la deuda ya que cada mes le cobraría $D por cada $100 prestados.

c)2. I = VP x i x t

Por: $ L

Vencimiento al 1 de Octubre de 2000

Yo, Betsy L. Niño, declaro que recibí la cantidad de $ L en moneda corriente. Me obligo a pagar a la orden de Oscar Pérez la cantidad el día 1 de Octubre de 2000. Los intereses de la cantidad mencionada se pagarán al J % mensuales correspondientes a la suma de $0. En caso de mora pagaré durante ella intereses a una tasa de interés de Q% anual.

Para constancia firmamos en la ciudad de Bogotá, al primero (1) del mes de Abril de dos mil (2000)

FIRMA Betsy L. Niño c.c. 88.541.298 de BogotáDirección Cll. 23 # 68-56 BogotáTeléfono: 6 25 72 46

FIRMA: Oscar J. Pérezc.c. 59.452.219Dirección: Cll. 143 # 93-12 BogotáTeléfono: 7 82 46 91

PASO 2.

Plantea la relación que permite dar respuesta a la pregunta dada:

a) Una señora recibe inesperadamente una herencia millonaria de $J. Piensa que la mejor opción en ese momento es prestar su dinero y cobrar intereses, pero no sabe cómo determinar lo que debe cobrar, así que estos cálculos los realiza otra persona. En una ocasión alguien le canceló $K de intereses por una deuda de $L. Dicha cantidad le pareció muy

3. I = VP x i x t

4. I= $ 1.000 000 x 0.2 x 1 año

Page 87: Usos Pedagogicos de internet

87

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

pequeña en relación con la cantidad de dinero que había prestado y decidió averiguar como estaban calculando los intereses. ¿Qué respuesta podrías dar tú a esa inquietud?

b) Si consignas tu dinero en una institución financiera que cada año paga $10 por cada $100 consignados, cuánto debiste consignar para que al cabo de 2 años recibas $150.000 por intereses?

c) ¿Cuánto tiempo debe pasar para que un capital de $P genere un interés de $I a una tasa de interés de 5% mensual?

PASO 3.a. Determina la tasa por uno de las siguientes tasas expresadas

porcentualmente: 20 % 35 % 2 %b. A que tasa porcentual equivale 0.025 0.015 0.30c. Una persona millonaria decide prestar su dinero cobrando $60 por

cada $1000. ¿Cuál será la tasa porcentual y la tasa por uno que corresponde a este cobro?

EJERCITACIÓN

1. Si un día ganas un premio de $200.000 en un chance es lógico que busques utilizar tu premio de la mejor forma. Tal vez quieras hacer una pequeña inversión por algunos meses y entonces debes decidir entre varias alternativas. Si tienes la oportunidad de prestar ese dinero al 4 % mensual o de realizar un pequeño negocio que te garantiza que recibirás por lo menos $70.000 pasados 6 meses, ¿cuál sería la mejor alternativa?

2. Alguien necesita $ 1.000.000 para iniciar un negocio. Se dirige al Banco Nacional y le prestarán dinero cobrándole una tasa de interés de 5% mensual. ¿Cuál será el interés que pagará al cabo de 5 meses?

3.

CASA COMERCIAL LA JOYARECIBO N. 34

El Sr. José Triana recibió de Jorge Machado la suma de $100.000 en calidad de préstamo sobre prenda y cancelará intereses por valor de 5.000 cada mes.El deudor depositó en calidad de prenda el (los) siguientes artículos:Discman Sony, Reloj Citizen.La casa comercial se compromete a conservar los artículos por un máximo de 120 días, tiempo tras el cual se puede proceder a la venta de los artículos antes mencionados.

Page 88: Usos Pedagogicos de internet

88

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Según el recibo anterior, cual es la tasa de interés con la que se pactó este préstamo?

4. Gabriel necesita ayuda. En una ocasión inició un negocio y para ello solicitó $500.000 prometiendo que los cancelaría en 4 meses con una tasa de interés de 2% mensual. Desafortunadamente su negocio no tuvo éxito por lo que no pudo pagar la deuda en el tiempo convenido. La persona que le presto el dinero le dijo que le ampliaría el plazo solo si Gabriel aceptaba pagarle una tasa de interés de 3% mensual y no el 2% como estaba previsto. Pasados 8 meses desde el día del préstamo Gabriel consiguió $800.000 para cancelar la deuda pero no sabe cuanto debe pagar por intereses. ¿Podrías darle tu una respuesta?

5. Si quieres abrir tu propia cuenta de ahorros en el Banco del País y te ofrecen una tasa de interés de 1% mensual, cuánto tendrías que consignar para general un interés de $20.000 en 6 meses?

Ahora veamos un ejemplo de un heurístico:

Heurístico para buscar pistas en títulos e imágenes para descifrar el significado de lo que leo1. Observar y mencionar los elementos que componen la lectura: Título,

dibujos, fotos, texto, subtítulo(s).2. Analizar el título

2.1 Leer y entender la realidad que menciona el título, reconociendo el vocabulario

3. Establecer las expectativas que genera el título3.1 Establecer de qué manera y por qué me interesa la realidad que

menciona (gusto, curiosidad, etc)3.2 Identificar las preguntas que podrías resolver con respecto a la

realidad que menciona la lectura de dicho texto4. Analizar subtítulos u otros títulos

4.1 Leer y entender la realidad que menciona, reconociendo el vocabulario

4.2 Establecer cómo se relacionan los subtítulos con las expectativas generadas en el título4.2.1 Reconocer si la realidad que menciona el subtítulo está

contenida en la realidad mencionada y por qué. Por ejemplo, TÍTULO: Animales marinos SUBTÍTULO: El pulpo

4.2.2 Si el subtítulo no está contenido en el título, identificar cuál es la posible relación entre ellos.

4.2.3 A cuáles intereses de los formulados en el punto 3.1. respondería el subtítulo y por qué (expectativas)

4.2.4 A qué preguntas de las formuladas en el punto 3.2 respondería y por qué (expectativas)

Page 89: Usos Pedagogicos de internet

89

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

4.3 Establecer nuevas expectativas que genere el subtítulo5. Analizar imágenes

5.1 Hacer una descripción general (reconocimiento de elementos) de la imagen o la fotografía

5.2 Establecer la relación entre los elementos de la imagen y el título y/o los subtítulos

5.3 Establecer la relación entre imágenes y expectativas del título y el subtítulo (p.e TITULO: El tigre, EXPECTATIVA: Cómo es la apariencia de un tigre? IMAGEN: Foto o dibujo de un tigre)

6. Repetir el proceso correspondiente con cada imagen y/o subtítulo presentado en el texto

Inicio

Fin

Observar los elementosque componen la

lectura

Algoritmodedecodificación

primaria

Establecerexpectativas

que genera eltítulo

Establecer de quémanera y por qué me

interesa la realidadquemenciona

Identificar las preguntasque podría resolver conrespecto a la realidad

Descripción deelementos

¿Haysubtítulos?

Analizarsubtítulos

Algoritmo dedecodificación

primaria

Identificar larelación entre eltítulo y el subtítulo

¿El títulocontiene alsubtítulo?

Identificarconquéexpectativa se

relaciona

Establecernuevas

expectativas

Hallar la relación delsubtítulo con las

expectativas generadaspor el título

¿Hayimágenes?

Analizarimágenes

Relacionar elementos con

los títulossubtítulos

Relacionarimágenes conexpectativas

Analizar eltítulo

Page 90: Usos Pedagogicos de internet

90

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Modelación para buscar pistas en títulos e imágenes para descifrar el significado de lo que leo

HAY AVES QUE NO VUELAN

Algunas aves están incapacitadas para volar, habilidad que perdieron hace varios millones de años. El avestruz, el emú, el casuario y el ñandú corren con sus potentes patas; el pingüino antártico emplea sus alas para nadar; el kiwi, en cambio, las tiene atrofiadas y vive en madrigueras.Quiénes y por qué no vuelanEn las aves terrestres no voladoras,

los músculos pectorales están poco desarrollados y falta la quilla. El avestruz de las sábanas africanas es la mejor ave viviente, con una altura de tres metros y un peso de 150 kilos. Las alas estabilizan al animal durante la carrera, pero no podrían mantener en vuelo semejante peso. El kiwi (que habita en Nueva Zelanda) está dotado de un largo pico y de un excelente olfato; sus fuertes patas le permiten escarbar el terreno en busca de pequeñas presas. Suele tener el tamaño de un pavo no muy grande. El pingüino tiene quilla y músculos pectorales desarrollados.

1. TÍTULO: Hay aves que no vuelan SUBTÍTULO: Quiénes y por qué no vuelan IMAGEN: Un pingüino2. Entiendo todas las palabras que conforman el título

y el sentido de esa afirmación3. TÍTULO: Hay aves que no vuelan

3.1 Me causa curiosidad que existan aves que no vuelen porque yo creía que todos los pájaros volaban, me gustaría saber cuáles son y para qué les sirven las alas si no vuelan.

3.2 Cuáles son las aves que no vuelan? Las aves que no vuelan, sólo caminan o se

desplazan de otras formas? Tienen problemas las aves que no vuelan?

4. SUBTÍTULO: Quiénes y por qué no vuelan4.1 Entiendo el vocabulario que conforma este

subtítulo

4.1.1 El subtítulo introduce la mención de las clases de aves que no vuelan y por qué.

4.1.2 El subtítulo respondería a la expectativa de cuáles son las clases de aves que no vuelan

4.1.3 El subtítulo no responde a ninguna expectativa de las que se me ocurrieron en el punto 3.2

4.2 El subtítulo me abre la posibilidad de saber por qué no vuelan esas aves

5. IMAGEN: Un pingüino5.1 Debajo del título aparece un dibujo sencillo

de un pingüino y detrás de él hay hielo5.2 El título nos da entender que el texto trata

sobre aves que no vuelan y el subtítulo nos introduce a una parte del texto donde se habla de esas aves y por qué no vuelan. Si el dibujo que aparece es el de un pingüino, debo suponer que es un ave que no vuela y que en el texto van a hablar de él.

5.3 Una de las expectativas que me generó el título y el subtítulo fue aprender cuáles son las aves que no vuelan. Gracias al dibujo ya conozco una de las aves que no vuela.

Simulación para buscar pistas en títulos e imágenes para descifrar el significado de lo que leo

1. Haz decodificación primaria de los siguientes títulos y subtítulos

a) TÍTULO: La geografía colombiana SUBTÍTULOS: Las principales vertientes Las cadenas montañosas b) TÍTULO: Antiguos habitantes de América SUBTÍTULOS: Los Mayas Los Incas c) TÍTULO: Los deportes extremos SUBTÍTULO: Alpinismo Motocross Automovilismo2. Establecer las expectativas que genera cada uno de

los títulos del punto anterior

Page 91: Usos Pedagogicos de internet

91

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

3. Establecer la relación entre cada título y sus respectivos subtítulos.4. A qué expectativas responden los subtítulos con respecto de los

títulos5. Establecer nuevas expectativas que generen los subtítulos6. Describe las siguientes imágenes

a) _______________________________________________

_______________________________________________

_______________________________________________

_______________________________________________

b) _______________________________________________

_______________________________________________

_______________________________________________

_______________________________________________

c) _______________________________________________

_______________________________________________

_______________________________________________

_______________________________________________

7. Relaciona las imágenes con los siguientes títulos y subtítulos. Si no comprendes alguno, recuerda realizar decodificación primaria.

___ La Medicina ___ Deportes de alto riesgo ___ Héroes que dan su vida por otros ___ La salud de las mascotas ___ Pilotos temerarios ___ El fuego: amigo y enemigo

8. Para cada título y subtítulo establece unas expectativas 9. Relaciona las expectativas con las imágenes. Es decir, de qué manera

las imágenes corresponden a las expectativas planteadas?

Page 92: Usos Pedagogicos de internet

92

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Ejercitación para buscar pistas en títulos e imágenes y descifrar el significado de lo que leo

1. Elabora un listado de expectativas que te generen los siguientes títulos y subtítulos. Recuerda hacer decodificación primaria si es necesario.

a) TÍTULO: La televisión SUBTÍTULOS: Historia de la TV Qué podemos ver en la TV Usos de la TV b) TÍTULO: La leche y sus derivados SUBTÍTULOS: De dónde viene la leche? Los quesos El kumis La mantequilla

c) TÍTULO: Leyendas Colombianas SUBTÍTULOS: El Mohán La Llorona La Patasola El Sombrerón

2. Elabora uno o dos dibujos para cada caso, explicando cómo se relaciona con el título o el subtítulo.

3. Describe detalladamente los siguientes dibujos

a) _______________________________________________

_______________________________________________

_______________________________________________

_______________________________________________

b) _______________________________________________

_______________________________________________

_______________________________________________

_______________________________________________

Page 93: Usos Pedagogicos de internet

93

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

4. Imagina posibles títulos y subtítulos para las imágenes del punto anterior. Explica para cada caso la relación entre la imagen y el título o subtítulo.

5. Elabora un listado de expectativas para los títulos y subtítulos que inventaste.

6. Desarrolla en los siguientes casos, todos los pasos del heurístico para buscar pistas en títulos e imágenes y descifrar el significado de lo que leo

c) TÍTULO: Medios de transporte SUBTÍTULOS: Medios de transporte aéreos Medios de transporte terrestre Medios de transporte masivo

d) TÍTULO: El reino animal SUBTÍTULOS: Animales vertebrados Animales invertebrados Insectos

Todo este material (gráficas, textos, ejercicios) es de más sencilla construcción si se utiliza Internet como herramienta. La idea es que la

b) TITULO: Cuentos infantiles SUBTÍTULOS: Los tres cerditos Blancanieves El sastrecillo valiente

a) TITULO: El mundo de la fantasía SUBTÍTULOS: Hadas Duendes Unicornios Ogros

Page 94: Usos Pedagogicos de internet

94

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

página en la que encuentre los contenidos de su interés le sirva de soporte desde el momento mismo de plantear propósitos y objetivos, hasta el momento de evaluación.

El anterior ejemplo de heurístico es apropiado no sólo para el área de lenguaje en primaria. Si usted observa los pasos se dará cuenta que son apropiados para aplicarlos a la lectura de páginas de Internet de diferentes géneros. Esta metodología permitirá realizar una selección de paginas y recursos de acuerdo con los propósitos particulares.

TALLER

1. Visite la página http://www.icarito.cl/infografia/ciencia/fisica1-03/leyes.htm, allí encontrará información acerca de las tres leyes de Newton y gráficas explicativas. Elabore una simulación de alguna de estas leyes.

2. Haga una selección de páginas con alto contenido expresivo (actividades, ejercicios, experimentos, etc.) y clasifíquelas de acuerdo a los contenidos que usted maneja en su área. Por ejemplo:

ENSEÑANZAS EXPRESIVAS

3. En la página http://www.geocities.com/Heartland/Shores/1545/ encontrará completa información sobre

la Hidroponía. Realice un algoritmo o un heurístico, según lo crea conveniente, con la correspondiente modelación, simulación y ejercitación.

MATERIA GRADO CONCEPTO PÁGINAFísica 11 ondas www.onditanet.com

Fundamentos de pedagogía conceptual: construcción de evaluaciones

El ideal de las evaluaciones es dar cuenta de los indicadores de logro, que son claros indicios en el avance del proceso pedagógico. Al contrario de los logros, los indicadores son objetivos medibles y observables.

A la hora de evaluar es muy importante tener en cuenta ciertos criterios fundamentales como:

o La evaluación está directamente relacionada con las enseñanzas. Primero, no se deberá evaluar algo de lo cual no estemos seguros de haberlo trabajado lo suficiente con el alumno y, segundo.

o El tipo de evaluación que se llevará a cabo estará dictaminado por el verbo expresado en el indicador de logro curricular.

o Tanto el docente como el alumno deben tener claros los términos de la evaluación:

A. La finalidad de la evaluación: La evaluación tendrá siempre el propósito de conocer el nivel de desarrollo del conocimiento del alumno. Las preguntas que deben quedar resueltas en este punto son: ¿Qué quiero yo, como docente, averiguar en cuanto al proceso de aprendizaje de mi alumno? Y ¿Qué conceptos o habilidades evaluará mi profesor de mi proceso de aprehendizaje?

B. Forma de evaluar: Es importante que ambas partes tengan clara la manera en que se hará la evaluación. En este punto hay que hacer mucho énfasis en cuanto a la claridad de las instrucciones, ya que de ésta depende en

Page 95: Usos Pedagogicos de internet

95

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

gran medida que los alumnos hagan lo que el profesor espera.

C. Tiempo de evaluación: A pesar de que el docente puede, y de hecho debería, evaluar en cualquier momento sin previo aviso, es necesario tener en cuenta a los alumnos para la programación de evaluaciones de mayor exigencia o de metodología extraordinaria con el fin de darles espacio para una adecuada preparación.

Internet como contexto evaluativo e investigativo

No sólo los portales educativos son de gran utilidad a la hora de evaluar, ya que plantean una gran variedad de actividades, ejercicios, dinámicas, etc, también otros tipos de sitios en Internet son alternativas muy eficientes en el ámbito escolar. Por ejemplo, las páginas de revistas y periódicos son una alternativa para tener al alcance material de actualidad: artículos, crónicas, informes, etc. Éstos y otros son generadores de debates, herramientas para la producción de escritos, etc.

Las páginas de entidades o Instituciones como Ministerios, Museos, Embajadas, ONGs, Defensorías (de niños, ancianos, discapacitados, animales), etc. también son fuentes de información valiosa para procesos investigativos. A veces las formas de evaluación se estancan y tienen sólo unas pocas variables tradicionales, y de nada sirve innovar en unos aspectos educativos y descuidar otros que van caducando. Los docentes más que nadie conocen la importancia de la equidad en los procesos de mejora, ya que están sumergidos en un ambiente de constante cambio y desarrollo. Por ello, es favorable dedicar un espacio para la creación de nuevas estrategias evaluativas. Este es un aspecto en el que Internet también ofrece soporte a los maestros; en algunos portales educativos, por ejemplo, existe el servicio de compartir esta información con otros maestros, al igual que buenas ideas para plantear evaluaciones creativas y eficientes.

Los talleres conceptuales como herramienta para evaluación cognitiva

Un taller conceptual es una herramienta de evaluación que permite verificar si un alumno ha comprendido completamente un concepto y está en capacidad de identificarlo en diferentes contextos.

Con el taller conceptual se busca reconocer aquellos pensamientos erróneos o “seudopensamientios” que tiene el alumno acerca de determinado concepto; mediante la formulación de algunas preguntas organizadas lógicamente el alumno podrá reconocer su carencia cognoscitiva, y a la vez se intenta acercar al estudiante a una comprensión más acertada del concepto.

EJEMPLOS.

TALLER CONCEPTUAL LENGUAJE

LA COMUNICACIÓN

1. Un ciudadano llega a una cafetería y dice “Uno con azúcar, por favor”. El mesero le trae un café, que era lo que él quería. El mesero comprendió el mensaje completo porque: a. el canal era claro en la cafeteríab. el referente del mensaje debía ser obviamente

un caféc. el mesero (receptor) debía conocer al ciudadano

(emisor)d. el contexto de la situación completó el

mensaje

2. Si Dios escribiera su autobiografía sería:a. un personaje secundario, si cuenta la historia

en tercera personab. un autor sin narradorc. un narrador omnisciente porque dios conoce

todo y lo ve todod. un narrador protagonista porque él cuenta su

propia historia

Page 96: Usos Pedagogicos de internet

96

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

3. Existe una novela que consiste en una larguísima carta de amor del protagonista a su amada, llamada Sofía. En tal caso Sofía es: a. la lectora de la novelab. un personaje secundario de la novelac. la escritora de la novelad. la narradora de la novela

4. Un autor escribe unos versos titulados “Poema para mí mismo”. Cuando años después el autor lee esta obra, él es:a. el autor del poemab. el narrador del poemac. el personaje del poemad. parte del público del poema

5. Un ciudadano bien particular va hablando sólo por la calle. Esta situacióna. no es comunicativa, porque no hay receptorb. no es comunicativa, porque carece de intenciónc. es comunicativa, porque, en tanto que habla sobre algo, se puede establecer un referented. es comunicativa, porque el ciudadano habla para si mismo, cumpliendo los papeles de emisor y receptor.

El anterior taller tiene como finalidad corroborar las ideas erróneas que pueden tener los estudiantes con respecto al proceso comunicativo y las funciones que lo componen. Por ejemplo en la pregunta 3, el docente se dará cuenta qué tan claro tiene el estudiante el concepto de receptor.

TALLER

De acuerdo a su área, busque páginas que le ofrezcan contexto o ejemplos interesantes para evaluar conceptualmente los siguientes temas:

a) Área y perímetrob) Figuras literariasc) América prehispánicad) Existencialismoe) Sistema circulatoriof ) Integrales y derivadasg) Mecánica - rozamiento

Para los más pequeños encontrarán bastante material didáctico (dibujos, refranes, cuentos, etc) en www.aulainfantil.com.

Page 97: Usos Pedagogicos de internet

97

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Fundamentos de pedagogía conceptual: construcción de guías

ENSEÑANZAS AFECTIVAS

El espacio para cada clase no siempre tiene que ser utilizado de la misma manera, muchas veces las clases magistrales y los ejercicios agotan a los estudiantes, por eso es importante no sólo generar motivación sino lograr mantenerla a lo largo del proceso. Las guías son una alternativa para desarrollar actividades que saquen de la rutina el proceso de aprendizaje.

A lo largo del curso se ha hecho énfasis en la importancia de un trabajo orientado y con un horizonte claro. Pues bien, las guías son el producto que pone en juego las herramientas organizativas para trabajos con o sin Internet.

Las guías tienen diferentes objetivos y funciones, entre ellos, está el propósito de desarrollar actividades que potencien los contenidos de

TALLER

TALLER DE SENSIBILIZACIÓN ¿QUÉ ES Y CÓMO SE HACE UNA GUÍA?

Esta actividad tiene como propósito compartir la experiencia del trabajo en clase con guías. El ideal es que los grupos se conformen con docentes de diferentes disciplinas para hacer más enriquecedor el ejercicio.

1. Conformar grupos de cinco personas para responder las siguientes preguntas, intercambiar experiencias y discutir al respecto.

1. ¿Qué entiende usted por GUÍA?2. ¿Elabora guías como material de soporte para su clase? ¿Por qué? Si no lo ha hecho, ¿le gustaría?, ¿Por

qué?3. Explique cómo es la estructura de las guías que elabora, es decir, de qué se componen. (ejercicios,

talleres, contenido cognitivo, etc.)4. ¿Cómo es el proceso de construcción de esas guías?, ¿Qué hace primero, qué recursos utiliza, etc?5. Describa las actividades que plantea en las guías, por ejemplo: salidas de campo, debates, tareas para

la casa, trabajo en clase, entre otros.6. ¿El uso de guías en su materia ha enriquecido el proceso de aprendizaje?7. ¿Considera importante e interesante implementar el uso de guías en su materia?, ¿Por qué?

Page 98: Usos Pedagogicos de internet

98

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

clase. El ideal es estructurar trabajos que requieran esfuerzos y destrezas varias (lectura, investigación, proposición, observación, etc.).

Las guías representan el producto práctico en el que el profesor se apropia de la Fuente (Internet u otros) y orienta a los alumnos a través de estrategias creativas hacia un buen uso de éstas.

ENSEÑANZAS COGNITIVAS

P.1. Las guías académicas son uno de los recursos pedagógicos escritosP.2. Las guías académicas son recursos pedagógicos escritos diferentes a los textos escolares y los manuales de instrucciones.P.3. Las guías académicas se diferencian de otro tipo de recursos pedagógicos escritos por proponer una estructura organizativa para reforzar un concepto.

Una de las grandes razones para optar por la elaboración e incorporación de guías en su clase es que nadie mejor que usted conoce las fortalezas y debilidades de sus alumnos, por lo tanto nadie mejor que usted para la planeación de estrategias de refuerzo. Si bien algunos textos escolares ofrecen una muy completa exposición del currículo e interesantes propuestas en cuanto a ejercicios y evaluaciones, sólo el docente puede ofrecer la posibilidad de realizar un trabajo que tenga en cuenta factores personalizados, tales como el aprovechamiento de recursos con que cuenta su Institución. Por ejemplo, un profesor de biología puede desarrollar una propuesta ecológica que tenga en cuenta las zonas verdes de su colegio y sus alrededores, los intereses de sus estudiantes, etc.

Recursos pedagógicos escritos

GUÍAS ACADÉMICAS

Estructura organizativa para el refuerzo de un

concepto

Textos escolares

Manual de instrucciones

Literatura del área

Page 99: Usos Pedagogicos de internet

99

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Internet juega un papel fundamental dentro de las posibilidades de recursos a explotar ya que actualmente Internet representa todo un paradigma en cuanto a fuentes de conocimiento; sin embargo, así mismo representa el anti-paradigma como piloto educativo. Sin un norte, Internet puede ser el peor consejero no sólo para los niños; cualquiera que no sepa crear un plan de conocimiento está propenso a perderse en un maremágnum de información. Por ello es fundamental establecer un rumbo claro que, en este caso, se ve cristalizado en la construcción de guías académicas.

El proceso de preparación de una guía debe ser muy riguroso, sugerimos que tenga en cuenta los siguientes pasos:

1. Determine la destreza o el concepto a desarrollar2. Plantee los propósitos. Recuerde que debe haber

unos de índole afectiva, que deben corresponder con los de índole cognitiva y finalmente los de índole expresiva.

Es importante tener en cuenta la correspondencia entre éstos, ya que de esto depende la organización del proceso de aprendizaje y el buen entendimiento del concepto. Por ejemplo, si su propósito afectivo es que el estudiante comprenda la importancia de conocer las causas de la Revolución Industrial y el propósito cognitivo fuera comprender qué es la Revolución Industrial, estaríamos dando al estudiante dos ideas distintas para trabajar como si fuera una misma cosa. Lo que si podemos hacer es ir por partes, es decir, proponer varios propósitos afectivos con sus correspondientes cognitivos, todos relacionados con un mismo tema. (Ya veremos el ejemplo en las guías.)

3. Investigue.3.1. Consulte información relacionada con el

concepto en los portales educativos

Consulte páginas relacionadas con el tema. Por ejemplo, si el concepto o tema es: ANIMALES SALVAJES o ECOSISTEMAS MARINOS, puede consultar portales relacionados con la naturaleza

como Entidades ecológicas, canales internacionales especializados en el tema (National geographic, Animal plannet, etc.).

4. Seleccione material relacionado con el tema que le parezca atractivo e interesante. Recuerde tener en cuenta que necesitará material de índole afectiva, material de índole cognitiva y material de índole expresiva. Esto no quiere decir que el material sea necesariamente en sí mismo de tal o cual índole, sino que usted le pueda dar ese enfoque. Recuerde los elementos trabajados anteriormente para la elaboración de cada tipo de enseñanzas.

5. Clasifique la información seleccionada para darle cuerpo a la guía. Jerarquice de menor a mayor grado de complejidad y por diferentes tipos de enseñanzas.

6. Empiece la construcción de su guía redactando de manera clara los propósitos.

7. Proponga las enseñanzas. Tenga en cuenta que el uso del lenguaje es muy importante para que la guía cumpla su objetivo, es decir: utilice un vocabulario propio para los alumnos de acuerdo a su edad.

Utilice mecanismos de persuasión en el lenguaje, recuerde que uno de los objetivos de las guías es alejarse de la frialdad de las clases magistrales. Use las palabras como una estrategia de trabajo personalizado de modo que los alumnos se sientan importantes y motivados. Ejemplo: «No olvides que el sujeto de una oración puede ir al comienzo o al final de una frase, lo importante es....»

7.1. Elabore las enseñanzas afectivas teniendo especial cuidado en garantizar que responden al propósito afectivo. Incluya artículos, cuentos, entrevistas, reseñas, etc., para enriquecer los procesos de motivación. Así mismo, cree ejercicios o preguntas que despierten la inquietud por la temática a abordar. Igualmente, puede proponer talleres en los que los estudiantes se dirijan a Internet para encontrar las razones por las que un conocimiento es valioso. Sugiérale

Page 100: Usos Pedagogicos de internet

100

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

páginas o formule preguntas a resolver con ayuda de Internet. 7.2. Elabore el mentefacto del concepto y desarrolle un texto

conceptual teniendo en cuenta la información que ha seleccionado. La ejemplificación es un recurso muy valioso para el aprendizaje. Internet ofrece innumerables contextos de ejemplificación para todo tipo de concepto.

7.3. Elabore las enseñanzas expresivas: tenga en cuenta que deben responder al propósito expresivo y deben poner en juego el concepto desarrollado anteriormente. Recuerde que en Internet puede encontrar material valioso para enseñar destrezas, pero si usted se ocupa de estructurarlo de una forma sistemática y clara el resultado será más enriquecedor.

8. Elabore la evaluación: La evaluación está determinada por los propósitos y las enseñanzas; preferiblemente siga la didáctica propuesta en su guía. Puede elegir información de la red como contexto de evaluación.

A continuación presentamos algunos modelos de guías que les sirvan de ejemplo para idear las suyas.

GENOTIPO Y FENOTIPO

PROPÓSITOS

Propósito afectivoValorar la importancia de comprender que son y como se determinar los genotipos y fenotipos en los seres vivos

Propósito cognitivoComprender el concepto de Genotipo y fenotipo

Propósito expresivoHallar el genotipo y el fenotipo de una descendencia a partir de una información dada

ENSEÑANZAS

ENSEÑANZAS AFECTIVAS

T: Debes convencerte de la utilidad de comprender la forma como se trasmite la herencia en los seres vivos.

A.1. Poseerás una mejor comprensión del mundo vivo en el que vivesA.1.1. Las características de los seres que te rodean responden a unos

patrones de herencia determinados

1

La intención de elaborar guías no es en absoluto desplazar al resto de los recursos, al contrario, la idea es multiplicar sus posibilidades de uso aprovechándolos aún más. Y es precisamente una estructura organizativa, como la planteada desde pedagogía conceptual, la que nos aproxima al cumplimiento de este propósito.

Para este punto ya contamos con todos los elementos que conforman dicha estructura: PROPÓSITOS, ENSEÑANZAS y EVALUACIÓN. Sólo basta seleccionar un contenido de su preferencia, elaborar un plan actividades y aplicarlo a la estructura guía.

Page 101: Usos Pedagogicos de internet

101

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

A.1.2. A través de los contenidos de esta unidad podrás comprender las razones por las que los seres que te rodean poseen determinadas las características

A.2. Comprenderás porque tú mismo posees determinadas características

A.2.1. Entenderás que muchas de tus propias características no se deben al azar sino que se originan por patrones definidos

A.2.2. Podrás comprender la forma como esas características han llegado desde tus antepasados hasta ti

A.3. Este conocimiento te servirá de base para comprender la forma como se trasmite la herencia en diferentes características

A.3.1. A partir de este conocimiento podrás comprender más adelante como se determina tu tipo de sangre, tu sexo o la aparición de algunas enfermedades asociadas a la herencia

A.3.2. Tendrás bases para comprender cuáles características son hereditarias y cuáles no

A.4. Es un conocimiento con grandes aplicaciones en nuestro medio productivo.

A.4.1. Las personas que se dedican al cultivo o a criar diferentes especies pueden prever las características de la descendencia de sus animales o plantas.

A.4.2. A partir de estos conocimientos y de las necesidades específicas pueden planificar las características de la descendencia

ESTRUCTURA PRECATEGORIAL

TEXTO DE ENSEÑANZAS AFECTIVAS

¿Alguna vez te has preguntado por qué tus características físicas son las que ves en el espejo y no unas distintas?, ¿No crees que existen razones que explican cómo los seres vivos transfieren sus características a través de las generaciones? A través de la presente unidad aprenderás cuáles son los patrones que definen la transmisión de la herencia. Para ello es esencial que domines los conceptos de fenotipo y genotipo, determinantes en el estudio de la genética. Si comprendes estos conceptos lograrás una mejor comprensión del mundo que te rodea pues todos los seres vivos responden a ciertos parámetros hereditarios.

Así mismo, por medio de estos conceptos entenderás por qué tu mismo posees determinadas características y no unas distintas, y sabrás cuáles corresponden a patrones hereditarios y cuáles no. Igualmente, a partir de los conceptos que se desarrollarán en la guía tendrás bases claras para profundizar en el estudio de la genética. Comprender qué es y cómo se determinan el genotipo y el fenotipo de un individuo es esencial para determinar rasgos como el grupo sanguíneo, la aparición de enfermedades hereditarias ligadas al sexo, el sexo de un bebé y muchas otras características. De hecho, gracias a estos conceptos en nuestro medio se realizan investigaciones referentes a la identificación de los padres de una persona a partir de análisis de sus patrones hereditarios. Estos conceptos también son útiles para prevenir situaciones de riesgo en las que la descendencia de una pareja pueda sufrir enfermedades relacionadas con patrones hereditarios.

Por otra parte, en nuestro entorno productivo estos conocimientos son de gran utilidad para aquellas personas que se dedican a cultivos o a la crianza de animales, pues pueden prever las características de la descendencia de una generación y pueden planificar las características que desean en los descendientes. Por ello, los cruces que realizan en el entorno agrícola no son intuitivos si no que responden a unos estudios

T

A.1 A.2 A.3 A.4

A.1.1 A.1.2 A.2.1 A.2.2 A.3.1 A.3.2 A.4.1 A.4.2

Page 102: Usos Pedagogicos de internet

102

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

previos que les permitan obtener los resultados que más les convengan para su trabajo.

ENSEÑANZAS COGNITIVAS

EL GENOTIPO Y EL FENOTIPO

TEXTO CONCEPTUAL

La genética es una rama de la Biología que estudia la forma como los organismos les transmiten a sus descendientes sus características particulares. La herencia genética es la transmisión de características de padres a hijos.

Estas características están contenidas en los genes que aporta cada padre en la formación del individuo.

La información genética contenida en los genes puede sufrir cambios; éstos reciben el nombre de mutaciones.

La herencia genética es particular y única para cada organismo y gracias a ella podemos caracterizarlos a partir de su genotipo y de su fenotipo.

Patrones de herencia

GENOTIPO

Constitución genética con

relación a una característica

Fenotipo

Para individuo homocigoto

Para individuo heterocigoto

Patrones de herencia

FENOTIPO

Característica hereditaria observable Genotipo

Page 103: Usos Pedagogicos de internet

103

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

El genotipo es un patrón de herencia en tanto que es un parámetro que permite explicar y determinar como algunas características de un ser vivo se transfieren a las generaciones posteriores.

El genotipo determina la constitución genética de un organismo con referencia a una sola característica o a un conjunto de características. Al decir una característica nos referimos a, por ejemplo, el color de las flores de una planta. Se establece un genotipo para esta característica. El genotipo se determina a partir de los alelos de los cromosomas homólogos.

Los individuos, de acuerdo con la composición de su genotipo pueden ser homocigotos o heterocigotos para una característica determinada, Esta clasificación se determina a partir de la configuración de los alelos de los cromosomas homólogos.

Un individuo es homocigoto para una característica, cuando los dos alelos de los cromosomas homólogos son iguales.

Se dice que los individuos son heterocigotos para una característica cuando los dos alelos de los cromosomas homólogos son diferentes.

El genotipo se diferencia del fenotipo, otro patrón de herencia, en que este último corresponde a es la característica observable de un organismo que resulta de las interacciones entre el genotipo y el ambiente. Así, mientras el genotipo es un código de información el Fenotipo es la característica que puede ser visualizada.

PREGUNTA CONCEPTUAL

En una finca alguien quiere obtener unos conejos con un color de pelo determinado. Para ello deciden adquirir una pareja de conejos que serán los padres de la camada. Al comprarlos le comentan al dueño de la tienda de animales cuáles son sus requerimientos en la descendencia, es decir, le cuentan que quieren tener conejos grises.

En este caso, al decir que quieren conejos de pelo gris están especificando

a. El fenotipo de la descendenciab. El genotipo de la descendenciac. Tanto el genotipo como el fenotipod. Ni el fenotipo ni el genotipo

ENSEÑANZAS EXPRESIVAS

GENÉTICA MENDELIANA

¿Cómo se identifica el genotipo y el fenotipo?

ALGORITMO

1. Identificar si es un problema de genética mendelianao El problema hace referencia a la forma como se

heredan características físicas del individuo.o La característica que se hereda tiene sólo dos

formas de expresarse (aparecer) en el individuo, una forma dominante y otra recesiva.

2. Identificar la forma como se presenta el problemaa. Se da la información de las características y la

forma como se heredan en forma de texto. i. Puede darse el genotipo (la representación en

letras de la información que hay en los genes) ii. y/o el fenotipo (las características que aparecen

físicamente en el individuo). Pase al punto 3

b. En forma de árbol genealógico en el que se muestra como aparecen las características hereditarias del problema en padres e hijos durante varias generaciones. Para interpretarlo hay que tener en cuenta:

o Cuando se hace diferencia entre sexos los machos se representan con un cuadrado y las hembras con un círculo

o Los padres que encabezan el árbol se denotan con la letra P. Cada generación se representa con una letra F y un subíndice (p.ej.: F1 es la primera generación, F2 la segunda, etc.)

Page 104: Usos Pedagogicos de internet

104

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

o El cruce entre un macho y una hembra se representa por una línea horizontal que los une.

o Los hijos se representan por círculos y cuadrados (según el sexo) que se derivan directamente de la línea de unión de los padres.

o Identifique cómo aparece la característica que se hereda en los individuos teniendo en cuenta la simbología usada en el problema (p. ej.: las figuras oscuras representan una de las formas como se expresa la característica y las claras, otra).

b. Es homocigoto dominante si las dos letras son mayúsculas (dominante) (p. ej: AA)

c. Es homocigoto recesivo si las dos letras son minúsculas (recesivas) (p. ej.: aa)

5. Identificar el fenotipo para cada genotipo: a. La forma dominante de la característica se manifiesta

en el individuo, si el gen es homocigoto dominante o heterocigoto.

b. La forma recesiva de la característica se manifiesta en el individuo sólo si el gen es homocigoto recesivo.

MODELACIÓN

Se sabe que el color de las semillas de guisantes puede ser de dos formas: Una verde de carácter dominante y una amarilla de carácter recesivo. Si se cruza un parental amarillo con una planta verde (GG), ¿Cuál es el fenotipo y el genotipo que se obtienen?La descendencia esperada es

1. la mitad de las plantas hijas serán amarillas y la mitad verdes

2. todas las plantas hijas serán verdes3. la mayoría de las plantas hijas serán verdes4. todas las plantas hijas serán amarillas

1. Identificar si es un problema de genética mendeliana

El problema es de genética mendeliana puesto que hay una característica que se hereda y posee una forma dominante y otra recesiva.

2. Identificar la forma como se presenta el problema: La información se da únicamente en forma de texto

por lo que pasamos al paso 3

3. Identificar el genotipo del problema:a. La forma dominante de la característica está

representada con la letra G (mayúscula)b. La forma recesiva de la característica no aparece

representada en el texto, pero por convención usaremos la g (minúscula) para representarla.

3. Identificar el genotipo del problema: El genotipo se representa gráficamente por medio de

letras mayúsculas y/o minúsculas. Si el problema no lo muestra explícitamente es necesario construirlo teniendo en cuenta los siguientes pasos:

a. El gen que expresa una característica se representa por 2 letras iguales (alelos) mayúsculas y/o minúsculas (p. ej.: AA, aa ó Aa); uno proviene de la madre y el otro del padre. El orden de las letras no importa (Aa=aA).

b. La forma dominante de la característica se representa con la letra mayúscula.

c. La forma recesiva de la característica se representa con la letra minúscula.

4. Identificar si el genotipo es homocigoto o heterocigoto:

a. Es heterocigoto si presenta una letra mayúscula (dominante) y la otra minúscula (recesivo) (p. ej.: Aa)

Padre

Hijo

Pareja del hijo

Madre

Cruce, unión

Hija

Pareja de la hija

Page 105: Usos Pedagogicos de internet

105

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

4. Identificar si el genotipo es homocigoto o heterocigoto:

Para la planta verde se da el genotipo y, según este paso, por estar representado por dos mayúsculas, es homocigoto dominante. Para la planta amarilla no se especifica el genotipo.

5. Identificar el fenotipo de cada genotipo: Ya sabemos los fenotipos. GG es verde. Y ya que

la característica de la planta amarilla es recesiva, su genotipo será un homocigoto recesivo (gg).

¿Cómo se resuelven ejercicios que involucren el cruce entre dos individuos?

ALGORITMO

1. Identificar el genotipo de cada padre:a. El ejercicio puede dar esta información. Si no

aparece, será necesario deducirlo de acuerdo con el algoritmo anterior.

b. A veces el cruce entre dos padres se representa por el símbolo X.

2. Realizar el cruce entre los genotipos: Hacer una cuadrícula de 3 x 3 cuadros. Separar las 2 letras (alelos) del genotipo de

cada padre y ubicar las de uno de los padres en la fila superior y las del otro en la columna de la izquierda.

Obtener los genotipos posibles de los hijos (F1) combinando en cada cuadro la letra de la fila superior con la correspondiente de la columna izquierda.

Ej. Cruzar padres heterocigoto con homocigoto recesivo (Aa x aa)

\ A AA Aa AaA Aa Aa

3. Identificar el fenotipo posible de los hijos:

MODELACIÓN

Para obtener la respuesta del ejercicio propuesto en el ejemplo anterior se deben seguir los siguientes pasos:

1. Identificar el genotipo de cada padre:

El cruce que se nos pide es entre padres de genotipo GG y gg. 2. Realizar el cruce entre los genotipos:

Trazamos la cuadrícula; separamos los alelos (letras) de una planta parental (G y G) y los colocamos en la primera fila; separamos las letras del otro parental (g y g) y las colocamos en la primera columna, como se indica a continuación. Combinamos las letras de la fila y de la columna correspondiente:

x G Gg Gg Ggg Gg Gg

3. Identificar el fenotipo posible de los hijos:

Identificamos el fenotipo de los hijos. Todos son heterocigotos así que expresarán la característica dominante, es decir, son verdes. Por lo tanto, la respuesta correcta es b: todas las semillas de plantas hijas serán verdes.

¿Cómo se identifica la proporción de los posibles genotipos o fenotipos?

ALGORITMO

1. Identificar cuál es el genotipo y el fenotipo según las características del problema.

2. Realizar el cruce para determinar los genotipos de los hijos.

3. Determinar la proporción de heterocigotos, homocigotos dominantes y homocigotos recesivos.

Page 106: Usos Pedagogicos de internet

106

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

4. A partir de lo anterior, determinar la proporción de los fenotipos teniendo en cuenta:

a. El fenotipo de todos los hijos será la forma dominante de la característica, si:o Ambos padres son homocigotos dominanteso Un padre es homocigoto dominante y el otro

heterocigotob. El fenotipo de todos los hijos será la forma recesiva

de la característica, si:o Ambos padres son homocigotos recesivos

c. El fenotipo esperado de los hijos estará en proporción 2:2 (50% forma dominante y 50% forma recesiva), si:o Un padre es heterocigoto y el otro homocigoto

recesivod. El fenotipo esperado de los hijos estará en

proporción 3 : 1 (75% dominante, 25% recesivo), si:o Los dos padres son heterocigotos

MODELACIÓN

Si se cruzan los descendientes del problema anterior para obtener la F2, las plantas resultantes serána. La mitad amarillas y la mitad verdesb. Todas verdesc. El 75% amarillas y el 25% verdesd. 25% amarillas y el 75% verdes

1. Identificar cual es el genotipo y el fenotipo de las características del problema.

Según el resultado del ejercicio anterior, toda la descendencia del primer cruce es de genotipo Gg, por lo tanto, para obtener la segunda generación todos los padres tienen genotipo Gg, que corresponden al fenotipo “semillas verdes”.

2. Realizar el cruce entre los genotipos: El cruce entre cualquier par de plantas será Gg X

Gg. Realizamos los cruces siguiendo las instrucciones

de este paso

x G GG GG Ggg Gg Gg

3. Determinar la proporción de heterocigotos, homocigotos dominantes y homocigotos recesivos.

La proporción de genotipos es:

Genotipo PorcentajeGg 50%GG 25%Gg 25%

4. Determinar la proporción de los fenotipos: Los hijos de semilla verde serán los homocigotos

dominantes (GG) y los heterocigotos (Gg). Los hijos de semilla amarilla serán los homocigotos recesivos (gg).

Teniendo en cuenta la proporción de genotipos, el 75% tienen la característica dominante (50% Gg, + 25% GG) así que son plantas de semillas verdes. Sólo uno de los 4 genotipos (25%, gg) tiene la característica recesiva, por lo tanto, el 25 % de las plantas serán de semillas amarillas. Por lo tanto, la respuesta correcta es la opción d.

EJERCITACIÓN

De acuerdo con el algoritmo plateado desarrolla los siguientes ejercicios.

1. En la mosca de la fruta el color de ojo rojo normal es dominante sobre el ojo blanco mutante.

¿Qué fenotipos espera encontrar al cruzar moscas de ojos rojos con moscas de ojos blancos?a. Moscas de ojos rojos y moscas de ojos

blancosb. Moscas de ojos rojosc. Moscas de ojos blancosd. Moscas de ojos rosados

Page 107: Usos Pedagogicos de internet

107

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

2. ¿En que proporciones espera encontrar los fenotipos del cruce anterior?a. El 100% de las moscas con ojos rojosb. El 25% de las moscas con ojos rojos y el 75% con ojos blancosc. El 100% de las moscas con ojos blancosd. El 50% de las moscas con ojos rojos y el otro 50% con ojos

blancos

3. Si se le asigna la letra R a la característica dominante, ¿Cuáles serán los genotipos de la descendencia anterior?a. Genotipos RRb. Genotipos Rr y rrc. Genotipos Rrd. Genotipos rr

4. A un jardinero le gusta tener plantas de peras que produzcan semillas verdes (el color de las semillas verdes es recesivo y el amarillo es dominante) y sólo dispone de semillas amarillas obtenidas de un cruzamiento entre semillas verdes y amarillas.

Si permite que las plantas que provienen de esas semillas disponibles se autopolinicen, ¿Qué proporción de descendencia podría usar para obtener peras de semillas verdes?a. Todasb. Tres cuartosc. Un cuartod. Ninguna

5. De un cruce de plantas verdes (obtenidas del cruce anterior) con plantas amarillas se obtuvo plantas con semillas amarillas.

Esto significa que el genotipo de la planta utilizada era:a. Homocigota recesiva (ss)b. Heterocigota (Ss)c. Heterocigota (ss)d. Homocigota dominante (SS)

TALLER

Para la siguiente actividad sugerimos organizar grupos y que en cada uno de ellos haya por lo menos un docente del área de Ciencias Naturales que lidere el ejercicio.

Page 108: Usos Pedagogicos de internet

108

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Copyright© Todos los derechos reservados

Replantee la anterior guía investigando en Internet. A continuación le sugerimos algunas páginas que puede utilizar; recuerde explorar los hipervínculos que encuentre ya que lo pueden conducir a valiosa información.

http://www.arrakis.es/~lluengo/problemas1.html http://www.arrakis.es/~lluengo/herenciasexo.htmlhttp://www.biologia.arizona.edu/mendel/sets/sex1/02t.htmlhttp://www.unavarra.es/genmic/genetica%20y%20mejora/genetica_poblaciones/genetica_poblaciones.htmhttp://www.reddeleducador.com.ar/la_herencia_y_el_sexo.htm

ENSEÑANZAS EXPRESIVAS

Reúnase en grupo para desarrollar el siguiente ejercicio.

En las enseñanzas cognitivas se propuso una serie de pasos para plantear una guía, estos equivaldrían a un algoritmo. A continuación sígalos uno por uno en la elaboración de una guía de su área de trabajo.

Page 109: Usos Pedagogicos de internet

FUNDAMENTACIÓN INFORMÁTICAUnidad 3

Page 110: Usos Pedagogicos de internet
Page 111: Usos Pedagogicos de internet

111Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

FASE DE FUNDAMENTACIÓN INFORMÁTICA

PROPÓSITOS

Lograr que los participantes:

• SeconvenzandelautilidaddesaberconstruirunaPágina Web.

• Comprendanlosconceptostécnicosalrededordela elaboración de una Página Web.

• DiseñenyelaborenunaPáginaWeb.

INTRODUCCIÓN

Para nadie es desconocido el impacto y la importancia de Internet en el mundo actual. Se ha creado conciencia alrededor de sus beneficios, pero también de sus perjuicios. Aunque la red agiliza actividades rutinarias, permite establecer redes de comunicación y abre un sin número de posibilidades para acceder a todo tipo de información, también puede aislar física y socialmente a las personas o dificultar la selección de información útil a propósitos particulares.

Por lo anterior, es fundamental desarrollar procesos de formación orientados a la comprensión de los lenguajes de la red. Entender la red permitirá acceder a un mundo de posibilidades, adquirir información relacionada con campos académicos, políticos, culturales, abrir espacios para el aprendizaje y acercar información para la toma de decisiones. Incluso, a través de la red, personas que geográficamente se encuentran aisladas pueden hacer parte de la comunidad global y compartir experiencias, proyectos, información, etc. Internet presenta una nueva forma de establecer relaciones interpersonales, laborales y culturales.

Así, como en todas las experiencias de la vida, se debe tomar lo bueno y desechar lo no tan bueno. De ahí la importancia del proyecto, ya que no representa sólo la adquisición de unos conocimientos y destrezas en el aspecto técnico o tecnológico, sino la aplicación de lo aprendido aprovechando los recursos disponibles para generar un producto de beneficio para la comunidad a la que se pertenece, para ver la tecnología desde otro punto de vista, esto es, con perspectiva social; se busca que los implicados sean más que “consumidores de información”28, (que chatean, navegan o bajan música), y se conciban como “constructores de información” que, usando avances de la tecnología y conscientes de su realidad social, participen activamente en el progreso de su comunidad, el cual redunda en progreso de su ciudad y de su país.

Reconociendo la importancia y el impacto personal y social de este proyecto, se empezará por la revisión de algunos conceptos técnicos básicos requeridos para su desarrollo, luego se estudiarán los lenguajes y programas relacionados con diseño, construcción, edición y publicación de una Página Web, para finalmente aplicarlos en la elaboración de un sitio de internet para la Institución Educativa.

La construcción de una Página Web no sólo requiere el conocimiento de los aspectos técnicos para su desarrollo. Es necesario que quienes la construyan desarrollen un proceso sistemático que les permita determinar la información que aparecerá en la página, su diseño y la estructura apropiada para que sea un buen canal de comunicación para las personas que acceden a ella. Por esto, antes de iniciar el trabajo sobre HTML, es necesario realizar una conceptualización rigurosa acerca de las Páginas Web y brindar herramientas para su concepción y diseño.

28 SÁNCHEZ Ilabaca, Jaime. Usos Pedagógicos de Internet. Red Educacional Enlaces. Ministerio de Educación de Chile.

Page 112: Usos Pedagogicos de internet

112Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

ENSEÑANZAS

ENSEÑANZAS AFECTIVAS

La utilidad de los sitios de Internet está más que justificada, es la ventana a un mundo virtual, tecnológico, que ofrece una amplia gama de servicios, entretenimiento, conocimiento y posibilidades de pertenecer y participar en la comunidad global en forma muy sencilla.

Internet es útil en la vida personal y académica por las posibilidades de entretenimiento, información y conocimiento que brindan; es un espacio de encuentro disponible para todos y que hay que aprovechar al máximo.

Sin embargo, las posibilidades de Internet no sólo se encuentran asociadas a la recepción de información y la utilización de sus servicios (como chat, correo electrónico y transferencia de archivos); hoy en día Internet ofrece una plataforma muy ágil y sencilla para que las personas puedan hacer parte del proceso de construcción y difusión de la información. El objetivo de esta unidad es precisamente que los estudiantes aprendan a producir y publicar páginas Web a través de las que puedan expresarse y causar algún impacto sobre la comunidad en la que se encuentran.

La posibilidad de proyectarse mediante un sitio de internet resulta tentadora tanto para las entidades como para los individuos. Para las instituciones, ofrece la oportunidad de promocionar su marca, productos, servicios y crea la posibilidad de incrementar su negocios y vincular clientes potenciales que incluso podrán comprar de forma virtual.

Para las personas, el hecho de ser conocidos en la red, que puedan dar a conocer su imagen, proyectos, ideales y que otras personas se puedan vincular y relacionar con ellos resulta muy productivo. No es sólo la posibilidad de conocer personas sino de compartir proyectos de vida que pueden redundar en soluciones de impacto comunitario y social.

Si un joven aprende a elaborar páginas Web ampliará sus proyecciones laborales por cuanto la difusión en Internet es una preocupación trascendental para las instituciones hoy en día. Así mismo, al conocer la forma como funcionan los procesos de publicación, tendrá herramientas para difundir sus ideas, pensamientos y productos. Esto representará ventajas importantes en el momento actual en el que tiene un gran valor contar con competencias para desempeñarse en la red.

ENSEÑANZAS COGNITIVAS

Es indispensable la fundamentación teórica en estos tipos de proyectos; por eso se inicia con algunos conceptos técnicos básicos necesarios para lograr el diseño, construcción y publicación de un sitio web institucional.

Desde la concepción teórica del lenguaje HTML se avanza paso a paso en la práctica. En cada uno de los temas estudiados se proponen talleres y ejercicios que van llevando al afianzamiento de los conceptos presentados y se proyecta enl la aplicación del producto final.

El hablar de Páginas Web implica una serie de conceptos y conocimientos previos acerca de Internet. Lo elemental se trató en la primera unidad de este documento y a continuación se desarrollarán los demás temas requeridos.

¿Qué es un Sitio Web?

Un Sitio Web es un lugar en la red que está formado por varias Páginas Web.

Es un conjunto de archivos y páginas web relativos a un tema en particular que incluye una página inicial de bienvenida, generalmente denominada Home Page, con un nombre de dominio y dirección en Internet específicos, además de una serie de páginas web donde se desarrollan los temas presentados en la página inicial relacionados mediante vínculos.

Page 113: Usos Pedagogicos de internet

113Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Cuál podría ser la estructura de un Sitio Web?

La página de presentación o bienvenida tiene un diseño sencillo pero llamativo, orientado al tipo de sitio que está presentando. Esta página equivale a la portada de un libro, revista o periódico y puede ser el éxito o el fracaso del sitio, de ahí la importancia, cuidado y dedicación que debemos tener en su diseño.

Está página de presentación mostrará el contenido del sitio, mediante un índice de temas que con vínculos permitirá navegar por las diferentes páginas que conforman el sitio.

Al seleccionar una de las opciones de la página de presentación, entramos a una Página Web. Las diferentes páginas del sitio deben conservar una uniformidad de estilo en cuanto a textos, color e imágenes.

Al entrar a una página del sitio web se pueden encontrar: títulos, imágenes, animaciones, vínculos, música, botones de acción, menús, etc. Cada uno de estos elementos, debidamente integrados y definidos, responden al diseño definido para esta página el cual debe atender a las necesidades de la persona o entidad propietarios de la página.

PÁGINA PRINCIPAL(Home Page)

ESTRUCTURA DE UN SITIO WEB

Página Web 1 Página Web 2 Página Web 3 Página Web 4

Page 114: Usos Pedagogicos de internet

114Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

El único requisito que deben cumplir las páginas que hacen parte de un sitio web es que el equipo en el que residan los documentos (servidor web o servidor http) esté conectado a la red mundial Internet. Este equipo de cómputo o Servidor Web, como se le denomina técnicamente, puede contener más de un sitio Web y atender concurrentemente a los visitantes de cada uno de los diferentes sitios.

Los Sitios Web pueden ser de diversos géneros, destacando los sitios de negocios, servicio, comercio electrónico en línea, imagen corporativa, entretenimiento y sitios informativos.

¿Cómo puede ser la estructura interna de un Sitio Web?

Sería una estructura de carpetas y archivos organizados de tal forma que agilicen el acceso a la información y que respondan al diseño previo del sitio.

A continuación se presentan dos posibles estructuras de archivos del mismo sitio, cada una con un diseño diferentes:

Elementos que puede contener una Página Web

Page 115: Usos Pedagogicos de internet

115Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Qué es una Página Web?

Una página Web es la unidad básica del World Wide Web y es la unidad mínima de un sitio web.

Es un documento electrónico que contiene información específica de un tema en particular y que es almacenado en algún sistema de cómputo que se encuentre conectado a Internet, de tal forma que este documento pueda ser consultado por cualquier persona.

Una página Web tiene la característica peculiar de que el texto se combina con imágenes para hacer que el documento sea dinámico y permita que se puedan ejecutar diferentes acciones, una tras otra, a través de la selección de texto remarcado o de las imágenes, acción que nos puede conducir a otra sección dentro del documento, abrir otra página Web, iniciar un mensaje de correo electrónico o transportarnos a otro Sitio Web totalmente distinto a través de sus vínculos.

Estructura de los archivos del sitio

Imágenes

Sonidos

ElemActivos

Página de inicio (index.html)

Datos Empresa

Productos

ElemActivos

Imágenes

Sonidos

Sitio 1

Página de inicio (index.html)

Datos Empresa

Imágenes

Sonidos

Productos

ElemActivos

Sitio 2

Page 116: Usos Pedagogicos de internet

116Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

El archivo de la Página Web contiene el texto más una serie de códigos que permiten dar formato a la página en el navegador. Además, contiene animaciones, imágenes, sonidos, películas, vínculos, entre otros, que responden a un diseño previo.

Se trata simplemente de un archivo de texto, con una extensión .HTM o .HTML (de Hypertext Markup Language – lenguaje de hipertexto.) Este archivo contiene el texto más una serie de códigos que permiten dar formato a la página en el navegador: por ejemplo, distribuir en columnas, poner letras en negrita, asignar colores, rodear una imagen con texto, etc.

Las páginas web necesitan de programas de edición de HTML y otros programas de gestión para ser publicados en la red.

Pueden ser elaborados por los gobiernos, instituciones educativas, instituciones públicas o privadas, empresas o cualquier otro tipo de asociación, además de las personas, que quieran pertenecer a la comunidad virtual y que tengan un propósito definido.

Texto:

Puede proceder de un procesador de datos

ESTRUCTURA DE UNA PÁGINA WEB

Películas interactivas

Flash, entre otros

Programas de edición de html y gestión

Imágenes:Programas gráficos: gif,

jpg, png

Programación:Php, Java, etc.

Otros componentes: multimedia, sonidos,

animaciones, ...

Page 117: Usos Pedagogicos de internet

117Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Qué sucede cuando se entra a un Sitio o Página Web?

Una vez establecida la conexión a Internet y la comunicación con el servidor, se selecciona el Sitio Web al que se quiere ingresar digitando la dirección. Al dar Enter o hacer clic sobre el botón Ir, esto es lo que sucede:

1. Se carga del servidor la página y se busca en ella los archivos vinculados, los cuales corresponden a los archivos de imágenes, animaciones, música, etc., que se incluyen en la página.

2. Luego se cargan los archivos vinculados del servidor. Si falta algún archivo mostrará el mensaje de error y avisa que el archivo es corrupto.

3. A continuación se verifican que los archivos, sitios o documentos definidos como enlaces existan. Si falla alguna conexión se mostrará el mensaje de error.

4. Se muestra el sitio en la pantalla.

Este proceso puede demorar algunos segundos, y es más rápido o lento de acuerdo a la configuración del equipo que ingresa y según el “peso” del sitio, es decir, el tamaño en bytes que ocupan todas las páginas y archivos relacionados. Este “peso” se debe controlar para asegurar un acceso eficiente y rápido, lo que redunda en que el usuario se sienta confortable al entrar al Sitio, no se distraiga y busque como salir y entrar a otra página.

¿Cuáles son las clases de sitios que se pueden encontrar en la red?

Al intentar crear un sitio Web muchas veces no se tiene una idea precisa del género o tipo de sitio que se quiere crear. Identificar o definir el género del su Sitio Web es tan importante como la definición misma del objetivo de negocios para una empresa ya que ahí radica la base de un buen diseño.

Los sitios pueden clasificarse desde diferentes puntos de vista. Teniendo en cuenta la naturaleza con la

que fueron creados pueden ser: institucionales o personales.

Un sitio personal es aquel que es creado por personas del común, con renombre, reconocimiento local o internacional, por ejemplo, un cantante, escritor, músico o pintor que, popular o no, se propone con el sitio contar sus actividades, proyectos, conciertos, exposiciones y, en ocasiones, abren un vínculo para sus fanáticos o seguidores. Agregan también vínculos a la entidad (editorial, sello musical, galería …) que los patrocina o promueve. En algunos casos, cuando estas personas son la imagen de una marca (ropa, celular, zapatos, carros,…) o tiene la propia (perfume, maquillaje,….) tiene enlace a los portales o páginas de estos productos. Cuando una persona del común es la “dueña” de su página puede convocar o reunir otras personas en torno a un propósito especial ya sea comercial, altruista o de otra índole y lograr un impacto en su entorno social y cultural.

Los portales institucionales se pueden categorizar de acuerdo con el tipo de institución: pública o privada, de educación, comercio, fabricación, financiera, entre otras. En estos sitios se puede encontrar la historia, trayectoria, misión, visión, proyección, ubicación y sedes de una institución. Es una presentación de la imagen corporativa, una ventana virtual para conocer la empresa.

Las instituciones aprovechan las oportunidades y facilidades que brinda Internet para reforzar sus marcas y productos. Además de crear oportunidades de negocio, estos sitios tienen como propósito fundamental proyectar una imagen al mercado consolidado y potencial que atienden para reforzar el posicionamiento de sus marcas en la mente de los consumidores.

Este género de sitios es el preciso si el propósito es comunicar una imagen y llegar hasta el consumidor final del producto o servicio que su empresa ofrece, con el propósito esencial de reforzar su nombre, marcas y productos.

Page 118: Usos Pedagogicos de internet

118Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Los portales institucionales se pueden identificar en su dirección URL por su dominio, que se compone de la última parte de la URL, la cual corresponde a:

Dominio Corresponde a instituciones del tipo

.com Comercial

.gov Gubernamental

.net Asociadas a Internet

.edu Educativas

.mil Militares

.int Organizaciones internacionales (poco utilizado)

Por otra parte, los Sitios Web también se pueden clasificar por el tipo de información o servicio que proveen:

• PresentaciónInstitucionaloImagenCorporativa• Entretenimiento,OcioyDiversión• ServiciosdeInternet• Noticias• ServiciosEmpresariales,ComercioElectrónicoyNegocios• Educación

En la práctica se pueden llegar a implementar con éxito algunas combinaciones de estos géneros. Es común encontrar sitios orientados a negocios y servicios, también existen sitios de Comercio Electrónico con algunas de las características básicas de un sitio de negocios.

¿Qué sucede con las imágenes y otros añadidos que la Página Web, aparentemente, “contiene”?

Estos son archivos que no están dentro del archivo HTML; están enlazados con un código que indica al navegador qué imagen debe mostrarse, dónde está, sus dimensiones y si es o no un enlace.

¿Cuáles son las características de los sitios de instituciones educativas?

En Internet todo evoluciona más que rápido y las instituciones educativas no pueden ser ajenas a este proceso, es más, deben integrarse y ser partícipes de este cambio y, por cierto, lo han hecho muy bien. Por eso en la red cada día encontramos más sitios no sólo de instituciones educativas en los que se promociona su labor sino sitios más completos

Page 119: Usos Pedagogicos de internet

119Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

que ofrecen cursos de capacitación virtual a nivel profesional, técnico y tecnológico, muestran sus recursos, proyectos educativos y proyección social, en resumen, todo su quehacer educativo tanto presencial como virtual.

Según estudios elaborados en Latinoamérica: “Cada vez es más creciente la publicación de sitios web para instituciones educativas. El mercado del diseño web orientado a este tipo de sitios arroja cada vez mejores ganancias. Y no es sólo un sitio institucional, es toda una infraestructura académica, en la que se habla de páginas web para docentes y para asignaturas. También por medio de una extranet (red de Internet que ofrece servicios externos) se incluye manejo de asistencias y calificaciones, de administración y hasta de cobro matrículas y cuotas”.29

No sólo se atiende educación formal e informal sino educación especializada, como en la página http://needirectorio.cprcieza.net/, que ofrece un amplio directorio de servicios para necesidades específicas:

• Autismo• DiscapacidadAuditiva• DiscapacidadIntelectual• DiscapacidadMotora• DiscapacidadVisual• Otrasdiscapacidades• Diversidad• AltasHabilidades• ProblemasdeComportamiento• Trastornopordéficitdeatenciónehiperactividad• IntervenciónEducativa• Intervenciónlogopédica• AtenciónTemprana• Psicomotricidad• Tecnologíasdeayuda

¿Cuál sería el propósito y estructura de un Sitio Web para una institución educativa?

Dentro de las funciones de los sitios de instituciones educativas y teniendo en cuenta sus propósitos se pueden considerar:

• “Informar:Buscarylocalizarinformación• Publicarydifundirinformación• Facilitarlaobtención/distribucióndemateriales• Posibilitarlacomunicaciónconotraspersonas• Facilitarypromoverelaprendizaje.• Realizargestionesadministrativasycomerciales• Actuarcomomediopublicitario• Entretenerymotivar”30

Un sitio de esta categoría debe representar en forma muy clara la razón de ser de la institución, por lo tanto, debe concebirse como una puerta de acceso al reconocimiento e interacción con la comunidad educativa. Algunas orientaciones para el desarrollo del mismo son:

Incluir aspectos generales, como:

• Misiónyvisióndelainstitución.• Informacióngeneral.• Informaciónsobreelentorno.• Informaciónsobrelasactividades.• Accesoapáginasdeprofesoresyalumnos.• Accesoalabiblioteca-centroderecursoson-line.• Periódicodelcolegio

Generar servicios para alumnos y familias como:

• Consultadelhistorialdelosestudiantes.• Realizacióndegestionesadministrativason-line.

29 http://www.baquia.com/noticias.php?id=7590 30 ibid

Page 120: Usos Pedagogicos de internet

120Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Generar espacios para profesores y gestores del centro educativo:

• Realizacióndetareasdetutoríaygestión.31

• Publicacióndeguíasacadémicas.• Redesdecontactossobrediversostemas

¿Cuáles serían algunos criterios de calidad se pueden definir para sitios institucionales educativos?

Se peden tener en cuenta criterios funcionales, técnico-estéticos y psicológicos:

• Funcionales:eficacia,facilidaddeuso,bidireccionalidad,múltiplesenlaces.

• Técnico-estéticoscomo:o Calidad del entorno audiovisualo Calidad y cantidad de los elementos multimediao Calidad de los contenidos (bases de datos)o Navegacióno Interaccióno Originalidad y tecnología avanzada

• Aspectospsicológicosorientadosaloscibernautasyvisitantesdelsitio como: atractivo, motivante, adecuación a los destinatarios, entre otros”.32

31 http://dewey.uab.es/pmarques/temas2/t10.html 32 Ibid

TALLEREXPLORACIÓN: RECONOCIENDO DISEÑOS

Ingrese a las direcciones sugeridas a continuación. Para cada sitio discuta con sus compañeros:

1. Calidad de la información.2. Cantidad de recursos y servicios3. Posibilidad de interactuar (publicar, participar en chats, foros, e-groups, etc.)4. Analícelas desde el punto de vista funcional, de aspectos técnicos-estéticos y de aspectos

psicológicos.

• http://www.ccb.edu.co/• http://www.colsalle.edu.co/

Page 121: Usos Pedagogicos de internet

121Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Qué consideraciones se deben hacer al momento de definir los visitantes al sitio?

• Perfildeusuariosdocentes/discentes• Principalesaportacioneseducativas• Actividadesquesepiensanrealizar• Capacidaddemotivación• Adecuacióndeestosusuarios• Recursosqueutilizaparabuscaryprocesardatos• Recursosdidácticos• Potenciacióndelaprendizaje• Enfoqueaplicativo/creativodelasactividades• Dificultadesylimitacionesalusarelweb• Otraspáginasdecontenidosimilarocomplementario”33

• http://www.csfr.edu.co/• http://www.colegiodelaensenanza.edu.co/• http://www.geocities.com/colegio_lajoya/• http://www.colegio-bautista.edu.co/col01.htm• http://www.colegiolondres.edu.co/

TALLERSOBRE LA IMPORTANCIA DE SITIOS WEB DE INSTITUCIONES EDUCATIVAS

Reúnase con un grupo de compañeros, respondan y debatan las siguientes preguntas:

1. ¿Cómo podría su institución aprovechar los recursos tecnológicos ofrecidos en Internet como apoyo a la gestión administrativa y académica?

2. ¿Sería importante y productivo para su institución publicar un sitio en Internet? ¿Por qué?3. ¿Qué información de su institución le gustaría que apareciera en la red?4. ¿Qué tipo de visitantes cree que entrarían a su sitio?5. ¿Ha visitado algún portal de una institución educativa? ¿Cómo le pareció?

33 Ibid

Page 122: Usos Pedagogicos de internet

122Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Correo electrónico, chat, foros virtuales, mensajería instantánea

Internet abre espacios para los usuarios que se conectan a la red y forman comunidades virtuales. Estos son lugares para descubrirse, conocerse y acercarse a través de la interacción directa entre nacionales y personas de todos los rincones del planeta en un entorno de respeto mutuo y camaradería.

Pero son también “el medio para construir contenidos digitales de calidad, emprender proyectos reales con impacto significativo en el entorno inmediato de los participantes, así como discutir, plantear y coordinar iniciativas y actividades conjuntas a nivel local o regional. Los espacios más activos de estas comunidades son los Foros Virtuales y la Sala de Chat”34, y se puede incluir el Correo Electrónico (e-mail) como otro espacio de integración de la comunidad virtual, aunque no se realice en tiempo real.

Un ejemplo de comunidad virtual se encuentra en http://www.civila.com, Ciudades Virtuales Latinas; en este sitio se puede participar de foros virtuales y salas de chat con temas de interés para todos.

¿Cómo se puede participar en estos espacios? ¿Cómo funcionan?

Por ejemplo en la comunidad virtual Civila35:

Qué se puede hacer Cómo se puede hacer

• Delagente,depolítica,dedeportes,sobre lo que sea.

• Proponerycoordinaractividadesconjuntas.

• Presentarpropuestasdeacciónvirtualo real.

• Contaralmundoloquemáslegustade su país o compartir algo de su comunidad, barrio, pueblo o ciudad.

• Compartirimágenesyfotosdesuvida o de su comunidad, institución o entorno para que todos las vean.

• Registrándosey participando, publicando directamente en los Foros Virtuales.

• Participandoenlassalas de Chat.

• Enviandolainformación(texto y/o fotos) que se desee publicar con los datos por email

• EnviandoPostalesVirtuales.

34 COMUNIDADES VIRTUALES. http://www.civila.com/comun/comunidadesvirtuales/ 35 Ibid

Page 123: Usos Pedagogicos de internet

123Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Haceramigos.• Expresaropinionesydiscutirlascon

otros.• Comentar,completaryampliarlos

contenidos (información e imágenes) y secciones que se presentan en línea con sus propias palabras e imágenes.

• Proponernuevasseccionesdecontenidos y de interacción.

• Cuestionar,criticar,someteraconsulta y proponer cambios en la forma en que se administra la comunidad o las secciones y espacios de la misma.

¿Qué es y cómo funciona el correo electrónico?

Si antes se debía esperar días para recibir una carta del extranjero, hoy nos basta con unos minutos o incluso segundos gracias al correo electrónico. Este servicio permite enviar mensajes de forma muy fácil y sencilla entre personas o grupos alrededor de todo el mundo en un tiempo récord.

El correo electrónico, es pues, una aplicación mediante la cual un computador puede intercambiar mensajes con otros usuarios de computadores (o grupos de usuarios) a través de la red. El correo electrónico es uno de los usos más populares de Internet. En principio, sólo es texto y de carácter privado. Pero a los mensajes se les puede vincular archivos de cualquier tipo y enviarlos juntos. El emisor de un correo electrónico manda los mensajes a un servidor y éste, a su vez, se encarga de enviárselos al servidor del receptor. Para poder ver el correo electrónico es necesario que el receptor se conecte con su servidor. Para poder enviar o recibir correo en Internet se necesita un buzón o dirección electrónica. También se identifica como correo electrónico a los mensajes enviados a través de este medio.36

Los mensajes de correo electrónico tienen la estructura formal de los documentos escritos e incluso se puede hablar del sobre y del contenido.

36 CHAT. http://definicion.org

Page 124: Usos Pedagogicos de internet

124Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

El sobre contiene toda la información necesaria para transportar el mensaje, tal como la dirección, la prioridad del mensaje, el nivel de seguridad y todo lo que es distinto del contenido mismo del mensaje. Los sobres se construyen automáticamente a partir de la información que escribe el usuario al crear un mensaje y es la parte que leen los servidores de correo electrónico pasa hacer llegar el mensaje a su destino.37

La información del sobre está dada en el encabezamiento del mensaje, donde se especifíca:

• “elremitente(de:),• eldestinatario(a:opara:),• eldíayhoraalqueseenvió(fecha:),• ydequétrata(tema:oasunto:),

Esta información aparece en líneas separadas y precedidas por las palabras que aparecen entre paréntesis, o similares, y alguna otra información adicional que variará según las particularidades del mensaje, como pueda ser que se ha mandado copia a otro usuario (Cc:), el llamado Carbon copy.(Con copia)

Generalmente sólo hay que explicitar el para: (destinatario) y el asunto: (tema que trata), encargándose el sistema de anotar el remitente y la fecha. Cuando se genera una respuesta automática, la aplicación de correo electrónico generará todo el encabezado, a excepción de los campos adicionales que se quieran añadir.

A continuación va el cuerpo (body) o contenido del mensaje, que suele terminar con el nombre del remitente a modo de firma y puede contener, algunos

de los signos que se van extendiendo como expresiones de emoción (emoticons).38

El contenido del mensaje se puede escribir directamente en el programa de software utilizado para su composición, el “cliente de correo electrónico”39. El cuerpo del mensaje y según los casos también puede incluir archivos adjuntos y códigos de prioridad y urgencia. Los archivos adjuntos, mensajes de voz o elementos multimedia adicionales, son creados por programas externos e insertados en el mensaje antes de su envío.

Las direcciones de los destinatarios normalmente se encuentran en una base de datos de “contactos” desde la cual se seleccionan y que, según los programas “cliente de correo electrónico”, se denomina libreta de direcciones, libro de direcciones o similares.40

El correo puede ser enviado tanto a individuos en lo particular como a listas de distribución. Una lista de distribución puede ser administrada usando software especializado (e-reflector). Algunas listas de correo permiten subscribirse con tan sólo enviar una solicitud a su administrador. Una lista de correo que se administra automáticamente se le nombra servidor de listas (list server).

¿Cómo identifico el destinatario del mensaje?

El destinatario del mensaje de correo electrónico tiene un buzón suministrado por un servidor de servicios de internet (ISP) y se identifica con una dirección electrónica. A diferencia de la dirección de una casa, que está asignada y no se puede cambiar, las direcciones de correo electrónico se pueden elegir, al menos el nombre.

37 COMO FUNCIONA EL CORREO ELECTRÓNICO http://www.uib.es/c-calculo/manuals/correu/castella/Introduc.htm 38 CORREO ELECTRÓNICO. ESTRUCTURA DE LOS MENSAJES http://www.spain-lions.net/internet/correo/correo2.html 39 ELEMENTOS DE UN MENSAJE. http://webmastercristiano.com/pagina/27/80/55 40 Ibíd.

Page 125: Usos Pedagogicos de internet

125Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Esta dirección es un conjunto de caracteres utilizado para identificar a un usuario de correo electrónico y poder enviarle mensajes a través de este medio. Está compuesto por el nombre del usuario, un signo “@” y los dominios adecuados.41

Para explicar gráficamente el funcionamiento del correo electrónico podemos observar la siguiente figura.

En el sistema global de mensajería, formado incluso por equipos donde operan aplicaciones distintas, los programas cooperan para transferir el mensaje (que es un archivo especial) desde el computador del remitente o emisor hasta el computador del destinatario o receptor, a veces pasando por sistemas intermedios que almacenan y reenvían los mensajes en función de sus direcciones y de las atribuciones de cada uno de ellos en el esquema general.

41 DIRECCIONES EMAIL. http://definicion.org

OFICINA DE CORREO ELECTRÓNICO

Buzón 1 Buzón 2

RESTO DE INTERNET

Protocolo de comunicación

COMO FUNCIONA EL CORREO ELECTRÓNICO

Protocolo

TCP/IPServidor de Correo

Usuario EmisorAna León

[email protected]

Protocolo

TCP/IP

Usuario ReceptorLina Roa

[email protected]

Page 126: Usos Pedagogicos de internet

126Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Simplificándolo al máximo, cuando un usuario envía un mensaje el software que lo atiende se pone en contacto con el computador del receptor, utilizando la dirección de correo electrónico, y le transfiere una copia del mensaje (mediante el protocolo normalizado que controla la transferencia de archivos en Internet, el TCP) que es almacenada en el buzón del receptor, a la vez que éste es avisado. Para asegurar la calidad del envío el computador emisor guarda una copia completa del mensaje durante la transferencia.

Según este esquema una máquina desconectada no puede recibir mensajes, por ello el sistema se complica un poco más y los equipos servidores de correo electrónico suelen ser sistemas permanentemente activos a los que los usuarios (locales o remotos) se conectan periódicamente para recibir su correspondencia y que mientras tanto la almacenan para ellos de forma similar a como actúan los apartados de correo.42

¿Qué es y cómo funciona el chat?

La palabra chat, o discusión, describe la comunicación en línea llevada a cabo por los usuarios en tiempo real. Las personas escriben los mensajes en sus teclados y éstos aparecen en la pantalla de todos los participantes. Los chats se dan entre dos o más personas.43

“Chat es una palabra en ingles cuya traducción significa conversar, pero a esta altura se ha convertido en un término específico para designar el encuentro entre dos o más personas en Internet que mantienen una conversación en tiempo real. Para chatear basta con tener un computador, con conexión a Internet, elegir un apodo o nick e ingresar en alguna sala”.44

Al chat se lo conoce también como IRC (Internet Relay Chat) por las normas técnicas que regulan su uso.

Contra lo que muchos suelen creer, el chat no es una característica más de internet sino que es un servicio. La diferencia es que internet es la red pura y exclusivamente la red física de computadoras conectadas, mientras que el chat, la web y el correo electrónico son servicios montados sobre esa red.

Un chat es como una sala de reuniones donde quien entra se encuentra con un montón de gente con la que puede compartir texto, voz, vídeo o programas desde un ordenador (estas opciones dependen directamente del tipo de Chat).

El funcionamiento del Webchat es sencillo. Basta con entrar a un sitio, dirigirse a la zona dedicada al chat, elegir una sala y un nick e ingresar.

El tablero de operaciones del sitio es fácil de maniobrar. Lo básico del sistema son tres ventanas: La primera, y la más grande, muestra a los diálogos de los usuarios; la segunda, la lista de personas conectadas (ubicada generalmente a la derecha) y la tercera es un pequeño espacio donde se debe escribir lo que se quiera decir al resto de las personas que ingresaron a ese Webchat.

El chat funciona del mismo modo que la mayoría de los servicios en internet, ya sea la web o el correo electrónico. Este esquema se conoce con el nombre Cliente/Servidor.

Cada uno de los integrantes de una sala se conecta mediante un programa que recibe el nombre de “cliente”. Todos los clientes, a su vez se conectan a un servidor que muestra toda la información de los otros conectados.

42 CORREO ELECTRÓNICO. FUNCIONAMIENTO DEL SISTEMA http://www.spain-lions.net/internet/correo/correo2.html 43 http://definicion.org/chat 44 CHAT. http://escuelamedia2.galeon.com/aficiones852938.html

Page 127: Usos Pedagogicos de internet

127Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Se debe esperar unos segundos mientras se carga el chat. Una vez abierto se escribe, en el recuadro provisto para ello, el Nick (un sobrenombre, o puedes poner tu nombre real, ojalá una sola palabra).

¿Qué es y cómo funciona un foro virtual?

El foro de discusión es un ambiente que facilita enormemente la comunicación entre un grupo de personas que desean “comentar” acerca de un tema en especial.Podemos definirlo como un diario mural, donde podemos publicar nuestras inquietudes, consejos, comentarios, etc, los cuales estarán disponibles a toda hora y en todo momento para aquellas personas que estén participando o tengan acceso a dicho foro.Sin duda es un buen medio para establecer una estrecha relación interactiva con personas que desean expresarse acerca de un tema definido. Básicamente en un foro esta conformado, por:• Tema:Quecatalogalasdiferentesdiscusiones.Ej,Música,Cine,

Tecnología, Consultas, etc.• Conversación:Pregunta,aseveraciónofrasequedainicioaldesarrollo

del foro.• Autor:Lapersonaqueiniciolaconversación.• Respuestas:Todosloscontenidosqueintegranalaconversaciónlos

diferentes usuarios o participantes.45

45 FOROS DE DISCUSIÓN http://www.utem.cl/web/foros.htm

Page 128: Usos Pedagogicos de internet

128Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Un ejemplo de un foro puede ser la página que se muestra a continuación:

Los foros virtuales son otro espacio creado en la red y que responde a necesidades específicas de los cibernautas. Son espacios con un estilo más profesional y académico, ya que se reúnen personas en torno a un tema para debatir, aportar y llegar a conclusiones que enriquecen su actuar académico, personal y profesional.

Lo anterior no es cierto, en el estricto sentido de la palabra, pues también existen sitios de foros virtuales con temas más generales en los que puede participar cualquier cibernauta.

Para participar en un foro se hace necesario visitar el sitio que ofrece el servicio, registrarse, consultar los foros activos y participar. Con los datos del registro y a través del correo electrónico se puede establecer una comunicación más cercana con personas interesadas en un determinado tema.

“Los foros virtuales son cada vez más populares entre el profesorado universitario aunque su utilización puede ser muy variada: como elemento de debate, apoyo al proceso de aprendizaje, intercambio informativo, etc.

Page 129: Usos Pedagogicos de internet

129Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Los entornos virtuales de aprendizaje ofrecen una serie de posibilidades para procesos de colaboración donde los alumnos producen conocimiento de forma activa formulando ideas por escrito que son compartidas y construidas a partir de las reacciones y respuestas de los demás”.46

“Los foros electrónicos constituyen un espacio apto para la promoción de comportamientos colaborativos entre los estudiantes, bajo una modalidad asíncrona que permite que cada participante reconozca las aportaciones de los demás, reflexione sobre ellas y construya sus aportaciones según su propio ritmo de aprendizaje. En este proceso interactivo se produce la construcción situada del conocimiento por parte de cada estudiante como resultado de ese proceso dialógico social, en el cual el grupo negocia conjuntamente el significado de los contenidos que se discuten en el foro.”47

Un ejemplo de un sitio de foros colombiano puede ser:http://athenea.umanizales.edu.co/modules.php

Cuya página muestra lo siguiente:

46 ESTUDIO SOBRE LOS FOROS VIRTUALES http://www3.usal.es/~teoriaeducacion/rev_numero_05/n5_art_gros_adrian.htm 47 BARBERÁ, E., BADIA, J. y MOMINÓ, J. (2001). La Incógnita de la Educación a Distancia. Barcelona: ICE Universidad de Barcelona FOROS ELECTRÓNICOS http://www3.usal.es/~teoriaeducacion/rev_numero_05/n5_art_gros_adrian.htm

Page 130: Usos Pedagogicos de internet

130Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Existen otros sitios de foro virtual de una institución en especial o como servicio general de un sito, lo importante es que se puede participar activamente en la construcción de conciencia social, conocimiento o simplemente participar.

¿Qué es y cómo funciona la mensajería instantánea?

La mensajería instantánea es la posibilidad de cambiar mensajes en tiempo real con otras personas a través de Internet. Para enviar y recibir mensajes instantáneos se necesita una conexión a Internet y un programa de mensajería instantánea.48

La mensajería instantánea es un punto intermedio entre los sistemas de chat y los mensajes de correo electrónico. Las herramientas de mensajería instantánea son programas regularmente gratuitos y versátiles, residen en el escritorio y, mientras hay una conexión a Internet, siempre están activos.

La aplicación es sumamente sencilla de utilizar, combina los beneficios del chat y del correo electrónico, anexar archivos, fotografías, juegos en línea, entre otras aplicaciones, toda esta funcionalidad lo hace muy atractivo para la gente.

El programa permite crear una lista de amigos que también lo usan. Una vez que se hayan añadido amigos a una lista, se puede ver en cada momento cuáles están conectados o no; y así se podrá iniciar una charla fácil y rápidamente con aquellos amigos que estén disponibles.

La mayoría de las charlas consiste en mensajes de texto, pero algunos servicios de mensajería también permiten usar un micrófono y una webcam para que se pueda hablar y ver y ser visto en directo. Además, se pueden enviar y recibir archivos directamente desde el programa.

El servicio de mensajería instantánea ofrece una ventana donde se escribe el mensaje, en texto plano o acompañado de iconos o “emoticons” (figura que representa estados de ánimo), y se envían a uno o varios destinatarios quienes reciben los mensajes en tiempo real, el receptor lo lee y puede contestar en el acto.

A las últimas versiones se les han añadido una serie de aplicaciones extra como la posibilidad de entablar conversaciones telefónicas, utilizando la infraestructura de Internet, lo mismo que contar con sistemas de información financiera en tiempo real y el compartir diferentes tipos de archivos y programas, incluidos juegos en línea.49

La popularidad de este servicio ha crecido en forma arrasadora. En los últimos años el número de usuarios de cualquiera de los principales servicios: Instant Messenger de AOL, MSN Messenger de Microsoft, Yahoo! Messenger e ICQ, se ha incrementado en forma sustancial alcanzando casi el número total de usuarios de Internet; se calcula que a diario corren más de 300 millones de mensajes instantáneos, lo que significa que sus más de 100 millones de usuarios del servicio envían al menos tres mensajes al día a través de este recurso.

Independientemente de si ayudan a incrementar la productividad o deteriorarla, los sistemas de mensajería instantánea son una herramienta de trabajo y una forma de comunicación personal hoy imprescindible para muchas personas y empresas que verían afectadas sus actividades si carecieran de ellos.

En una sociedad tan demandante este tipo de herramientas es un recurso que no pasa desapercibido sobre todo para jóvenes y adolescentes que están creciendo en este ambiente y para quienes es más conciso y práctico oprimir dos o tres teclas para estar en contacto con otras personas.

48 YAHOO MESSENGER. http://xxx.yahoo.com 49 MENSAJERÍA INSTANTÁNEA. http://www.x-extrainternet.com/messengers.asp

Page 131: Usos Pedagogicos de internet

131Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

La mensajería instantánea permite intercambiar mensajes de texto entre usuarios que previamente han aceptado comunicarse entre sí de esta manera. El procedimiento varía de un sistema a otro pero, en general, funciona así:

1. Un usuario se conecta a un servidor, en el cual está almacenada su lista de contactos y se establece su estado: disponible, ocupado, ausente, etc.

2. El servidor le envía su lista de contactos y el estado de cada uno de ellos.

3. El servidor, automáticamente, informa de la presencia de este usuario a todos los usuarios de su lista de contactos que estén conectados en ese momento.

4. A partir de este momento si un usuario quiere comunicarse con alguno de sus contactos no tiene más que seleccionar el usuario deseado.

5. Para dar de alta un contacto en la lista de contactos hace falta saber su dirección o alias y que el contacto autorice la inclusión.

6. Cuando el usuario cierra su programa de mensajería instantánea el programa informa al servidor de la desconexión y éste, a su turno, notifica a todos los contactos.

Page 132: Usos Pedagogicos de internet

132Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Diseño de páginas Web

Para el diseño de sitios web se pueden aplicar las normas para el diseño de libros, textos y revistas; sin embargo, antes que la técnica es importante aplicar el sentido común, el manejo de la estética y el buen gusto.

Para diseñar un sitio Web no sólo debe tenerse en cuenta la estética sino que es necesario hacerlo con un propósito claro y con un perfil de usuario definido. También hay que tener en cuenta las restricciones técnicas, el planteamiento de un contenido organizado, la buena distribución de la información y la construcción de vínculos para la exploración del sitio.

Es necesario tener en cuenta, entre otros, los siguientes criterios para crear una página50:

• Tenerclaroquésequierehacer.• Hacerun“boceto”alápizdelapáginaquese

quiere.• Obtener un espacio para laWeb en algún

“Servidor”.• Crearuna“carpeta”eneldiscoduroparaguardar

los archivos de la nueva página Web.• “Obtener”unprogramadediseñoweb.(por

ejemplo Dreamweaver).• “Instalar”elprogramadediseñoy“configurar”el

sitio en él.• “Crear”unapáginawebbastantesimplepara

comprobar el espacio web.• Comenzareldiseñodelaweb.• ActualizarlapáginaWeb.• Mejorarlapáginaañadiendoforos,librodevisitas,

etc.• Promocionarlapáginaconbuscadores,etc..• AmpliarlosconocimientosdeHTML,EstilosCSS,

etc.

Existe una filosofía de diseño practicada a nivel europeo y norteamericano conocida como Diseño para Todos (Design for All).

“Según esta filosofía los equipos y servicios deben ser diseñados para satisfacer las necesidades de todos los usuarios; tanto el usuario medio como usuarios con distintos perfiles funcionales deben ser capaces de usar el producto en la medida de lo posible y con el máximo de prestaciones, sin necesidad de adaptación o diseño especializado adicional.

Según el Trace Center (Connell BR et al.;1995) los 7 principios que debe cumplir un diseño para ser un verdadero diseño para todos son los siguientes:

1. El diseño debe ser igualmente utilizable por cualquier tipo de usuario.

2. El diseño debe tener la suficiente flexibilidad para acomodar el mayor rango de preferencias o capacidades individuales.

3. Debe ser simple e intuitivo, fácil de comprender independientemente de la experiencia, conocimientos, idioma o nivel de concentración del usuario,

4. El diseño proporciona la información necesaria para su uso al usuario independientemente de las condiciones ambientales y sus capacidades sensoriales.

5. El diseño es resistente a los errores. Minimiza los riesgos y las consecuencias adversas de los errores accidentales e inintencionados.

6. Bajo esfuerzo físico. El diseño puede ser usado eficientemente y confortablemente con un mínimo de fatiga.

7. Ergonomía. El entorno proporciona un espacio y condiciones adecuados para su uso con independencia del tamaño corporal, postura y movilidad del usuario.

Estos son los criterios que definen un diseño utilizable por todos. Por supuesto que otros aspectos como

50 PASOS A SEGUIR PARA CREAR UNA PÁGINA. www.informaticamilenium.com.mx/ paginas

Page 133: Usos Pedagogicos de internet

133Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

la estética, el costo, la seguridad o el respeto a la diversidad deben ser tenidos también en cuenta en el proceso de diseño.

Por tanto, el esfuerzo en facilitar la accesibilidad a las páginas web redundará en beneficio de todos los usuarios y, finalmente, en una mejor aceptación del sitio web a todos los niveles y por todos los grupos de usuarios.”51

Por otro lado, teniendo en cuenta los aspectos tecnológicos deben considerarse algunas características de la web que enmarcan y orientan el diseño:

• Lawebesunmedioefímero.Laspáginasnuncaestánterminadas. Cambian continuamente: se actualiza la información, se rediseña la presentación...

• Todoelmundonopercibeiguallaweb.Existenmuchas plataformas y navegadores distintos, con diferentes enfoques: por ejemplo, Internet Explorer es un navegador gráfico de sobremesa, mientras que Lynux es un navegador que funciona en modo texto e ignora los gráficos. También existen navegadores en los teléfonos móviles y PDAs, y los lectores de pantalla que leen el contenido de las páginas en voz alta. Como vemos, cada sistema operativo tiene sus peculiaridades haciendo que las posibilidades sean casi infinitas.

• Lawebofreceunaccesoinmediatoalainformación.La web evita trámites físicos como buscar en libros o desplazarse a diversas fuentes de información, ya que las contiene a prácticamente todas! También se agiliza el acceso a la información gracias a los hiperenlaces, ya que, como sabemos, los documentos html no son entidades aisladas sino que forman un tejido, relacionándose entre ellos.

• Lawebtieneposibilidadesmultimedia.A lainformación textual puede añadírsele vídeo, gráficos, interactividad, sonido...

• La web responde de forma dinámica a lasacciones del visitante. El usuario espera ciertos comportamientos de las páginas web, como que los iconos de enlaces hagan algo (se muevan, cambien de color o tamaño, etc.) cuando se pase el puntero del ratón por encima. Esto no sólo ayuda a navegar más cómodamente sino también es un recurso llamativo que capta fácilmente la atención del usuario.

• LawebNOpermitealdiseñadoruncontrolabsoluto de la experiencia visual. Esto puede ser lo más frustrante al principio si se está acostumbrado al diseño impreso, pero hay que adaptarse y aceptarlo. Un buen diseñador acepta los límites que le impongan y trabaja ciñéndose a ellos.

El proceso de diseño no se analiza como una interrelación usuario-tecnología, sino como interacción humana mediatizada por la tecnología. Esto implica que la Web deba ser entendida como medio de comunicación entre personas, lo cual debe ayudar a pensar permanentemente en “el otro”, en “la persona invisible” y desconocida para quien se hace la página Web.

¿Cuáles son las etapas para el diseño de un sitio Web?

El desarrollo de un proyecto de sitio Web puede dividirse en tres etapas principales3:

• Prediseño.• Diseño.• Instalaciónyprueba.

51 CONSTRUCCIÓN DE PÁGINAS WEB. http://www.monografias.com/trabajos5/laweb/laweb.shtml#II

Page 134: Usos Pedagogicos de internet

134Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Prediseño

La etapa de prediseño o conceptualización se puede dividir en cinco componentes que son: objetivos, público, contenidos, estructura y visualización. Éstos interactúan entre sí y se condicionan mutuamente. •Objetivos

Este es uno de los elementos más importantes que determina a los otros. Deben responder a las preguntas: ¿para qué se pública este sitio?; ¿qué quiero que suceda a raíz de mi publicación en la Web?

En la elaboración del objetivo (si existe más de uno, hay que listarlos a todos y jerarquizar) conviene que participen todas las personas que están involucradas en el proyecto.

•Público

Al hablar de público no se hace referencia a cualquier persona que recorriendo la red llegue al sitio por casualidad, sino a aquella parte de la población a la que está dirigido el mensaje. Por lo tanto, la selección del público está estrechamente vinculada con los objetivos establecidos y la naturaleza del sitio que se propone.

Se necesita construir un identikit (sistema para identificar y definir perfiles físicos) del público que tenga en cuenta, como usuarios de Internet, sus intereses, inclinaciones, gustos, preferencias, etc., Se tiene que dar una respuesta lo más concreta y específica posible a la pregunta “ ¿qué busca nuestro público de la página?”. Por qué la Web debería dar respuesta a esa pregunta.

Todo lo que se sepa y suponga sobre el público-directo (el que interesa) servirá, además, para establecer parte de los criterios de diseño de contenidos, lenguajes y estética.

•Contenidos

Se debe listar la información que se desea incluir en la Web. Esta información debe ser significativa, y útil para el público. Teniendo en cuenta lo que a ellos les interesa no lo que al diseñador le interese.

En el caso de que existan otras formas de acceso a información disponible para esas mismas personas, el contenido de la Web deberá superar a esos otros materiales; por ejemplo, ofrecer más que los folletos, las revistas u otros tipos de fuentes.

El lenguaje utilizado para brindar la información en Internet debe ser sobrio, conciso, concreto. No funciona bien el lenguaje insinuante y ambiguo que puede ser perfecto para avisos gráficos o folletos.

Todo lo que se hace contribuye a formar la imagen que tiene el público de la empresa, marca, producto, institución o servicio. La Web no es una excepción y cualquier sentimiento de frustración que experimente el usuario no se canalizará hacia él o los autores del sitio Web sino hacia la imagen de la empresa.

•Estructura

La organización de la información es un tema clave para asegurar un buen funcionamiento de un sitio.

El primer elemento organizador son las páginas. Conviene incluir en cada una de ellas una unidad de información autónoma, completa. En el caso de que el volumen sea excesivo para ello, dividir esa unidad de información en subunidades más pequeñas, coherentes y completas cada una en sí misma. Una unidad de información es un tema o un subtema.

Las relaciones de las páginas entre sí configuran la estructura del sitio. A partir de la página principal o home page se vinculan, mediante enlaces, el resto de las páginas. Esto es bastante sencillo de implementar en lenguaje HTML, lo verdaderamente complicado es decidir de qué manera, en qué orden y con qué configuración se establecerá la cadena de vínculos.

Page 135: Usos Pedagogicos de internet

135Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Ante todo hay que tener en cuenta que la estructura debe responder a los criterios de búsqueda. Hay que hacerse la pregunta acerca de ¿cómo se intentará encontrar esta información? Ya que los criterios “naturales” de clasificación pueden no ser adecuados.

Otro aspecto importante a tener en cuenta es que los usuarios reconocen las páginas de la Web utilizando como guía palabras clave colocadas en botones, barras de control, gráficos mapeados o utilizadas como marcas de hipertexto; palabras que por su significado indican o sugieren el contenido de páginas a las que derivan. Es sabido que los significados de las palabras y las imágenes no son unívocos y la ambigüedad puede ser un problema. El conocimiento de la cultura y usos lingüísticos del público serán sin duda, de gran utilidad a la hora de elegir las palabras que titularán los botones o identificarán los enlaces de derivación a otras páginas del sitio. Ejemplo:

Aquí la imagen y el texto se soportan mutuamente, de modo que el usuario se haga una idea más precisa de lo que encontrará al acceder a ese hipervínculo.

Hay que tener en cuenta que el usuario no tiene cómo saber la manera en que sigue la cadena de enlaces más allá de las páginas a las que puede entrar directamente desde el lugar donde se encuentra. Así, si después de recorrer cuatro o cinco páginas encadenadas no encuentra la información deseada el usuario tendrá una sensación de frustración que lo llevará a abandonar el sitio.

Un tema relacionado a éste es el de los mecanismos de identificación y de recorrido del sitio. Estos permitirán al usuario saber en todo momento el lugar o zona del sitio donde se encuentra, así como desplazarse hacia cualquier otra página sin necesidad de recorrer toda la cadena en sentido inverso. En este sentido los paneles de control son una buena ayuda.

•Visualización

La gráfica (incluida elementos multimedia) de un sitio Web debe ser una herramienta de comunicación al servicio de los objetivos planteados y condicionados por las pautas culturales (preferencias, gustos) del público. Esto significa que no es un espacio de lucimiento del diseñador, ni de la estética.

Debe adecuarse a los gustos y preferencias de los responsables del sitio pero, una vez más, los objetivos trazados y el perfil del público deberían ser los instrumentos para tomar las decisiones de diseño gráfico y multimedia. Además de los criterios estéticos y de comunicación del diseño gráfico es importante respetar los criterios técnicos específicos:

1. Cada página debe ser fácil de cargar.2. Las páginas deben ser fáciles de leer.3. Se deben establecer guías visuales que permitan

saber que cada página pertenece al mismo sitio.

La coherencia visual ayuda en ese sentido. Un sitio en el que cada página tiene un fondo diferente, varían los iconos y cambian otros componentes de la composición visual, desconcierta al usuario por que no sabe si está en el mismo sitio o si el último enlace lo llevó al otro extremo del mundo. Esto no es otra cosa que la creación y la permanencia de un estilo.

Diseño

Hablar sobre el diseño de páginas Web, realmente es referirse al HTML o HyperText Markup Language. El lenguaje HTML consiste en una serie de comandos u órdenes que le indican al programa navegador de WWW cómo darle formato al texto que contiene los

1

DIVERSIDAD DE ORQUÍDEAS

Page 136: Usos Pedagogicos de internet

136Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

archivos. En la actualidad no hace falta ser un experto en HTML debido a que los procesadores de texto existentes se encargan de hacer el trabajo agregando el código automáticamente a lo que se quiere mostrar.

Los servicios de diseño de páginas Web cubren un rango que va desde convertir archivos de texto a formato HTML hasta desarrollar extensos conjuntos de páginas cargadas de ilustraciones e hipervínculos relacionados entre sí. Podría dársele un enfoque especial a su página para algún programa navegador específico, pero siempre debe asegurarse de que las páginas sean vistas por el mayor número de plataformas posibles.

La tarea de diseño de páginas Web convoca por lo menos tres especialidades diferentes: comunicación (humana), programación (HTML, CGI, Java), diseño gráfico y multimedia. Ninguna de estas especialidades tiene en sí misma todos los recursos para llevar a cabo proyectos de web exitosos.

En los proyectos de sitios web no participan sólo los especialistas contratados o designados para ello. La empresa o institución que origina la demanda tiene diversos grados de responsabilidad y compromiso con la publicación del sitio.

Instalación y Pruebas

Esta es la etapa de ejecución, de hacer correcciones y ajustes finales. Debe hacerse lo necesario para que todo funcione. Realizar la prueba de todos los enlaces, corroborar el correcto funcionamiento de todos los elementos de multimedia y del funcionamiento de formularios, e-mail, buscadores, etc. La transferencia de archivos a la web se realiza a través de FTP (File Transfer Protocol) generalmente; se necesita un nombre de usuario y una clave de acceso.

Nociones generales de diseño en la web

A continuación se reúnen algunas ideas generales para tener muy en cuenta antes, durante y después del diseño de una web:

• Lawebdebetenerunosobjetivosclaros,sinimportarsi son educativos, comerciales, publicitarios, etc.

• Elusuariohadesaber,engeneral,quéencontrarádesde el principio.

• Lanavegaciónatravésdelawebhadeserfácil,intuitiva y consistente. El navegante debe saber dónde se encuentra en cada momento. Para ello se han de proporcionar, al mismo tiempo, pistas para informar el lugar específico en que se halla, con una cierta variedad dentro de la homogeneidad del conjunto

• Lainterfazhadeserlomásuniformeposibleatravés de la web: un mismo sistema de colores, uso de tipografía, colocación de los elementos de navegación... (estilo)

• Actualizarlainformaciónyeliminarpartescaducas.La información más actual o las secciones nuevas se han de poder localizar rápidamente.

• Losnuevosefectos,aúnnosoportadosportodoslos navegadores y sistemas, y otros trucos no han de constituir el núcleo del sitio web, en especial si se trata de elementos no estándar dentro del HTML.

• Convieneutilizarelcolorconmoderación,deforma consistente y razonable. Hay que tener especial cuidado con los colores elegidos para que el texto sea fácilmente legible.

• Eltextohadeserconciso,bienestructuradoy fácil de leer. La lectura en pantalla no es tan agradable como en el papel. (Puede ser una buena

Page 137: Usos Pedagogicos de internet

137Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

idea proporcionar también una versión más extensa o especialmente preparada para imprimir).

• Manejarlatipografíaconatención;nomezclarmuchostiposdeletraytamaños en cada página. La información esencial ha de estar presente en forma de texto editable no en forma de gráficos.

• Tenerencuentaeltamañoyformatodelasimágenes.Utilizarlasdeforma pertinente no como simple ornamentación.

• Lasimágenesdefondopuedenservistosaseinteresantesydaruntoque distintivo, pero debe evitarse dificultar la lectura del texto o interferir con el resto del diseño.

• Diseñarlaspáginaspensandoentodoslosusuarios,nosóloaquellosque tienen los mejores monitores, computadores y programas. Debe evaluarse el diseño a diferentes resoluciones y verificar su validez.

• Utilizarlasanimacionesconprudencia;puedenllegarasermolestasypoco agradables, de modo que sólo deberán emplearse por un motivo justificado.

¿Cuánto tiempo toma crear un Sitio Web?

Es difícil dar a conocer un tiempo promedio para la creación de un Sitio Web. Los factores que influyen en el tiempo que tomará el proyecto son entre otros:

• Elniveldedefiniciónquesetengadelplandenegocios• Lasestrategias,elalcanceycomplejidaddelSitioWeb• Ladocumentaciónescritaquesetengayadisponible• Lasimágenesydocumentosaserpublicados• Ladescripcióndeproductosyservicios• Latraducciónescritaaotrosidiomasencasodesernecesario• Sucomunicacióninternaentreáreasqueparticiparánenelproyecto• Elniveldeculturainformáticadentrodelaempresa.

Se considera un sitio web sencillo aquél que puede tomar un tiempo de desarrollo de dos a cuatro semanas, un sitio de mediana complejidad fluctúa entre cinco y doce semanas para su creación, y las aplicaciones más complejas rebasan las trece semanas.

Page 138: Usos Pedagogicos de internet

138Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Losmarcosoframes,sonunafuentedeproblemasparaelmantenimientoe indexación de una web y confunden a muchos navegantes. Es preferible evitarlos y utilizar barras de navegación laterales y/o arriba y abajo de la página.

• Evitarlostópicosyciertasindicacioneshabitualesenlosprimerosañosde la WWW, como “En construcción” “Necesitas esta configuración... para ver esta página”; que tal un programa de televisión que en lugar de emitirse mostrara “En construcción”, o “Necesitas un televisor marca tal y cual, con tal sistema de sonido...”. Tampoco es necesario exhibir contadores —en especial si dan valores muy bajos—, condecoraciones y demás.

ENSEÑANZAS EXPRESIVAS

¿Cómo construir la estructura del sitio?

Típicamente, y desde el punto de vista del diseño, una web tiene una página de inicio con un índice; de ésta dependen una serie de páginas de sección que permiten a su vez acceder a las diferentes páginas de contenido: artículos, páginas de catálogo, listas, fichas de productos, formularios...

ESTRUCTURA DE UN SITIO WEB

PÁGINA DE INICIO

Página de Sección 1 Página de Sección 2 Página de Sección 3

Página de Sección 2 Página de Sección 2 Página de Sección 2 Página de Sección 2

Page 139: Usos Pedagogicos de internet

139Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Este esquema esencial puede complicarse más o meno, por ejemplo, introduciendo diferentes subsecciones y profundizando así en la estructura. En general no es buena idea crear un esquema de navegación muy ramificado porque confunde a muchos visitantes. Para Webs muy extensas es preferible una portada sin demasiado detalle porque también puede despistar; es preferible enlazar con las principales secciones y desde éstas, ir detallando la estructura.

Los criterios para diseñar las páginas correspondientes a cada nivel son distintos, respecto de la organización del espacio, el uso del color e imagen y la elección de la tipografía.

En general, se puede considerar que a cada uno de los tres niveles (portada/secciones/artículos) las restricciones se pueden aplicar son las que se detallan en el gráfico siguiente:

En este gráfico se representa la relación entre las variables: espacio disponible en la pantalla, uso del color y libertad en la disposición de los elementos, contenido, grado de detalle en los enlaces; con cada una de las partes que pueden conformar un sitio Web, como portada, páginas de secciones y subsecciones y páginas de contenidos (artículos).

Se puede deducir que para la portada :

• Elespacioenlapantalladebeserlimitado• Elusodelcolorysudisposicióndeloselementoseslibre

Page 140: Usos Pedagogicos de internet

140Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Elcontenidodebesermásvisualycongráficos• Elgradodedetalleenlosenlacesdebesermásgeneral.

Naturalmente, debe haber una cierta coherencia y lógica en el estilo gráfico y tipográfico de los tres niveles: no ha de parecer que, más que niveles distintos, sean webs distintas.

Si se opta por un estilo gráfico éste se debe basar en:

• fotografías,• imágenesrealistas,• imágenessimplesencoloroblancoynegro,• imágenesestilocómicocaricatura,• iconossimples(símbolos,signosyseñales),• unacombinaciónaceptabledemásdeunadeestasopciones,pero

teniendo cuidado con las mezclas indigestas. Por ejemplo, en una web de diseño sobrio, funcionan bien imágenes icónicas simples pero desentona mucho las imágenes caricaturescas.

TALLER

1. Visite el sitio www.bogota.gov.co y observe la estructura; fíjese en el índice de la página principal y los enlaces correspondientes.

En la parte izquierda verá un menú que le ofrece posibilidades de acceso muy generales tales como:

• Bogotáportemas• Cifras• Galeríafotográfica

Seguramente estos tres títulos le digan algo aunque no sean muy específicos, de modo que si tiene pensada una búsqueda en particular ya sabe que ruta tomar. Por ejemplo, si desea información sobre educación en Bogotá, de acuerdo con el índice el enlace correcto debe ser Bogotá por temas. Como se dará cuenta en la página de Bogotá por temas aparece un listado de los contenidos, dentro del cual se halla el enlace de educación.

Este es un claro ejemplo de una estructura organizada que facilita la ruta de búsquedas específicas.

2. Ahora usted busque algunos sitios en los que se cumpla dicha forma de estructurar los contenidos. Sugerimos que primero establezca un tema muy general, luego a través de un buscador identifique la dirección de un sitio, (por ejemplo www.discoveryespanol.com) y posteriormente establezca un tema más específico de búsqueda. Analice la estructura de las páginas seleccionadas.

Page 141: Usos Pedagogicos de internet

141Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Cómo organizar la información?

Existe un problema en el momento de diseñar y es la separación del contenido y la presentación, es decir, qué se quiere mostrar en el sitio y cómo se quiere hacer.

Separar la esencia del documento, que es la información textual, de la presentación, tiene una serie de ventajas:

• Sesimplificanlosdocumentos.• Éstospesanmenosysedescarganantes.• Sefacilitaeldesarrolloweb.• Semejoralaportabilidaddelaspáginas:un

mismo documento puede servir para diferentes receptores.

Para lograr una separación conveniente entre contenido y presentación hay que distinguir claramente ambos. Que estén juntos, pero no revueltos.

• Elcontenidoeslainformaciónenformadetextoque alberga la página y que es la base de la misma. Debe estar bien estructurada, es decir que, haya una jerarquía clara y coherente entre los diferentes elementos. Esta parte debe ser accesible con el más rudimentario de los sistemas de navegación por internet (por ejemplo, el navegador de texto Lynux), y para ello se usa el lenguaje xhtml, una versión mejorada del antiguo html que es más sencilla de usar. También las imágenes pueden considerarse contenido, siempre que acompañen al texto y no sean un mero adorno. Lo mismo se aplica al contenido multimedia como video o animaciones flash.

• Lapresentacióndebebasarseenlashojasdeestiloen cascada o css, ya que permiten controlar de una forma sencilla y racional colores, tipografías, tamaños, posiciones, imágenes decorativas. Lo ideal es que la presentación realce la estructura del documento, que cree el ambiente adecuado para el contenido.

Estructura de la información

La arquitectura de la información es una disciplina que estudia cómo se organiza la información, lo que es vital para estructurar bien una página web.

Para estructurar una página web es recomendable:

1. Establecer un título que englobe todo el tema de la página.

2. Definir los niveles de información: Dentro de ese título genérico, después, pueden ir definiéndose una serie de puntos secundarios, dentro de éstos otros terciarios, y así sucesivamente. Se puede hacer una analogía: que el título principal es el tronco de un árbol, los títulos secundarios las ramas principales y los temas terciarios y sucesivos diferentes ramificaciones. Así. la idea es estructurar la información de forma que lo más importante aparezca en primer lugar.

3. También ayuda a enriquecer la estructura de la página, definir claramente qué es cada cosa: párrafos, listas de puntos, tablas de datos, anotaciones, negritas... es decir, jerarquizar la información, hacerla más cómoda de comprender y, por lo tanto, más efectiva. Por supuesto, es muy recomendable que el texto sea lo más conciso y bien escrito posible — un diseño visualmente bueno pierde mucho cuando el texto no está a la altura.

Accesibilidad y facilidad de uso

La accesibilidad tiene que ver con la facilidad de acceso a la información. Por ejemplo, una ciudad accesible es aquella a la que se puede llegar fácilmente por múltiples medios: a pie, en coche, en tren, en avión... así, una página web accesible es aquella en la que para ver el contenido no se necesita tener ningún plug-in, ni el último navegador. Lograr un sitio web accesible no es demasiado difícil. Al separar el contenido de la presentación, es más sencillo extraer la información

Page 142: Usos Pedagogicos de internet

142Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

sin apenas trabajo adicional: pantalla, impresión, proyección, lectores de pantalla...

La facilidad de uso busca que la navegación por la información sea lo más sencilla y fluida posible. Es conveniente ofrecer al lector una ruta de navegación, señalar en qué lugar se encuentra en cada momento, permitir búsquedas... también es recomendable no poner varios enlaces al mismo sitio, ya que eso puede confundir. En general hay que evitar la confusión del usuario.

Convenciones y limitaciones

A la hora de escribir páginas web, se pueden encontrar una serie de limitaciones:

• Losprotocolosylosdiferenteslenguajes(porejemplo, xhtml o css), cuyas limitaciones se refieren a versiones, instrucciones y comunicación.

• Elanchodebanda,loquesetraduceenvelocidadde acceso a Internet. No todas las personas que se conectan a internet lo hacen a la misma velocidad, por eso los datos bajan más rápido en un computador conectado por RDSI (línea dedicada para transmisión de datos y conexión a internet) que en otro conectado a la línea telefónica con un módem de 56k. De hecho, la mayoría de las personas tiene conexiones lentas. Esto afecta bastante a la hora de crear las páginas, porque la mayoría de estas se crean con la idea de servir al mayor número de personas posible. Así que se tienen que hacer páginas lo más ligeras y rápidas posible, porque si una página tarda mucho en cargar, seguramente el usuario se cansará y abandonará la búsqueda.

¿Cómo se consigue eso?

• Escribiendoencódigo“limpio”(quesóloincluyalo indispensable), que ocupe el mínimo espacio necesario

• Empleandoelmínimodeimágenesposibles,ylo más optimizadas que sea posible (que ocupen apenas lo necesario)

• Elrestodeconsideracionessonlasmismasqueen el diseño gráfico tradicional: estructurar bien el texto, situar la información o los accesos a ella en lugares fáciles de ver, usar bien los colores, componer de forma interesante... todo esto ayuda a que la página funcione mejor.

Diseño de páginas

Para el diseño de las páginas de un sitio web aplican los criterios enunciados anteriormente para el sitio. A continuación se analiza el diseño de las páginas de un sitio teniendo en cuenta su estructura.

La página de portada52

La página de portada es un elemento decisivo de la web. Dado que es habitualmente el punto de entrada al sitio, la imagen que proyecta debe ser la deseada: el visitante debe adivinar qué se ofrece —o al menos sentir curiosidad por saberlo y navegar más adentro para verlo por sí mismo. Por tanto, conviene dedicar mucho más esfuerzo, proporcionalmente, a esta página, para hacerla atractiva, funcional y única.

Desde esta página se debe ofrecer acceso a las páginas de secciones principales de la web, aunque no es buena idea llenar el espacio con descripciones detalladas de éstas. Si se quiere un índice general que incluya todas las páginas y secciones, puede ser más funcional añadir un enlace a una página diferente con un mapa de la web o sitemap.

El estilo saturado de información de muchos portales de acceso a Internet no es recomendable para muchos proyectos; el exceso de opciones puede resultar desconcertante para muchos visitantes. Muchas webs que anteriormente tenían este aspecto superpoblado

52 CONSTRUCCIÓN DE PÁGINAS WEB. http://www.monografias.com/trabajos5/laweb/laweb.shtml#II

Page 143: Usos Pedagogicos de internet

143Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

han optado por un cambio en la portada y hacerla más simple. Los portales más recientes, como Inicia (http://www.inicia.es), han reducido la carga informativa en la portada.

Se pueden anunciar de algún modo las novedades en la web con un pequeño mensaje o con un enlace a una página donde se explique en detalle. Existen servicios como Freefind.com que crean automáticamente una página con las novedades de modo que siempre está actualizada.

En la página inicial es más fácil recurrir al lenguaje visual que al escrito. Los textos deben ser concisos y claros, indicando qué se encontrará en la web o suscitando la curiosidad e interés del visitante. Probablemente es en la página de inicio donde más se puede usar la imaginación y creatividad. No es necesaria una estructura previsible: se debe sorprender y entretener. Es un buen lugar para utilizar algo llamativo, como una película de Flash o efectos de mouseover. Lo mejor para encontrar inspiración es una vuelta por la web y ver qué hace otra gente. Así que le sugerimos las siguientes páginas para visitar:

• http://www.contraclave.org/• http://www.culturalandia.com/

Las páginas de secciones y subsecciones53

La web debe estar constituida por secciones lógicas y bien estructuradas. Una página de sección dará acceso a los artículos relacionados; al añadir nuevos artículos bastará modificar la página de sección añadiendo un enlace. Para identificar las secciones —y distinguir unas de otras— se puede utilizar un color distintivo para cada una, combinado con un icono o imagen exclusiva. En muchas webs se utiliza una barra de navegación en la que se indica en qué sección se encuentra con un color diferente o modificaciones semejantes, por ejemplo, oscureciendo o difuminando el resto de la

barra de navegación. Observe por ejemplo la página de inicio del sitio http://www.tareasya.com/.

Para decidir el diseño de las páginas de sección se debe perder de vista la facilidad con que se pueda actualizar, añadiendo accesos a las nuevas páginas de contenido que se incluyan más adelante.

Finalmente, en la mayoría de casos deben evitarse los marcos o frames. Este sistema navegación no ofrece ventajas significativas respecto de una barra de navegación dentro de la misma página y presenta una lista larga de inconvenientes (y resulta más difícil preparar todo.) Excepto para casos especiales, por ejemplo, un catálogo de imágenes de productos, no es una opción aconsejable.

Las páginas de contenidos o artículos54

Realmente éstas son las páginas de la Web. El resto no son más que añadidos para llegar de forma más fácil pero son piezas clave, dada la forma en que se navega. Para un libro, la portada y el índice no tienen tanta importancia. Pero, por analogía, un buen diseño de portada puede ayudar mucho a mejorar las ventas de una publicación.

El principal criterio de las páginas de contenido es la claridad expositiva. El texto debe ser fácilmente legible, con una correcta distribución y ancho de las líneas adecuado. Las ilustraciones deben ser funcionales y el uso del color, en correspondencia, debe ser más sobrio que en la portada.

La distribución del texto en columnas, tan común en los medios impresos, presenta un problema en las páginas web. Ya que la unidad que se muestra en pantalla no es una hoja, sino una pantalla de tamaño variable, el texto en dos columnas o tres, en las páginas web no se distribuye de la forma previsible, de arriba abajo y de izquierda a derecha. Las columnas son,

53 Ibid 54 Ibid

Page 144: Usos Pedagogicos de internet

144Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

de hecho, independientes entre sí y el texto no fluye automáticamente. Así, no hay forma de crear un texto continuo realmente funcional para leer en pantalla. Por este motivo, una solución muy utilizada es optar por columnas asimétricas. La columna pequeña contiene enlaces, información adicional, pequeñas ilustraciones... y la columna más ancha tiene el cuerpo del texto y las imágenes mayores.

Para ir avanzando en la lectura de los artículos no debería ser necesario volver a las páginas del nivel superior. Para ello conviene proporcionar una o varias barras de navegación que lleven a las principales secciones y botones para avanzar y retroceder o moverse rápidamente por la página. Si ésta tiene una cierta longitud, es una buena idea colocar un botón para subir sin necesidad de desplazarse por la página con el ratón o los cursores (el estándar es una flecha que apunta hacia arriba).

TALLERSOBRE EL DISEÑO DE PÁGINAS WEB

El propósito de este taller es que los participantes visiten algunas páginas web, identifiquen su estructura y que, basándose en los criterios definidos anteriormente, evalúen el diseño del sitio.

Puede realizarse en grupo (máximo tres personas).

1. Conéctese a Internet. 2. Ingrese a la página www.colombiaaprende.edu.co3. Desde la página de inicio, plantee una posible estructura del sitio (imagine cómo sería). Dibújela en un

papel, como esquema de árbol. (Estructura de sitio web planteada anteriormente)4. Entre a las opciones de menú y complete la estructura.5. Si hay otros vínculos, ingrese a ellos y continúe esquematizando la estructura del sitio.6. Ahora evalúe el diseño y utilidad del sitio contestando las siguientes preguntas, justifique cada

respuesta:

o Con respecto a la estructura del sitio: • ¿Consideraqueestábienestructurado? • ¿Cómoconsideralaestructura,complejaosencilla? • ¿Elíndiceomenúesclaro? • ¿Tieneformadevolveralmenú(páginadeinicio)oalnivelprevio? • ¿Sesintió“perdido”alnavegarofueclarosutransitarporelsitio? • ¿Hayalgúnvínculoqueloslleveaunmapadelsitio? • ¿Algúnvínculonofuncionacomoustedesperaba?

Page 145: Usos Pedagogicos de internet

145Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

o Con respecto a la estética: • ¿Esarmoniosa? • ¿Esagradablealavista? • ¿Larelaciónyproporcióndetextoeimágenesesadecuada? • ¿Lacombinacióndecoloresesatractiva? • ¿Laportada,seccionesysubseccionestienencoherenciaensudiseño?

o Con respecto a la información que se muestra en el sitio: • ¿Creequeelsitiocumplesuobjetivo? • ¿Lainformaciónquemuestraesclarayconcisa? • ¿Consideraqueladivisióndetemasysubtemas(seccionesysubsecciones)esadecuada? • ¿Ellenguajetextualqueseusaespertinente? • ¿Losgráficos,imágenesanimadasydemáselementosdelsitioestánacordeconlainformacióndel

mismo?

o Con respecto al entorno del sitio: • ¿Cómofueelprocesodecargue? • ¿Lasimágenesytextoaparecenenformaproporcionada? • ¿Eltransitarporelsitiofuelento? • ConsideraqueseaplicaronloscriteriosdeDiseñoparaTodos.

o Con respecto a usted como usuario: • ¿Fueunaexperienciaagradablevisitarestesitio.? • ¿Creequesetienenencuentalasinquietudesygustosdelusuario? • ¿Quéleaportóasuvidapersonalyprofesional? • ¿Volveríaaconsultarestesitio? • ¿Recomendaríaaotraspersonasquevisitaranestesitio?

7. Ahora ingrese a los siguientes sitios: http://usuarioslycos.es/teoriadelcaos/ www.elhuevodechocolate.com www.matemática.net www.webdianoia.com/ www.bogota.gov.co www.colsalle.edu.co8. Compárelos con la página que visitó anteriormente. ¿Qué opina?

CONSTRUCCIÓN DE HTML

¿Qué es HTML?

HTML es el lenguaje con el que se construyen las páginas Web. La idea inicial de HTML era describir la estructura y el contenido de un

Page 146: Usos Pedagogicos de internet

146Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

documento; sin embargo, la tendencia actual es utilizarlo también como un lenguaje de descripción controlando el aspecto de documento (tipografía, posicionado, etc.).55

Por medio del lenguaje HTML (HyperText Markup Languaje) se puede navegar por miles y miles de páginas a través de la WWW. Es un lenguaje que sirve para escribir hipertexto, es decir, documentos de texto presentado de forma estructurada, con enlaces (links) que conducen a otros documentos o a otras fuentes de información (por ejemplo bases de datos) que pueden estar en la propia máquina o en máquinas remotas de la red. Todo ello se puede presentar acompañado de cuantos gráficos estáticos o animados y sonidos seamos capaces de imaginar.

El HTML permite:56

• Publicardocumentosconencabezados,textos,tablas, listas, fotos, etc.

• Obtenerinformaciónatravésdeenlaces,haciendoclic con el mouse.

• Diseñarformulariospararealizartransaccionescon servicios remotos, para buscar información, hacer reservas, pedir productos, etc.

• Incluirhojasdecálculo,videoclips,sonidos,yotrasaplicaciones directamente en sus documentos.

Los documentos HTML son archivos de texto plano (también conocidos como ASCII) que pueden ser editados con cualquier editor de texto (p.ej. Edit de MS-DOS; Block de Notas de Windows). También se puede utilizar cualquier procesador de textos (como Microsoft Word) guardando el documento como “solo texto” o como página web. Los archivos HTML deben tener la extensión html o htm.

Por supuesto, la estética de los documentos escritos en HTML no se limita a texto normal; consigue todos

los efectos que habitualmente se pueden producir con un moderno procesador de textos: negrita, cursiva, distintos tamaños y fuentes, tablas, párrafos tabulados, sangrías, incluso texto y fondo de página de colores, entre otros.

El programa encargado de interpretar el texto HTML es el navegador, el cual puede recibir el código HTML junto con los elementos integrados en la página (imágenes, sonidos, vídeo, etc.) desde un servidor remoto o de un servidor de red (utilizando el protocolo de transferencia de hipertexto y HTTP) o leer las páginas directamente del disco duro (sin un protocolo de transmisión tipo HTTP, sino el equivalente a abrir un documento con un procesador de textos).

En HTML todas las codificaciones de efectos que forman el texto no son más que instrucciones para el visualizador. Partiendo de esto, se entiende por qué no se observa lo mismo con todos los visualizadores. Esto depende de cómo están diseñados y para cual versión de lenguaje están diseñados.

HTML no es un lenguaje de programación como puede serlo C, Pascal o Java; HTML tan sólo es un lenguaje para crear documentos en formato electrónico, una forma de definir efectos en el texto de manera similar a como se hacía en los antiguos procesadores de texto pero con complicados y poderosos servidores de información.

En la actualidad cualquiera puede crear sus páginas Web; puede escribir el código HTML directamente o utilizar alguno de los excelentes editores. Muchos usuarios de la red tienen ya sus páginas web publicadas, gracias al espacio que les brindan la mayoría de los proveedores de acceso. No es necesario que la página web este publicada en internet; se puede utilizar tan sólo para consultas internas en la red de área local en empresas u organizaciones (Intranet).

55 CONSTRUCCIÓN DE PÁGINAS WEB. http://www.monografias.com/trabajos5/laweb/laweb.shtml#II 56 MANUAL DE HTML. http://geneura.ugr.es/beatriz/contenido1.html

Page 147: Usos Pedagogicos de internet

147Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

¿Qué es un editor de HTML?

Los editores de HTML son programas especializados que pueden ayudar a la hora de construir una página web.

Para las personas que no deseen complicarse con el lenguaje HTML porque no tengan tiempo de aprenderlo o porque no disponen de tiempo, hay una posibilidad distinta a programar directamente el HTML a base de texto. Se trata de utilizar un tipo de programas que permite diseñar la página como si se estuviera escribiendo un documento con un editor del tipo de Word. El editor de HTML es el encargado de vérselas con el lenguaje y programar internamente la página con el código HTML según lo que se esté diseñando.

Con un editor HTML se puede colocar imágenes, definir estilos, utilizar negritas o cursivas, etc. sin preocuparse de las etiquetas correspondientes a cada estilo o elemento. Es el editor el que sabe estas etiquetas y las utiliza convenientemente.

Existe entre las personas que se dedican a realizar las páginas web dos tendencias. Por un lado se tienen a las personas que prefieren crear las páginas programando el HTML y por otro las personas que utilizan editores HTML. Algunas diferencias entre hacerlo de un modo u otro son las siguientes. H: Escribiendo el HTML

W: Con un editor WYSIWYG

H: Se domina con mayor precisión el código de la página, queda más limpio. Si se domina bien el HTML nunca se tendrá ningún problema para hacer lo que se quiere.

W: El código de la página tiene peor calidad, incluso puede llegar a tener errores, más o menos visibles, que cuestan arreglar. Es la máquina la que domina el trabajo.

H: Es más complicado el aprendizaje, más lento y cuando se llega a un nivel avanzado también se hace considerablemente más difícil.

W: El aprendizaje es muy sencillo, tal como puede ser trabajar en Word. Sólo se trata de manejar un programa más.

H: Hacer una página cuesta más trabajo y tiempo.

W: Es muy rápido.

Cada persona debe escoger el camino que más le convenga o el que le parezca más atractivo. De todos modos siempre se puede empezar de un modo y luego pasar al otro modo sin ningún tipo de problema. Incluso, llega un momento en el que hace falta conocer las dos maneras de construir webs. A los programadores en HTML les hará falta aprender un editor porque eso aumentará su productividad y los que utilizan editores necesitarán aprender un poco de HTML para arreglar alguna cosa que el editor ha hecho mal o realizar alguna cosa que el editor no puede hacer.

Actualmente el rey de los editores y el que aconsejaríamos sin duda es el Dreamweaver, fabricado por Macromedia. Otras posibilidades son editores como GoLive de Adobe o Frontpage de Microsoft.

Editores de texto preparados para escribir HTML

Existen también herramientas muy interesantes para aumentar la productividad sin dejar de escribir en HTML lo que se desea. Se trata de editores de texto, como cualquier otro, que están preparados para escribir HTML y por lo tanto ofrecen multitud de ayudas a los diseñadores. Por ejemplo, colorean los códigos de las páginas para hacerlos más comprensibles, ofrecen ayudas a la programación, completan etiquetas, … y un montón de utilidades más.

Page 148: Usos Pedagogicos de internet

148Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Son editores como por ejemplo Home Site, UltraEdit o Html Kit y es muy recomendable utilizarlos para sentirse más a gusto al programar las páginas y poder hacerlas más rápido. Posiblemente sea aconsejable empezar con el Bloc de notas, por que es lo más sencillo, pero utilizar un programa de estos será imprescindible con el tiempo.

¿Cuáles son los elementos fundamentales de HTML?

“Tag”: unidad fundamental de HTML

La unidad fundamental en lenguaje HTML es el “tag” o la etiqueta. Cada estructura de texto se encerrará entre una etiqueta de inicio y otra de fin.

En HTML las marcas vienen delimitadas con los signos <(menor) para inicio y >(mayor) para fin. De este modo el navegador sabe que debe interpretar el código comprendido entre estos símbolos. Las etiquetas pueden ir tanto en mayúsculas como en minúsculas.Las etiquetas de HTML pueden ser de dos tipos:57

• Cerradas:constandedoselementos,unoindicael principio de la etiqueta y el otro el final. Su estructura es:

<etiqueta>texto afectado</etiqueta>

• Abiertas:sonlasquesóloutilizanunelemento.

Una etiqueta puede contener “parámetros” que modifican su valor.

Ejemplos:

Código Resultado

Etiqueta cerrada <CENTER>Texto centrado</CENTER>

Texto centrado

Etiqueta abierta<HR>Etiqueta con parámetros<FONT color=”#FF9933”> Texto con color </FONT>

Texto con color

No todas las etiquetas están soportadas en todos los navegadores. Cuando un navegador encuentra alguna etiqueta que no reconoce no produce ningún mensaje de error, simplemente la ignora. Sin embargo, el texto incluido entre dos marcas que un navegador no reconoce, si es mostrado.

Comentarios

Los comentarios son líneas que el programador inserta dentro del código para documentar su archivo. Un comentario HTML tiene la siguiente sintaxis:

<!-- esto es un comentario --><!-- y esto también es un comentario,de más de una línea -->

No se pueden poner espacios en blanco entre el delimitador de apertura (“<!”) y el delimitador de apertura de comentario (“--”), pero sí entre el delimitador de cierre de comentario (“--” y el delimitador de cierre de declaración de etiqueta (“>”). Hay que evitar poner “-” dentro del texto del comentario.

Ej:<!--Aquí comienza la lista -->

¿Cómo es la estructura básica de un documento HTML?

Una página web está formada por una serie de páginas enlazadas entre sí, es decir, vamos a tener una serie de archivos y cada uno de esos archivos va a contener texto, imágenes, etc. Así que lo primero que se debe

57 Ibíd.

Page 149: Usos Pedagogicos de internet

149Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

hacer es un boceto en papel con todo lo que va a contener el documento. Una vez claro este contenido hay que pensar en la estructura de la página y en la organización de los archivos.

Normalmente hay una página principal, que se suele llamar index.html, con enlaces a otras páginas que tendrán a su vez otros enlaces y así sucesivamente. Es importante que todo esté bien organizado tanto para que a un usuario le resulte cómodo navegar por ella, como para que al autor le sea fácil poder modificarla o añadir información58.

Para que un navegador reconozca lo que está viendo en una página web el documento HTML debe comenzar con la etiqueta <html> y terminar con </html>. Dentro del documento (entre las etiquetas de principio y fin de html) se diferencian dos zonas:

• Encabezamiento,delimitadopor<head>alinicioy </head> al final, que sirve para definir diversos valores válidos en todo el documento.

• Cuerpo,delimitadopor<body>alinicioy</body> al final, donde reside la información del documento.

Puede haber una zona previa, que es opcional, en la que se identifica la versión de HTML y el nombre del programador como comentario

La única utilidad del encabezamiento es utilizar la directiva <TITLE> que permite especificar el título de un documento HTML. Este título no forma parte del documento en sí: no aparece, por ejemplo, al principio del documento una vez que éste se presenta con un programa adecuado, sino que suele servir como título de la ventana del programa que la muestra.

Por ejemplo: <TITLE>Mi primera página</TITLE>

El cuerpo de un documento HTML contiene el texto que, con la presentación y los efectos que se decidan, se presentará ante el hiperlector. Dentro del cuerpo son aplicables una serie de efectos los cuales se especifican exclusivamente a través de directivas o etiquetas. Esto quiere decir que los espacios, tabulaciones y retornos de carro que se introduzcan en el archivo fuente no tienen ningún efecto a la hora de la presentación final del documento.

Por ejemplo, escribiendo:

Estas palabrasforman una frase.

Se produce exactamente lo mismo que con:

Estas palabras forman una frase.

A la hora de la verdad lo que se ve es:

Estas palabras forman una frase.

En resumen, la estructura básica de un documento HTML queda de la forma siguiente:

<html> <head> <TITLE>Título de la ventana </TITLE> </head> <body> Texto del documento, menciones a gráficos, enlaces, etc. </body></html>

58 MANUAL DE HTML. http://geneura.ugr.es/beatriz/contenido1.html

Page 150: Usos Pedagogicos de internet

150Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Se pueden usar tabulaciones (tecla Tab) para diferenciar las partes del documento y saber a primera vista donde empieza y donde termina una sección o zona del documento.

Etiquetas

Pero que significa cada etiqueta:59

<HTML> (Etiqueta que indica que lo que viene a continuación es un documento HTML)<HEAD> (Etiqueta de apertura de la cabecera). Aquí va la información sobre el título de la página, el autor, palabras clave, etc. que no se presentarán en la ventana del navegador, salvo el título que aparecerá en la barra de título de la parte superior</HEAD> (Etiqueta de cierre de la cabecera)<BODY> (Etiqueta de apertura del cuerpo)Aquí va el contenido de la página que será lo que se presente en pantalla.</BODY>(Etiqueta de cierre del cuerpo)</HTML>(Etiqueta de cierre del documento)

Recuerde que para HTML es indistinto el uso de mayúsculas o minúsculas para digitar una etiqueta. Aquí se encuentra en mayúscula para diferenciar del resto de contenido en el archivo.

A continuación se avanzará en el lenguaje HTML presentando las etiquetas en la medida que se va desarrollando unos ejercicios prácticos.

Antes de comenzar los ejercicios prácticos se debe crear una carpeta en el Escritorio con el nombre “PRACTICAS HTML” para poder almacenar el resultado de los ejercicios que se van realizando.

59 CURSO DE HTML. http://platea.pntic.mec.es/~rluna/CursoHTML/

TALLERComenzando a trabajar con HTML. RECONOCIENDO HTML

Desarrolle las siguientes instrucciones con el fin de aplicar las anteriores indicaciones.

1. Abrir el accesorio de Windows Bloc de Notas.2. Escribir las etiquetas necesarias para crear el documento HTML, así: <HTML>

Page 151: Usos Pedagogicos de internet

151Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

<HEAD> <TITLE>Mi primer intento HTML</TITLE> </HEAD>3. Darle contenido al cuerpo escribiendo un renglón. <BODY> Este es mi primer ejercicio en HTML.4. Pulsar la tecla Intro/Enter para saltar al siguiente párrafo y escribir otro renglón.

Esta es la segunda línea.5. Pulsar dos veces la tecla Intro/Enter. Escribir un tercer renglón y cerrar el cuerpo y el documento

HTML: Esta es la tercera línea. </BODY> </HTML>6. El documento en la ventana de Bloc de Notas se verá así: <HTML> <HEAD> <TITLE>Mi primer intento HTML</TITLE> </HEAD> <BODY> Este es mi primer ejercicio en HTML. Esta es la segunda línea. Esta es la tercera línea. </BODY> </HTML>

• GuardarelarchivoenlacarpetaPRACTICASHTMLconelnombreEJERCICIO1.HTMmanteniendoeltipo como documento como texto.

• CerrarlaventanadeBlocdeNotas.

• CargarenelnavegadorhaciendodobleclicenInternetExplorer.

• SeleccionardelabarrademenúlaopciónArchivo-Abrir.

• EnelcuadrodediálogoAbrir,seleccionarelbotónExaminar…

• BuscarelarchivoguardadoenlacarpetadelEscritorio,observarelíconoqueloidentificacomopáginaweb.

• DarclicenAbriryAceptar.

Page 152: Usos Pedagogicos de internet

152Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Sepuedeobservar:

Atributos básicos de texto

Los atributos de texto corresponden a las instrucciones dadas para dar formato a los textos escritos. Etiquetas para salto de línea y párrafo.

<BR> es la etiqueta que sirve para indicarle al navegador que debe hacer un salto de línea.

<P> indica un salto de párrafo e introducirá un doble salto de línea.

Son dos etiquetas abiertas.

Existe otra forma de dar formato al texto utilizando lo que se denomina texto preformateado. (La etiqueta correspondiente es <PRE>).

En este caso, el navegador interpretará los saltos de línea que se introduzcan, pero esto tiene el riesgo de que el texto pueda quedar corto o largo en función de la resolución de pantalla de la persona que visite la página.

No se ha hecho gran cosa, se debe recordar que es el primer intento. Faltan algunas etiquetas con las que se puede mejorar la apariencia.

Page 153: Usos Pedagogicos de internet

153Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

TALLERDesarrolle las siguientes instrucciones.1. Abrir Bloc de Notas.2. Abrir el archivo creado en la Práctica 1 - EJERCICIO1.HTM3. Al momento de abrirlo aparecerá la ventana de la página web. Seleccione Ver – Código fuente y se

obtiene el texto digitado en lenguaje HTML.4. Introducir la etiqueta <BR> donde se había pulsado una vez la tecla Intro/Enter.5. Digitar <P> donde inicialmente se había pulsado dos veces la tecla Intro/Enter.6. El documento en la ventana de Bloc de Notas se ve así:<HTML> <HEAD> <TITLE>Mi primer intento HTML</TITLE> </HEAD> <BODY> Este es mi primer ejercicio en HTML. <BR> Esta es la segunda línea. <P> Esta es la tercera línea. </BODY></HTML>7. Guardar el archivo como EJERCICIO2.HTM8. Abrir el navegador y cargar esta nueva página para comprobar el resultado. 9. Se puede observar:

Page 154: Usos Pedagogicos de internet

154Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Desarrolle los ejercicios propuestos a continuación

1. Abrir el primer trabajo que se realizó EJERCICIO1.HTM con el Bloc de Notas2. Eliminar los espacios dados con Intro/Enter.3. Colocar al principio del texto la etiqueta <PRE> y al final la correspondiente etiqueta de cierre </

PRE>4. En la ventana de Bloc de Notas se puede ver:<HTML> <HEAD> <TITLE>Mi primer intento HTML</TITLE> </HEAD> <BODY> <PRE> Este es mi primer ejercicio en HTML. Esta es la segunda línea. Esta es la tercera línea. </PRE> </BODY></HTML>5. Guardar el documento como EJERCICIO2B.HTM y comprobar lo que ha ocurrido viéndolo en el

navegador.

Se puede observar:

Page 155: Usos Pedagogicos de internet

155Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Es de suponer que gracias a los dos ejercicios realizados se logre comprender cómo se escribe una página HTML.

La importancia de asimilar la estructura básica reside en que una de las mejores formas de aprender a crear páginas HTML es viendo páginas creadas por otros autores. Si se tiene claro el sistema utilizado se pueden reconocer los elementos que parezcan interesantes e irlos incorporando a otras páginas.

Las cabeceras

Uno de los elementos de formato que resulta imprescindible será la diferenciación de tamaños de letra para poder introducir títulos y organizar visualmente la información.

Hay seis formatos predeterminados de cabeceras. Para utilizarlos se debe digitar la etiqueta de apertura delante de la primera letra cuya apariencia se quiere modificar y cerrar tras la última letra para volver al texto normal. Además, las etiquetas de cabecera introducen un salto de párrafo sin necesidad de indicarlo.

Nivel 1: <H1>Cabecera de tipo 1</H1>

Cabecera de tipo 1Nivel 2: <H2>Cabecera de tipo 2</H2>

Cabecera de tipo 2Nivel 3: <H3>Cabecera de tipo 3</H3>Cabecera de tipo 3

Nivel 4: <H4>Cabecera de tipo 4</H4>Cabecera de tipo 4

Nivel 5: <H5>Cabecera de tipo 5</H5>Cabecera de tipo 5

Nivel 6: <H6>Cabecera de tipo 6</H6>Cabecera de tipo 6

Page 156: Usos Pedagogicos de internet

156Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Dar énfasis al texto

Para resaltar un fragmento de texto se pueden utilizar las tipografías en negrilla, itálica y subrayada. Su utilización se ajusta al convenio general de etiqueta de apertura y etiqueta de cierre limitando el texto al que se aplica el efecto.

Este código... ...da como resultado

Esta <B>palabra</B> está en <B>negrilla</B>

Esta palabra está en negrilla

Esta <I>palabra</I> está en <I>itálica</I>

Esta palabra está en itálica

Esta <U>palabra</U> está <U>subrayada</U>

Esta palabra está subrayada

Alineación

La alineación del texto por defecto se hace a la izquierda. Por el momento, mientras no se generalicen las nuevas especificaciones de la siguiente versión del lenguaje HTML no hay posibilidad de hacer una alineación justificada (completa), por lo que el texto quedará siempre “en bandera”, esto eswww, sin alinear en los finales de renglón.

Además de la alineación por defecto se puede también alinear el texto a partir del centro o a partir de la derecha. Para hacerlo se debe poner al principio del párrafo que se desea alinear la etiqueta de apertura y la de cierre en el final.• <CENTER>ysucorrespondientecierre</CENTER>marcanla

alineación centrada.• <DIVALIGN=right>y</DIV>delimitanunpárrafoalineadoa

partir del margen derecho.

TALLERATRIBUTOS DE TEXTO

1. Abrir Bloc de Notas.2. Definir las líneas iniciales de HTML con el título Usos de cabecera, alineación y énfasis.3. Al contenido del cuerpo incorporar los siguientes elementos:

Page 157: Usos Pedagogicos de internet

157Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Doscabecerasdediferentetamaño.• Unpárrafoconlaalineaciónpordefecto(izquierda),otroconjustificacióncentradayotrocon

justificación a la derecha.• Algunapalabraotextoresaltadoennegrita,enitálicaysubrayada.

4. Separar los elementos usando las etiquetas <BR> y <P>.5. En la ventana de Bloc de Notas se podría ver, por ejemplo:

<HTML> <HEAD> <TITLE>Uso de cabeceras, alineación y énfasis</TITLE> </HEAD> <BODY> <!--Dos cabeceras de diferente tamaño--> <H1>LA MAS GRANDE</H1> <BR> <H2>La que le sigue</H2> <P> <!--Párrafo con alineado por defecto--> Este texto está alineado por defecto <BR> <!--Párrafo alineado al centro--> <CENTER>Este texto está alineado al centro</CENTER> <BR> <!--Párrafo alineado a la derecha--> <DIV ALIGN=RIGHT>Este texto está alineado a la derecha</DIV > <P> <!--Palabras en negrita--> <B>Estas palabras van en Negrita</B> <BR> <!--Palabras en itálica--> <I>Estas palabras van en itálica</I> <BR><!--Palabras en cursiva--> <U>Estas palabras van en subrayado</U> <P> </BODY></HTML>

6. Guardar el documento como EJERCICIO3.HTM.7. Pasar al navegador para comprobar los resultados.

Page 158: Usos Pedagogicos de internet

158Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

8. Se puede observar:

9. Si algo no ha quedado como se previó, seleccionar en la barra de menú del navegador Ver-Código fuente para localizar el error y corregirlo. Una vez guardado el documento, volver a comprobarlo desde el navegador, dando clic en Atrás y volviendo a abrir el archivo.

Se puede observar que en el ejemplo se usaron comentarios para identificar que hacia cada grupo de etiquetas, esta acción se conoce como documentar.

Otros atributos del texto

• Conlaetiqueta<TT>y</TT>seconsiguequeeltextotengauntamaño menor y la apariencia de los caracteres de una máquina de escribir (typewriter), únicamente cambia su apariencia.

• Laetiqueta<BLOCKQUOTE>y</BLOCKQUOTE>seutilizaparadestacar una cita textual dentro del texto general definiendo comillas (“). Este párrafo está escrito entre ambas etiquetas.

• Enlasfórmulasmatemáticaspuedeinteresarpoderescribiríndicesysubíndices, que se consiguen con las etiquetas <SUP> </SUP> para potencias y <SUB> </SUB> para subíndices.

Caracteres especiales

Existen algunas limitaciones para escribir el texto. Una de ellas es debido a que las etiquetas se forman como un comando escrito entre los símbolos “<” y “>”. Por tanto, si se quisieran escribir estos caracteres como parte

Page 159: Usos Pedagogicos de internet

159Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

normal del texto, daría esto lugar a una ambigüedad, ya que el programa navegador podría interpretarlos como el comienzo o final de una etiqueta, en vez de un carácter más del texto.

Para resolver este problema, existen unos códigos para poder escribir estos caracteres y otros relacionados con las etiquetas. • &lt; para<(lessthan,menorque)• &gt; para>(greaterthan,mayorque)• &amp; para&(ampersand-Y)• &quot; para“(doublequotation–doble

comilla)

Como se ve, estos códigos empiezan siempre con el signo & y acaban siempre con ;

De una manera similar, existen códigos para escribir letras específicas de distintos idiomas. Hay muchos de ellos, pero, lógicamente, los que más nos interesan son los propios del castellano (las vocales acentuadas, la ñ y los signos ¿ y ¡ ).

Los códigos de las vocales acentuadas se forman:

1. Comenzando con &. 2. Seguido de la vocal sobre la que se ubicará la

tilde.3. Posteriormente la palabra acute (que es la referencia

para la tilde). 4. Se finaliza con el signo ;

Entonces tendríamos:

• &aacute;paralaá• &eacute;paralaé• &iacute;paralaí• &oacute;paralaó• &uacute;paralaú• &Aacute;paralaÁ• &Eacute;paralaÉ• &Iacute;paralaÍ• &Oacute;paralaÓ• &Uacute;paralaÚ

Por ejemplo, el texto “máquina” se digitará “m&acute;quina”

El resto de los códigos son:

• &ntilde;paralañ• &Ntilde;paralaÑ• &uuml;paralaü• &Uuml;paralaÜ• &#191;para¿• &#161;para¡

Por ejemplo, el texto “mañana” se digitará “ma&ntilde;ana”

Todo esto, que como se ve es muy laborioso, puede parecer inútil ya que si se escribe el texto sin hacer ningún caso de estas convenciones, escribiendo las letras acentuadas y demás signos directamente, es muy posible que el resultado se vea correctamente en el navegador, pero nunca se puede estar seguro que le ocurra lo mismo a todos los que accedan a las páginas con otros navegadores distintos.

En la práctica, el problema no es tan grave, pues los programas editores de HTML suelen tener la posibilidad de escribir los códigos automáticamente. Incluso si se escribe en un procesador de textos de forma manual, se puede escribir el texto en una primera etapa de forma normal y luego aplicarle algún de los programas que hacen la conversión adecuada.

Separador horizontal

Con la etiqueta <HR> se puede definir del separador, su apariencia y posicionamiento. Esta etiqueta usa parámetros que permiten definir las propiedades del separador. Por ejemplo:

Page 160: Usos Pedagogicos de internet

160Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Ejemplo Acción<HR WIDTH=75%> Ocupar el 75% de su

anchura (width) normal.<HR WIDTH=300> Definir anchura de 300

pixels.<HR ALIGN=LEFT> Alinear a la izquierda.<HR ALIGN=RIGHT> Alinear a la derecha.<HR SIZE=20> Variar su espesor <HR NOSHADE> Definir como una línea

sólida, no embutida sobre el fondo

Tipos de fuente

Los navegadores utilizan por defecto un tipo de fuente, generalmente Times New Roman, y que el usuario puede cambiar por otro tipo en la configuración de su navegador. Si así se hace, todas las páginas que se carguen tendrán el texto escrito en esa nueva fuente escogida.

Pero al confeccionar una página del Web, su autor puede forzar a que el texto adopte un determinado tipo de fuentes, distinto del que tiene configurado el usuario. Pero, para que esto ocurra, el usuario debe tener instalado en su disco duro ese tipo de fuentes (y además con el mismo nombre). Si no lo tiene instalado, entonces verá el texto con la fuente por defecto de su navegador.

Esto se consigue con la etiqueta <FONT> y el atributo FACE=”Nombre de la fuente”.

Por ejemplo, para forzar a que el texto adopte la fuente Verdana, se daría:<FONT FACE=”Verdana”>Este texto se verá con la fuente Verdana</FONT>

Que resulta:

Este texto se verá con la fuente Verdana

Si no se tiene instalada esta fuente, no se notará nada de particular.

Se pueden indicar en el atributo varias fuentes distintas, separadas por una coma. Si falla la primera, entonces el texto adopta la forma de la segunda, y así sucesivamente. Si fallan todas, el texto adopta entonces la fuente por defecto.

Así, por ejemplo:

<FONT FACE=”Impact, Arial”>Este texto se vera con la fuente Impact, o en su defecto con Arial</FONT>

Que resulta:

Este texto se vera con la fuente Impact, o en su defecto con Arial

Si no se tienen instaladas ninguna de las dos fuentes, tampoco se notará nada de particular.

Tamaño de fuente

SIZE es otro de los parámetros que pueden acompañar la etiqueta <FONT>, y permite cambiar el tamaño de la fuente. Por ejemplo:

<FONT SIZE=5> Texto en tamaño 5 </FONT> Texto en tamaño 5 <FONT SIZE=6> Texto en tamaño 6 </FONT> Texto en tamaño 6

Los tamaños del texto van, de menor a mayor, del 1 al 7. El tamaño normal (o tamaño base) es el 3. Se puede también cambiar relativamente con respecto a este tamaño normal.

<FONT SIZE=-1> Texto algo menor </FONT> Texto algo menor<FONT SIZE=+1> Texto algo mayor </FONT> Texto algo mayor<FONT SIZE=+2> Texto aún mayor </FONT>

Page 161: Usos Pedagogicos de internet

161Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Texto aún mayor

Se puede cambiar incluso el tamaño base para toda la página, poniendo al comienzo del documento (a continuación de la etiqueta <BODY>) esta etiqueta que cambiaría el tamaño base de 3 a 5:

<BASEFONT SIZE=5>

TALLERDesarrolle las siguientes instrucciones:

1. Volver al Bloc de Notas y abrir el archivo EJERCICIO3.HTM.2. Modificar el contenido del cuerpo defiendo las siguientes características al texto:

• Darfuentediferentealascabeceras.• Dartamañodefuentesdiferentesacadapárrafodealineaciónpordefecto,centradayala

derecha.• Alostextosconénfasisañadirpalabrascontildeyñ.• Darunseparadordiferentedespuésdecadaatributodetexto,esdecirunodespuésdecabeceras,

otro después de alineación y otro al final del archivo.3. Guardar el documento como EJERCICIO3.HTM.4. Pasar al navegador para comprobar los resultados.

Fondos

Se puede cambiar el fondo de dos maneras distintas:

• Conuncoloruniforme• Conunaimagen

Los fondos con un color uniforme se consiguen añadiendo el parámetro BGCOLOR a la etiqueta <BODY> , de la siguiente manera:

<BODY BGCOLOR=”#XXYYZZ”>donde:

XX es un número indicativo de la cantidad de color rojo YY es un número indicativo de la cantidad de color verde ZZ es un número indicativo de la cantidad de color azul

Estos números están en numeración hexadecimal (sistema de numeración en base 16 del 0 a 9 y continuando de la A a la F)

Page 162: Usos Pedagogicos de internet

162Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

El número menor es el 00 y el mayor el FF. Así, por ejemplo, el color rojo es el #FF0000, porque tiene el máximo de rojo y cero de los otro dos colores.

Los colores primarios en sistemas de transmisión telemática son:

#FF0000 - Rojo #00FF00 - Verde #0000FF - Azul

Otros colores son:

#FFFFFF - Blanco #000000 - Negro #FFFF00 - Amarillo

Para hacer un color más oscuro, hay que reducir el número de su componente, dejando los otros dos invariables. Así, el rojo #FF0000 se puede hacer más oscuro con #AA0000, o aún más oscuro con #550000.

Para hacer que un color tenga un tono más suave (más pastel), se deben variar los otros dos colores haciéndolos más claros (número más alto), en una cantidad igual. Así, se puede convertir el rojo en rosa con #FF7070.

Podemos hacer nuestros propios experimentos, pero si desea, existen páginas del Web en las que se pueden elegir los colores directamente, como por ejemplo en: BackgroundColors.

Los fondos con una imagen pueden ser en formato GIF o JPEG. Esta imagen se repite por toda la página, de una manera análoga al tapiz de Windows. La estructura de la etiqueta es:

<BODY BACKGROUND=”imagen.gif”>

o bien:

<BODY BACKGROUND=”imagen.jpg”>

No todos los navegadores soportan este formato.

Page 163: Usos Pedagogicos de internet

163Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Dos ejemplos de fondos:

Hay que prever la posibilidad de que quien acceda a una página haya deshabilitado la carga automática de imágenes, en cuyo caso tampoco cargaría la imagen que sirve como fondo y sólo vería el fondo estándar de color gris. Esto podría ser muy perjudicial si se han escogido unos colores para el texto y los enlaces que no contrastan bien con ese fondo gris. La solución a este problema es poner dentro de la etiqueta <BODY> los dos parámetros BACKGROUND y BGCOLOR (en este orden), teniendo cuidado en escoger un color uniforme de fondo parecido al de la imagen.

Por ejemplo, si se quiere poner como fondo la imagen nubes.jpg. Se escoge entonces un color de fondo azul claro, (p. ej. #CCFFFF). La etiqueta quedaría así:

<BODY BACKGROUND=”nubes.jpg” BGCOLOR=”#CCFFFF”>

Esto tiene la ventaja adicional de que, incluso aunque no se deshabilite la carga automática de imágenes, al cargar la página, lo primero que se ve es ese fondo de color uniforme, que luego es reemplazado por el de la imagen.

¿Cómo conseguir un fondo para nuestra página?

Teóricamente, cualquier imagen puede servir como fondo, pero unas son más apropiadas que otras. Además, se puede crear un fondo o cargarlo de otras páginas.

Colores del texto y de los enlaces

Si no se varían los colores habituales del texto y de los enlaces (negro y azul, respectivamente), podría ocurrir que su lectura contra un fondo oscuro fuese muy dificultosa, o incluso imposible, si el fondo fuese precisamente negro o azul.

Para evitar esto, se pueden escoger los colores del texto y de los enlaces, añadiendo a la etiqueta (si se desea) los siguientes parámetros:

TEXT - color del texto LINK - color de los enlaces VLINK - color de los enlaces visitados ALINK - color de los enlaces activos (el que adquieren en el momento de ser pulsados)

1bricks.gif

1

nubes.jpg

Page 164: Usos Pedagogicos de internet

164Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Los códigos de los colores son los mismos que los que se han visto anteriormente.

La etiqueta, con todas sus posibilidades, sería:

< BODY BGCOLOR=”#XXYYZZ” TEXT=”#XXYYZZ” LINK=”#XXYYZZ” VLINK=”#XXYYZZ” ALINK=”#XXYYZZ”>

Cambio del color de una parte del texto

El parámetro TEXT explicado anteriormente (que va englobado dentro de la etiqueta <BODY>) cambia el color de la totalidad del texto de la página. Tanto el Netscape Navigator 2 como el Microsoft Explorer soportan una etiqueta de color de la fuente con la que se puede cambiar sólo una parte del texto:

<FONT COLOR=”#FF0000”> Este texto es de color rojo </FONT>

Que resulta:

Este texto es de color rojo

TALLERSiga las siguientes instrucciones:

1. Volver al Bloc de Notas y abrir el archivo EJERCICIO1.HTM para definirle un fondo de color azul claro. Guardar el archivo como EJERCICIO5A.HTM. Observar los cambios desde el navegador.

2. Abrir EJERCICIO2 y definir un fondo tomando una de las imágenes que se encuentran instaladas en su equipo. Guardar el archivo como EJERCICIO5B.HTM. Observar los cambios desde el navegador.

3. Abrir EJERCICIO3 y definir un color de texto diferente para todas y cada una de las líneas de texto. Guardar el archivo como EJERCICIO5C.HTM. Observar los cambios desde el navegador.

Listas

El uso de listas permite organizar y dar formato visual al texto. Las listas sirven para ir organizando la información de acuerdo a alguno de los siguientes formatos

• Listasordenadas:Loselementossepresentannumerados.Porejemplo:

Page 165: Usos Pedagogicos de internet

165Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

1. Elemento 12. Elemento 2

• Listasdesordenadas:Loselementosvanprecedidosporunaviñeta,así:

• Elemento1• Elemento2

• Listasdedefinición:Presentatérminosydefinicionescondiferentetabulación, como:

Término 1 Definición del término 1 Término 2 Definición del término 2

Las etiquetas de HTML relacionadas con una lista son:

Concepto Etiqueta Descripción

Listas desordenadas<ul></ul> Abre y cierra una lista sin orden concreto. Suele

mostrarse como una lista con varios puntos (viñetas). Por ejemplo:•Elemento1•Elemento2

Listas ordenadas <ol></ol> Abre y cierra una lista ordenada. Se muestra habitualmente con una numeración o una serie de letras, mostrando una sucesión ordenada de elementos. Por ejemplo: •Elemento1•Elemento2

Elemento de lista <li></li> Abre y cierra un elemento de una lista sea ésta ordenada o no.

Lista de definiciones <dl></dl> Abre y cierra una lista de definiciones.

Término a definir <dt></dt> Abre y cierra un término a definir dentro de una lista de definiciones.

Definición de lista <dd></dd> Abre y cierra una definición del término en la lista.

Page 166: Usos Pedagogicos de internet

166Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

TALLERSiga las instrucciones relacionadas a continuación.

1. Abrir el Bloc de Notas.2. Digitar las siguientes etiquetas de HTML:<HTML> <HEAD> <TITLE>Listas</TITLE> </HEAD> <BODY> <PRE> <!--Lista desordenada--> <UL> <LI>Meses del año</LI> <LI>Días de la semana</LI> <LI>Horas del día</LI> </UL> <!--Lista ordenada--> <OL><LI>Pagina de inicio</LI> <LI>Páginas de secciones o subsecciones</LI> <LI>Páginas de contenido</LI> </OL><!--Lista de definiciones--> <DL> <DT>INTERNET</DT> <DD>Red de redes</DD> <DT>WWW</DT> <DD>World Wide Web</DD> <DT>HTML</DT> <DD>HyperText Markup Language</DD></DL> <PRE> </BODY></HTML>3. Guardar el documento como EJERCICIO6BLOC.HTM.4. Comprobar lo que se ha realizado viéndolo en el navegador. 5. Abrir el Bloc de Notas y el archivo creado en la Práctica 6.6. Agregar dentro de la lista ordenada una lista desordenada.7. Agregar dentro de la lista desordenada una lista ordenada.

Page 167: Usos Pedagogicos de internet

167Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

8. Agregar dentro de la lista de definiciones la de TCP/IP9. En la ventana del Bloc de Notas se podrá ver por ejemplo::<HTML> <HEAD> <TITLE>Listas</TITLE> </HEAD> <BODY> <PRE> <!--Lista desordenada--> <UL> <LI>Meses del año</LI> <!--Lista ordenada--> <OL> <LI>Enero</LI><LI>Febrero</LI><LI>Marzo</LI><LI>Abril</LI><LI>Mayo</LI><LI>Junio</LI></OL> <LI>Días de la semana</LI> <LI>Horas del día</LI> </UL> <!--Lista ordenada--> <OL><LI>Página de inicio</LI> <LI>Páginas de secciones o subsecciones</LI> <LI>Páginas de contenido</LI> <!--Lista desordenada--> <UL><LI>Texto</LI><LI>lmágenes</LI><LI>Objetos animados</LI> </OL><!--Lista de definiciones--> <DL> <DT>INTERNET</DT> <DD>Red de redes</DD> <DT>WWW</DT> <DD>World Wide Web</DD> <DT>HTML</DT><DD>HyperText Markup Language</DD> <DT>TCP/IP</DT>

Page 168: Usos Pedagogicos de internet

168Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

<DD>Protocolo de Control de Transmisión/Protocolo de Trabajo de Internet (Transmission Control Protocol/Internet Working Protocol)</DD>

</DL> </BODY></HTML>10. Guardar el documento como EJERCICIO6bBLOC.HTM.11. Entrar a Microsoft Word y seleccionar Archivo-Nuevo-Página Web en blanco.12. Crear una lista ordenada que esté formada por dos elementos del primer nivel, de uno de los cuales

colgarán dos elementos de segundo nivel. (Llamamos primer nivel al que está más próximo al margen izquierdo y 2º, 3º o sucesivos a los que se encuentran más alejados, en la 2ª, 3ª y sucesivas tabulaciones). Estos se logra dando clic en el botón Números de la barra de herramientas Formato y para agregar un subnivel se da clic en el botón de Aumentar Sangría de la misma barra.

13. Al terminar la lista, escribir un renglón de texto normal14. La ventana de Word se podría ver así: i. Pagina de Inicio ii. Conceptos Generales 1. Internet 2. Páginas Web Aquí termina la lista ordenada

15. Seleccionar en la barra de menú Guardar como o Guardar como página web. 16. En el cuadro de diálogo seleccionar el lugar donde se va a guardar.17. Luego dar clic en el botón Cambiar título… Aparece otro cuadro de dialogo: Establecer título de la

página y digitar el título: Listas Ordenadas. 18. El nombre del documento es EJERCICIO7WORD.19. Entrar al navegador para ver el resultado.20. En el navegador seleccionar en la barra de menú la opción Ver – Código fuente. Se pueden observar

las líneas de HTML que genera automáticamente Word. Si se hace una revisión rápida se pueden observar muchas etiquetas que aún no se han visto y algunas pocas que ya se vieron.

En la siguiente práctica se hará un ejercicio con listas desordenadas.

21. Volver a Microsoft Word y seleccionar Archivo- Nuevo - Página web en blanco.22. Crear una lista desordenada con características semejantes a la anterior.23. Al terminar la lista, escribir un renglón de texto normal24. La ventana de Word se podría ver así: •Mesesdelaño • Díasdelasemana • Lunes •Martes Aquí termina la lista desordenada.

Page 169: Usos Pedagogicos de internet

169Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

25. Guardar el documento como EJERCICIO7BWORD.26. Cambiar el título por Listas desordenadas. 27. Entrar al navegador para ver el resultado.28. Ver el código fuente.

Tablas

¿Por qué son útiles las tablas?

Ahora bien, antes de pasar a utilizar las tablas como recurso para realizar otras tareas se verá su utilidad más inmediata: presentar información que se preste a organizarse en un formato de doble entrada.

Partiendo de la forma más simple, la de una tabla con una fila y una columna, a la que se podría considerar como un marco alrededor del texto, se puede ir complicando la forma, mediante la adición de filas y columnas; o la fusión de las celdas que la constituyen según lo requiera la información presentada.

Conocer el procedimiento para crear tablas tecleando directamente el código puede parecer inicialmente tedioso pero fácilmente se puede comprobar que resulta mucho más rápido siempre que se tenga un boceto en papel, es decir, si se piensa primero en la estructura de la tabla que se requiere para presentar la información.

Las tablas en HTML.

Las etiquetas de HTML asociadas con tablas son:

<TABLE> </TABLE> Son las etiquetas de apertura y cierre de la tabla. Entre ellas irán las etiquetas y los contenidos de cada una de las filas y celdas.

<TR> </TR> Son las etiquetas que indican el principio y final de una fila. Entre ellas habrá que incluir las etiquetas y contenidos de las celdas que la forman.

<TD> </TD> Delimiten cada una de las celdas. Entre ambas se incluye el contenido correspondiente.

Page 170: Usos Pedagogicos de internet

170Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Además de estas etiquetas hay que conocer dos atributos que sirven para hacer que una celda ocupe más de una fila o una columna. Estos atributos son modificadores de las etiquetas que se escriben a continuación del código y antes de poner el ángulo de cierre de la misma.

<TH> </TH> Permite definir la primera fila o columna como encabezado.<CAPTION> </CAPTION>

Define una fila de título para la tabla.

BORDER=n Indica el grosor de los bordes que delimitan las celdas.ROWSPAN=n Indica el número de filas que ocupará una celda.COLSPAN=n Permite unir celdas horizontalmente.WIDTH=n% Amplia en ancho de la tabla en n%.HEIGHT=n Amplía el alto de la tabla en n píxelesALIGN=a Alinea horizontalmente el contenido de una celda. Puede tener los

siguientes valores: CENTER, RIGHT o LEFT.VALIGN=b Permite alinear verticalmente el contenido de una celda. Puede tener los

siguientes valores: TOP o BOTTOM.BGCOLOR=”XXYYZZ” Define color de fondo a la tabla o a una celda en especial.BACKGROUND=”imagen.gif”BACKGROUND=”imagen.jpg”

Para definir una imagen de fondo para la tablas (repitiéndose en cada celda)o para cada celda.

CELLSPACING=n Define una separación de n píxeles entre las celdas de una tabla.CELLPADDING=n Define una separación de n píxeles entre el borde y el contenido de las

celdas de una tabla.

Cómo trabajar ágilmente con tablas

Una vez conocidas las etiquetas y sus modificadores es conveniente establecer un método para que el trabajo resulte ágil:

• Loprimeroesdibujarunbocetodelaestructuradelatablaenpapel,tener claro cuantas columnas y filas debe contener, la información que incluirá en la tabla y si se requiere alguna modificación especial.

• Luegosepuedecrearunarchivoconlasetiquetasbásicasdeundocumento HTML.

• Escribirlasetiquetasdeaperturaycierredelatabla(noolvidandoponerBORDER=1 en la apertura) separándolas con varias pulsaciones de la tecla INTRO para que resulte cómoda la inserción de las etiquetas intermedias.

• Escribirtantasetiquetasdeaperturaycierredefilascomosenecesiten.(Dejar espacios intermedios para insertar las celdas).

Page 171: Usos Pedagogicos de internet

171Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Seintroducenlasetiquetasdeceldasencadafilacon sus modificadores correspondientes. La clave del éxito consiste en tener en cuenta que todas las filas deben tener el mismo número de celdas, por lo que se tienen que contar los atributos: una fila en la que sólo se tienen dos etiquetas de celda pero cada una se extiende por dos columnas y además hay una celda de filas anteriores que se ha extendido verticalmente hasta ésta tiene en realidad 5 celdas (1+2+2).

• Parafacilitarlavisualización,enelnavegador,delatabla debe introducirse en cada celda que se cree los caracteres &nbsp, que corresponden al código que el navegador interpreta como un espacio. La forma más cómoda es escribirlos una vez se haya creado la tabla, copiarlos e irlos pegando en el interior de cada una de las celdas.

• Parallevarelcontroldelasceldascreadaspuedeayudar el irlas tachando sobre el boceto a medida que se van haciendo, considerando siempre la retícula formada por el número total de filas y columnas.

• Cuandoestácreadalaestructuradelatablaseguarda el archivo con extensión .htm y se abre nuevamente para introducir los contenidos de las celdas y modificar otros atributos, tales como la posición, grosor de bordes, etc, de forma más cómoda.

Creando la estructura de una tabla

Veremos ordenadamente (de fuera hacia dentro) las etiquetas necesarias para confeccionar las tablas:

1. La etiqueta general, que engloba a todas las demás es <TABLE> y </TABLE>. Es decir:

<TABLE> [resto de las etiquetas] </TABLE>

Con esto se presentarían los datos tabulados pero faltaría la característica que hace más atractivas a las tablas, y es que estos datos vayan dentro de

unos “cajoncitos” formados por un borde. Para esto tenemos que añadir el atributo BORDER a la etiqueta, es decir:

<TABLE BORDER> [resto de las etiquetas] </TABLE>

2. En el siguiente nivel, dentro de la anterior, están las etiquetas para formar cada fila (row) de la tabla, que son <TR> y </TR>. Hay que repetirlas tantas veces como filas se tengan en la tabla. Es decir, para una tabla con dos filas, sería:

<TR> [etiquetas de las distintas celdas de la primera fila] </TR> <TR> [etiquetas de las distintas celdas de la segunda

fila] </TR>

3. En el último nivel (dentro de las anteriores) están las etiquetas de cada celda, que son <TD> y </TD>, que engloban el contenido de cada celda concreta (texto, imágenes, etc.). Hay que repetirla tantas veces como celdas haya en esa fila.

Un ejemplo de una tabla con dos filas, cada fila va a tener tres celdas, es decir, una tabla de 2 por 3. Dentro de cada celda se va a poner un texto indicativo de la posición de dicha celda:

<TABLE BORDER=3> <TR> <TD>fila1-celda1</TD> <TD>fila1-

celda2</TD> <TD>fila1-celda3</TD> </TR> <TR> <TD>fila2-celda1</TD> <TD>fila2-

celda2</TD> <TD>fila2-celda3</TD> </TR> </TABLE>

Page 172: Usos Pedagogicos de internet

172Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Lo que resulta es:

fila1-celda1 fila1-celda2 fila1-celda3fila2-celda1 fila2-celda2 fila2-celda3

Pero, si son filas con desigual número de celdas…

En el ejemplo anterior se ha definido una tabla con dos filas con igual número de celdas. ¿Qué pasa si ese número es distinto? Pues el navegador forma el número de filas y columnas que haga falta, dejando espacios en blanco en las filas que tengan menos celdas.

Si en el ejemplo anterior eliminamos la tercera celda de la segunda fila, es decir si borramos <TD>fila2-celda3</TD>, resultará:

fila1-celda1 fila1-celda2 fila1-celda3fila2-celda1 fila2-celda2

Título de la tabla

Se puede añadir un título (caption) a la tabla, es decir, un texto situado encima de la tabla que indica cuál es su contenido. Se consigue con la etiqueta <CAPTION> y </CAPTION>.

Si en el ejemplo anterior añadimos la siguiente línea:

<CAPTION> Ejemplo de filas desiguales </CAPTION>, resulta:

Ejemplo de filas desigualesfila1-celda1 fila1-celda2 fila1-celda3fila2-celda1 fila2-celda2

Variando el espesor de los bordes

El atributo BORDER (visto más arriba) pone por defecto un borde de espesor igual a la unidad. Pero se puede hacer que este borde sea tan grueso como queramos poniendo:

<TABLE BORDER=número deseado>

Si en el ejemplo anterior ponemos:

<TABLE BORDER=5>Resultará:

Ejemplo de filas desigualesfila1-celda1 fila1-celda2 fila1-celda3fila2-celda1 fila2-celda2

Encabezado de celdas

Además de las celdas que contienen datos normales se puede definir, si se requiere, un encabezado de celdas (header) que se distinguen por poner efectos de énfasis en el texto de dichas celdas. Esto se consigue con la etiqueta <TH> y </TH> (en vez de la normal <TD> y </TD>).

Al añadir, en el ejemplo anterior, una fila de estas celdas de cabecera antes de las otras dos que ya existían:

<TR><TH>Columna 1</TH><TH>Columna 2</TH><TH>Columna 3</TH></TR>

Que resulta:

Ejemplo de filas desigualesColumna 1 Columna 2 Columna 3Fila1-celda1 fila1-celda2 fila1-celda3fila2-celda1 fila2-celda2

Se pueden colocar en el sitio que se requiera, aunque lo normal es que vayan en los bordes., encabezando las columnas o las filas.

¿Cuál puede ser el contenido de las celdas?

Hasta ahora, en todos los ejemplos, se ha puesto un texto normal dentro de las distintas celdas. Pero se puede incluir en una celda cualquier otro elemento de

Page 173: Usos Pedagogicos de internet

173Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

los que van en un documento HTML, como imágenes, enlaces, etc. No se necesita más que poner dentro de la etiqueta de la celda la etiqueta correspondiente a una imagen, un enlace, etc.

Ejemplo con una imagen:

<TABLE BORDER=2><TR><TD><IMG SRC=”babe.gif”></TD></TR></TABLE>

Ejemplo con un enlace:

<TABLE BORDER=2><TR> <TD><A HREF=”index.html”>Página principal </A> </TD></TR></TABLE>

Página principal

Posicionamiento del contenido dentro de la celda

Normalmente el contenido de una celda está alineado a la izquierda aunque por defecto la alineación es centrada, pero se puede cambiar esto añadiendo dentro de la etiqueta de la celda los siguientes atributos:

<TD ALIGN=CENTER> Al centro </TD><TD ALIGN=RIGHT> A la derecha </TD><TH ALIGN=LEFT> Cabecera a la izquierda </TH>

Ejemplos de alineamiento horizontal dentro de la celda

Al centroA la derecha

Cabecera a la izquierda

El alineamiento por defecto en el sentido vertical es en el medio. También se puede cambiar añadiendo dentro de la etiqueta de la celda los siguientes atributos:

<TD VALIGN=TOP> Arriba </TD> <TD VALIGN=BOTTOM> Abajo </TD>

Arriba

Abajo Variando las dimensiones de la tabla

El navegador se encarga normalmente de dimensionar el tamaño total de la tabla de acuerdo con el número de filas, de columnas, por el contenido de las celdas, espesor de los bordes, etc.

A veces puede realizar ajustes para que la tabla tenga unas dimensiones totales mayores que las que le corresponden, tanto en anchura como en longitud. Esto se consigue añadiendo dentro de la etiqueta de la tabla los atributos WIDTH y HEIGHT igual a un porcentaje de la dimensión de la pantalla, o a una cifra que equivale al número de píxeles.

Por ejemplo, si en el último ejemplo se define:

<TABLE WIDTH=60%>

Page 174: Usos Pedagogicos de internet

174Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Arriba

Abajo

O, si en ese mismo ejemplo, se digita: <TABLE HEIGHT=200>

Arriba

Abajo Celdas que abarcan a otras celdas

A veces puede ser necesario que una celda se extienda sobre otras. Esto se consigue añadiendo dentro de la etiqueta de la celda los atributos COLSPAN=número para extenderse sobre un número determinado de columnas, o ROWSPAN=número para extenderse verticalmente sobre un número determinado de filas.

Por ejemplo, si en la primera tabla que se realizó, se añade una fila con una sola celda, que abarca a dos columnas:

<TR> <TD COLSPAN=2> Celda sobre 2 columnas </TD> <TR>

Celda sobre 2 columnas

fila1-celda1 fila1-celda2 fila1-celda3fila2-celda1 fila2-celda2 fila2-celda3

O, en la misma tabla, vamos a añadir una celda en la primera fila que abarque también a la siguiente:

<TD ROWSPAN=2> Celda junto a 2 filas </TD>

Celda junto a 2 filas

fila1-celda1

fila1-celda2

fila1-celda3

fila2-celda1

fila2-celda2

fila2-celda3

Color de fondo en las tablas

Conseguir que las tablas tengan un color de fondo se logra siguiendo un procedimiento totalmente análogo al utilizado para que una página tenga un color de fondo uniforme. Para ello se utiliza el atributo BGCOLOR=”#XXYYZZ”.

Se puede conseguir:

1. Que la totalidad de la tabla tenga un color de fondo. Para ello, se define el atributo dentro de la etiqueta TABLE. Por ejemplo, para que la tabla tenga un fondo verde (#00FF00):

<TABLE BORDER BGCOLOR=”#00FF00”> <TR> <TD>fila1-celda1</TD> <TD>fila1-

celda2</TD> </TR> <TR> <TD>fila2-celda1</TD> <TD>fila2-

celda2</TD> </TR> </TABLE>

Que resulta:

fila1-celda1 fila1-celda2fila2-celda1 fila2-celda2

2. Que solamente una celda determinada tenga un color de fondo. Para ello, colocamos el atributo dentro de la etiqueta de la celda correspondiente. Por ejemplo, vamos a hacer que sólo la celda 1 de la fila 1 tenga un color verde:

<TABLE BORDER><TR><TD BGCOLOR=”#00FF00”>fila1-celda1</TD><TD>fila1-celda2</TD></TR>

Page 175: Usos Pedagogicos de internet

175Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

<TR><TD>fila2-celda1</TD><TD>fila2-celda2</TD> </TR></TABLE>

Que resulta:

fila1-celda1 fila1-celda2fila2-celda1 fila2-celda2

3. Para que la mayoría de las celdas tenga un color pero que alguna celda tenga uno particular, el atributo del color general se coloca en la etiqueta TABLE y el del color particular en la etiqueta de la celda en cuestión (una combinación de los dos casos anteriores). Por ejemplo, para hacer que la generalidad de la tabla sea de color rojo (#FF0000), pero que la celda 1 de la fila 1 sea de color verde (#00FF00):

<TABLE BORDER BGCOLOR=”#FF0000”><TR><TD BGCOLOR=”#00FF00”>fila1-celda1</TD><TD>fila1-celda2</TD></TR><TR><TD>fila2-celda1</TD><TD>fila2-celda2</TD></TR></TABLE>

Que resulta:

fila1-celda1 fila1-celda2fila2-celda1 fila2-celda2

Imágenes de fondo en las tablas

El Explorer de Microsoft soporta la colocación de imágenes de fondo en el interior de las tablas, de una manera análoga a como se hace en una página.

Para ello se utiliza el atributoBACKGROUND=”imagen.gif” o BACKGROUND=”imagen.jpg”

Si se utiliza dentro de la etiqueta <TABLE> la imagen en cuestión se multiplicará detrás de todas las celdas.

Por ejemplo, si se define:<TABLE BORDER BACKGROUND=”nubes.jpg”>

(Se omite el resto de las etiquetas de la tabla)

Se obtiene:

fila1-celda1 fila1-celda2fila2-celda1 fila2-celda2

Si, por el contrario, sólo se da este atributo dentro de la etiqueta de una celda concreta (<TD> o <TH>), entonces la imagen de fondo se verá sólo en esa celda, como por ejemplo:

fila1-celda1 fila1-celda2fila2-celda1 fila2-celda2

Separación entre las celdas de una tabla

Por defecto, la separación entre las distintas celdas de una tabla es de dos píxeles. Pero se puede variar esto con el atributo CELLSPACING, que se define dentro de la etiqueta TABLE.

Por ejemplo, para obtener una separación de 20 píxeles entre celdas se digita:

<TABLE BORDER CELLSPACING=20>(Se omite el resto de las etiquetas de la tabla)

Con lo que se obtiene:

fila1-celda1 fila1-celda2

fila2-celda1 fila2-celda2

Page 176: Usos Pedagogicos de internet

176Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

A primera vista parece como si esto fuera lo mismo que si se hubiera aumentado el espesor de los bordes. Pero para comprobar que no es así, probar que en el caso anterior tenga además unos bordes de 5 de espesor:

<TABLE BORDER=5 CELLSPACING=20>

Con lo que se obtiene:

fila1-celda1 fila1-celda2

fila2-celda1 fila2-celda2

Separación entre el borde y el contenido dentro de las celdas

Por defecto, la separación entre el borde y el contenido dentro de las celdas es de un píxel. Se puede cambiar esto con el atributo CELLPADDING, que se define dentro de la etiqueta TABLE.

Por ejemplo, para obtener una separación de 20 píxeles entre el contenido y los bordes, dentro de cada celda:

<TABLE BORDER CELLPADDING=20>(Se omite el resto de las etiquetas de la tabla)

Con lo que se obtiene:

Se puede combinar este atributo con CELLSPACING. Por ejemplo, una tabla con bordes de 5 de espesor, separación entre celdas de 15 y separación del contenido con respecto a los bordes de las celdas de 20, lo obtendríamos con:

<TABLE BORDER=5 CELLSPACING=15 CELLPADDING=20>

fila1-celda1 fila1-celda2

fila2-celda1 fila2-celda2

Page 177: Usos Pedagogicos de internet

177Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

(Se omite el resto de las etiquetas de la tabla)Con lo que se obtiene:

fila1-celda1 fila1-celda2

fila2-celda1 fila2-celda2

TALLERHACIENDO TABLAS EN HTML

Siga las siguientes instrucciones:1. Entrar al Bloc de Notas.2. Iniciar un nuevo documento de HTML con las etiquetas respectivas.3. Definir como título de la ventana: Haciendo una tabla.4. Definir un color de fondo para la página.5. Se va a crear un tabla con las siguientes características:

• Dimensióndelatabla:2columnas–7filas• Elbordedelatablatieneunvalorde3.• Escojaunaseparaciónentreceldas.• Escojatambiénlaseparaciónentreelbordeyelcontenidodelasceldas.• Títulodelatabla:ElementosqueserequierenparaconectarseaInternet.• Lacelda1vaexpandidaencolumnaocupando4filas.• Lacelda9vaexpandidaencolumnaocupando3filas.• Latablatieneuncolordefondoclaro.• Lasceldas1y9tienenuncolordefondoclarodiferente.• Elcontenidodelasceldasvaalineadoalaizquierda,yeselsiguiente:

ELEMENTOS PARA CONECTARSE A INTERNET

HARDWARE

FAXMÓDEMENRUTADORESLÍNEA TELEFÓNICACABLES

SOFTWARENAVEGADORDE REDESPROTOCOLOS

Page 178: Usos Pedagogicos de internet

178Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

6. Guardar el archivo como EJERCICIO8.HTM.7. Observar el resultado en el navegador. Si no es el que se esperaba, revisar y corregir el código fuente.

Aunque tanto las imágenes como los vínculos ya se habían trabajado anteriormente, a continuación se explica todo lo relacionado con estas etiquetas.

Enlaces o hipervínculos.

La característica que más ha influido en el espectacular éxito de la web ha sido, aparte la de su carácter multimedia, la posibilidad de unir los distintos documentos repartidos por todo el mundo por medio de enlaces hipertexto.

Estructura de las etiquetas de enlaces

En general, los enlaces tienen la siguiente estructura:

<A HREF=”xxx”> yyy </A>

xxx es el destino del enlace que va dado en comillas.yyy es el texto indicativo en la pantalla del enlace, con un color especial y generalmente subrayado.

Tipos de enlaces

Se identifican cuatro tipos de enlaces:

1. Enlaces dentro de la misma página 2. Enlaces con otra página nuestra 3. Enlaces con una página fuera de nuestro sistema 4. Enlaces con una dirección de email

Enlaces dentro de la misma página

A veces, en el caso de documentos (o páginas) muy extensos, se puede requerir dar un salto desde una posición a otra determinada. En este caso, lo que antes se llamó XXX, es decir, el destino del enlace, en este caso el sitio dentro de la página al que se quiere saltar, se sustituye por #marca (la palabra marca puede ser cualquier palabra). Lo que se llamó antes YYY es la palabra (o palabras) que aparecerán en la pantalla en color (en forma de hipertexto). La estructura es, entonces:

<A HREF=”#marca”> YYY </A>

Page 179: Usos Pedagogicos de internet

179Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Y en el sitio exacto al que se va a saltar, se debe dar la siguiente etiqueta:

<A NAME=”marca”> </A>

Por ejemplo, si se necesita saltar desde aquí a la pantalla final se puede dar la siguiente etiqueta:

<A HREF=”#final”> Pulsa para ir al final</A>

Que resulta como: Pulsa para ir al final

Y en el final del documento se ha dado esta otra etiqueta:

<A NAME=”final”> </A>

Enlaces con otra página del mismo sitio.

Puede ser que la estructura del sitio esté definida en una sola página, pero lo más frecuente es que se tengan varias páginas, una inicial (o principal) y otras conectadas a ella o entre ellas mismas.

Si se quiere enlazar con la página creada en el Práctica 1, guardada como EJERCICIO1.HTM, simplemente se sustituye lo que se ha llamado XXX (el destino del enlace) por el nombre del archivo:

<A HREF=”EJERCICIO1.HTM”> Mi primer intento HTML</A>

Si quiere saltar a un sitio concreto de otra página del sitio en vez de ir al principio de la página, a donde va por defecto, en ese sitio se debe colocar una marca y completar el enlace con la referencia a esa marca, como se vio anteriormente.

Por ejemplo, si dentro de un sitio A y estando ubicado en una página B que se quiere vincular con otra C a un lugar concreto marcado X donde he puesto la marca <A NAME=”X”></A>, entonces la etiqueta tiene que ser: <A HREF=”C.HTM#X”>Página C</A>.

Una observación importante: La página en la que se está escribiendo la etiqueta y la otra página a la que se quiere saltar deben estar almacenadas dentro del mismo directorio. Porque si el sitio web está organizado con un directorio principal y otros subdirectorios auxiliares, y la página a la que se quiere saltar está, por ejemplo, en el subdirectorio subdir, entonces en la etiqueta tendría que haberse puesto “subdir/C.HTM”.

Y a la inversa, si se necesita saltar desde una página a otra que está en un directorio anterior, en la etiqueta se tendría que digitar “../C.HTMl”. Esos dos puntos hacen que el vínculo o enlace se dirija al directorio anterior. Se debe utilizar el símbolo / para indicar los subdirectorios, y no este otro \ que es propio únicamente de Windows.

Si se quieren evitar todas estas complicaciones, se puede tener todo junto en un único directorio, pero esto tiene el inconveniente de que esté todo más desordenado y sean más difíciles de hacer las futuras modificaciones.

Enlaces con una página fuera de nuestro sistema

Si se necesita enlazar con una página que esté fuera del sitio (es decir, que esté en un servidor distinto al que soporta el sitio), es necesario conocer su dirección completa o URL (Uniform Resource Locator). El URL podría ser, además de la dirección de una página del Web, una dirección de ftp, gopher, etc.

Una vez conocida la dirección (o URL) se digita en vez de lo que se ha llamado anteriormente xxx (el destino del enlace). Si se requiere enlazar con la página de GOOGLE (cuyo URL es: http://www.google.com/), la etiqueta sería:

<A HREF=”http://home.www.google.com/”>Página inicial de Google</A>

Page 180: Usos Pedagogicos de internet

180Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Es muy importante copiar estas direcciones correctamente, respetando las mayúsculas y minúsculas, pues algunos servidores sí las distinguen.

Enlaces con una dirección de correo electrónico

En este caso sustituimos lo que se ha llamado antes xxx (el destino del enlace) por mailto: seguido de la dirección del buzón. La estructura de la etiqueta es:

<A HREF=”mailto:dirección de email”>Texto del enlace </A>

Por ejemplo, si en un sitio se requiere recibir los comentarios de los visitantes e interesados, se definiría un vínculo al buzón que se destine como receptor de los comentarios.

Comentarios a:

<A HREF=”mailto: [email protected]”> Red Afectiva</A>

Que resultaría: Comentarios a Red Afectiva.

Pero hay algunos navegadores que no reconocen este tipo de enlace y lo verían de esta manera:

Comentarios a Red Afectiva

No tendrían ningún medio de conocer la dirección de email. Por lo tanto, es más seguro poner algo así como:

Comentarios a Red Afectiva en

<A HREF=”mailto: [email protected]”> [email protected]</A>

Que resulta:

Comentarios a Red Afectiva en [email protected]

Así, es conveniente poner también en el texto del enlace la dirección de email.

Page 181: Usos Pedagogicos de internet

181Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

TALLERHACIENDO ENLACES EN HTML

Siga las siguientes instrucciones:

1. Entrar al Bloc de Notas.2. Iniciar con las etiquetas del archivo HTML.3. Definir el título Uso de vínculos.4. Dar un color de fondo a la página.5. Digitar el texto: Mis vínculos favoritos, con alineación centrada y como cabecera H2.6. Usar un separador.7. A continuación y separando con <BR> o <P> relacionar las páginas que más se utilizan.8. Usar un separador.9. Luego, digitar el texto: Mis amigos por e-mail, con alineación centrada y como H2.10. Usar un separador.11. A continuación y separando con <BR> o <P> relacionar los nombres tres amigos y su respectivo

e-mail.12. Cerrar con un separador.13. Las líneas en el Bloc de Notas se podrían ver así:

<HTML> <HEAD> <TITLE>Uso de vínculos</TITLE> </HEAD> <BODY BGCOLOR=”00EEFF”> <CENTER> <H2> Mis v&iacutenculos favoritos</H2> </CENTER> <P> <HR> Estas son mis páginas favoritas: <P> <A HREF=”http://home.bogota.gov.co”>Bogotá</A> <BR> <A HREF=”http://www.redp.edu.co”>Red P</A> <BR> <A HREF=”http://postales.ya.com”>Postales </A> <HR> <CENTER> <H2>Buzones de mis amigos</H2> </CENTER> <P> <HR>

Page 182: Usos Pedagogicos de internet

182Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

<A HREF=”mailito:[email protected]”>Anibal Montes</A> <BR> <A HREF=”mailto:[email protected]”>Carlos Roa</A> <BR> <A HREF=”mailto:anaroa88”>Ana Roa</A> <HR> </BODY></HTML>14. Guardar el archivo como EJERCICIO9.HTM. Observarlo en el navegador y hacer ajustes en el código

si se requiere.

Imágenes

La etiqueta que sirve para incluir imágenes en las páginas del Web es muy similar a la de enlaces a otras páginas. La única diferencia es que, en lugar de indicar al programa navegador el nombre y la localización de un documento de texto HTML para que lo cargue, se indica el nombre y la localización de un archivo que contiene una imagen.

Estructura de la etiqueta de imágenes.

La estructura de la etiqueta es:

<IMG SRC=”imagen.gif”>

Con el comando IMG SRC (image source, fuente de la imagen) se indica que va a cargar una imagen llamada imagen.gif (o el nombre que tenga).

Dentro de la etiqueta se pueden añadir otros comandos o parámetros tales como ALT <IMG SRC=”imagen.gif” ALT=”descripción”>

ALT permite introducir una descripción (una palabra o una frase breve) indicativa de la imagen. Este comando, que en principio se puede omitir, se usa en beneficio de los que accedan a la página con un programa navegador en forma de texto solo; ya que no pueden ver la imagen, por lo menos pueden hacerse una idea sobre ella. Pero no es sólo por esto. Hay casos, como ya se vio anteriormente, en los que se utiliza una imagen como enlace a otra página, como fondo de la página o como fondo dentro de una tabla o celda. Si se omite este comando los que utilizan dichos navegadores no podrían de ninguna manera acceder a esas páginas.

Page 183: Usos Pedagogicos de internet

183Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Cómo deben ser las imágenes para que puedan ser utilizadas en HTML

Las imágenes deben estar guardadas en formatos de archivo especial llamados GIF (íconos y gráficos, que pueden ser transparentes o animados) o JPG (imágenes reales, que pueden ser paisajes, personas, entre otros.). Estos formatos almacenan las imágenes con un máximo de 256 colores, en forma comprimida.

Cómo se modifica la posición de la imagen con respecto al texto.

Para elegir la posición de la imagen con respecto al texto hay distintas posibilidades. La más sencilla es colocarla entre dos párrafos con un titular a un lado. Los navegadores, como el Netscape Navigator y el Microsoft Internet Explorer, permiten que el texto pueda rodear a la imagen.

La posición del titular con respecto a la imagen, si se requiere ponerle un titular, puede ponerse arriba, en medio o abajo del lado de la imagen. Para ello se añade el comando ALIGN a la etiqueta, de la siguiente manera:

<IMG SRC=”isla.gif” ALIGN=TOP> Titular alineado arriba

Titular alineado arriba

<IMG SRC=”isla.gif” ALIGN=MIDDLE> Titular alineado en medio

Titular alineado en medio

<IMG SRC=”isla.gif” ALIGN=BOTTOM> Titular alineado abajo

Titular alineado abajo

La imagen como enlace a otra página.

Para estos casos se utilizan generalmente imágenes pequeñas (iconos), aunque se puede usar cualquier tipo de imagen.

Según se vio anteriormente, la estructura general de un enlace es:

<A HREF=”xxx”> yyy </A>

Donde xxx era el destino del enlace, yyy el texto del enlace (o más generalmente hablando, lo que aparece en la pantalla como el enlace que en éste caso va a ser una imagen). En este caso se sustituye xxx por el nombre del archivo de la página a la que se necesita acceder y, en lugar de yyy, se digita la etiqueta completa de la imagen (que queda así englobada dentro de la etiqueta del enlace).

Por ejemplo, se quiere enlazar la imagen micasita.gif con el Ejercicio1:

<A HREF=”EJERCICIO1.HTM”><IMG SRC=”micasita.gif”></A>

Las imágenes aparecen rodeadas de un rectángulo del color normal en los enlaces. Si no se desea que aparezca ese rectángulo hay que incluir dentro de la etiqueta de la imagen el atributo BORDER=0, es decir:

<A HREF=”EJERCICIO1.HTM”><IMG SRC=”micasita.gif” BORDER=0></A>

Page 184: Usos Pedagogicos de internet

184Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Posicionando el cursor sobre esta última imagen se puede comprobar que actúa también como enlace aunque carezca del rectángulo de color. Esto puede resultar más estético, pero se corre el riesgo de que el usuario no se dé cuenta de que la imagen sirve de enlace.

La imagen como enlace con otra imagen.

En este caso se sustituye el xxx (el destino del enlace) con el nombre del archivo de la imagen a la que se quiere acceder y el yyy (lo que aparece en pantalla como el enlace) por la etiqueta completa de la imagen que se quiere que aparezca en la pantalla como el enlace de la otra.

Si se necesita enlazar la imagen caritafeliz.gif con la imagen micasita.gif

<A HREF=”micasita”><IMG SRC=”caritafeliz.gif”></A>

• Enlazaruntextoconunaimagen.

En este caso se reemplaza xxx (el destino del enlace) con el nombre del archivo de la imagen a la que se quiere acceder, se reemplaza yyy (lo que aparece en pantalla como el enlace) por el texto.

Para vincular la imagen micasita.gif al texto: Esta es mi casa, se digita:

<A HREF=”micasita”> Esta es mi casa</A>

TALLER

Siga las siguientes instrucciones

1. Entrar a la página www.entrebits.com/gifs_animados2. Esta página ofrece imágenes para descargar. Seleccionar una categoría, por ejemplo: Gente – Personas

y recorrer la lista de imágenes animadas que están disponibles.3. Seleccionar una imagen y dar clic en Descargar imagen…. La página informa el tamaño del archivo y

muestra sólo la imagen seleccionada4. Dar clic derecho apuntando a la imagen y seleccionar Guardar como… 5. Escoger ahora otra imagen y descargarla.6. Es importante recordar que es más fácil al programar contar con los archivos de imágenes en la misma

carpeta donde se encuentran los archivos HTML.7. Entrar al Bloc de Notas e iniciar con las etiquetas del archivo HTML.8. Definir el título Uso de Imágenes.9. Dar un color de fondo a la página.

Page 185: Usos Pedagogicos de internet

185Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

10. Presentar una de las imágenes con el texto: “Imagen animada”, alineado arriba, en medio y abajo.11. Usar un separador.12. Enlazar la otra imagen a la página creada en la práctica anterior EJERCICIO9.HTM13. Usar un separador.14. Para este ejemplo se descargaron las imágenes persona23.gif y persona27.gif y se guardaron en la

carpeta EJERCICIOS HTML del escritorio.

En la ventana del Bloc de Notas se podrá ver:

<HTML> <HEAD> <TITLE>Uso de vínculos</TITLE> </HEAD> <BODY BGCOLOR=”EEEEFF”> <CENTER> <H3> Texto alineado con respecto a la imagen</H3> </CENTER> <P> <HR> <IMG SRC=”persona23.gif” ALIGN=TOP> El texto va arriba <IMG SRC=”persona23.gif” ALIGN=MIDDLE> El texto va en medio <IMG SRC=”persona23.gif” ALIGN=BOTTOM> El texto va abajo <P> <HR> <CENTER> <H3>Imagen que vincula a una página</H3> </CENTER> <P><A HREF=”EJERCICIO9.HTMl”><IMG SRC=”persona27.gif” BORDER=0></A> <P> <HR> </BODY></HTML>• GuardarelarchivocomoEJERCICIO10.HTM.Observarloenelnavegadoryhacerajustesenelcódigo

si se requiere.

Frames

¿Qué es un frame?

Frames (en inglés, marcos o cuadros) es un procedimiento del lenguaje HTML para dividir la pantalla en diferentes zonas, o ventanas, que pueden actuar independientemente unas de otras como si se trataran de páginas

Page 186: Usos Pedagogicos de internet

186Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

diferentes, pues incluso cada una de ellas pueden tener sus propias barras de desplazamiento.

Características de un frame.

Un frame tiene características de distribución (filas o columnas), tamaño (porcentaje que ocupa dentro de la pantalla) y contenido, las cuales son definidas por el usuario en el momento de diseñar la página.

Una de sus características más importantes es que pulsando un enlace situado en un frame se puede cargar en otro frame una página determinada. Esto se utiliza frecuentemente para tener un frame estrecho en la parte lateral (o superior) con un índice del contenido en forma de diferentes enlaces que, al ser pulsados, cargan en la ventana principal las distintas páginas. De esta manera se facilita la navegación entre las páginas, pues aunque se vaya pasando de unas a otras siempre estará a la vista el índice del conjunto.

Para comprender los distintos conceptos se va a desarrollar un ejemplo creando una página con dos frames. El de la izquierda va a servir de índice de lo que se vea en el de la derecha y en éste se verá inicialmente una página de presentación. Se podrá acceder también aquí a las páginas que se crearon en las prácticas anteriores dando clic en un enlace en el frame de la izquierda.

Etiquetas y atributos de un frame.

La etiqueta para definir frames es <FRAMESET>, la cual se define con los parámetros COLS=”n%, m%, …”, si se quiere que la distribución de los frames sea en columnas o ROWS=”n%, m%, ” si se quiere que sean filas.

El “n%, m%, …” corresponde al porcentaje que ocuparan los frames en la pantalla, el cual se da entre comillas. Si son varias columnas o filas, los porcentajes se darán separados por coma dentro de las comillas.

Por ejemplo, para definir tres columnas con porcentajes de 25%, 50% y 25%, se digitaría:

<FRAMESET COLS=”25%,50%,25%”>

El n%, m% puede cambiarse por un número absoluto “n, m, …” que representa el número de píxeles que ocupará cada frame, pero usar esta opción puede ocasionar dificultades al usuario con diferentes tamaños de monitor.

<FRAMESET COLS=”100,200”>

Este valor “n, m, …” puede ser también un valor relativo que se define digitando un asterisco (*) en vez de un número. Esto se interpreta como que ese frame debe tener el espacio restante.

Por ejemplo:

<FRAMESET ROWS=”100,*,100”>

Habrá tres filas, la superior y la inferior de una altura fija de 100 píxeles y la del medio obtendrá el espacio restante.

Si hay más de un frame con asterisco, ese espacio restante se dividirá por igual entre ellos.

Si hay un número antes del asterisco ese frame obtiene esa cantidad más de espacio relativo. Así “2*,*” daría dos tercios para el primer frame y un tercio para el otro.

FRAMESET también puede trabajar con el parámetro FRAMEBORDER=0 el cual elimina el borde que separa cada frame.

• Adicionalmente,existelaetiquetaFRAME,quecon el parámetro SCR=”dirección” permite definir el contenido de cada frame. Por ejemplo, si el primer frame tiene como contenido la práctica 10, se digitaría:

<FRAME SCR=”EJERCICIO9.HTM”>

Page 187: Usos Pedagogicos de internet

187Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

El orden en que se defina el contenido de los frames es el orden en que quedarán en la pantalla. Con distribución en columnas irá de izquierda a derecha y si es en filas irá de arriba hacia abajo.

Con en el atributo NAME=”nombre de la ventana”, se permite dar un nombre a cada frame. Por ejemplo, si al frame se le va a definir el nombre LISTA, la línea de código sería:

<FRAME SCR=”EJERCICIO9.HTM” NAME=”LISTA”>

Otros atributos de FRAME son:

MARGINWIDTH=”n”. Se utiliza este atributo cuando se quiere controlar el ancho de los márgenes dentro de un frame. El número que se ponga representa los píxeles de los márgenes. Este atributo es opcional.

MARGINHEIGHT=”número”. Igual que el anterior, pero referido a los márgenes en altura.

SCROLLING=”yes|no|auto”. Se utiliza para decidir si el frame tendrá o no una barra de desplazamiento. Si se escoge “yes” tendrá siempre una barra de desplazamiento. Si se escoge “no” no la tendrá nunca, y si se escoge “auto” será el navegador quien decida si la tendrá o no. Este atributo es opcional. Su valor por defecto es “auto”.

NORESIZE. Es un indicador para que la ventana no se pueda re-dimensionar (en inglés, resize) por parte del usuario. Lo que se quiere es que al colocar el puntero del mouse entre los dos frames, al dar clic y arrastrarlo en un sentido u otro no varían las dimensiones prefijadas de los frames. Este atributo impide que ocurra esto en un frame. Es un atributo opcional. Por defecto, todos los frames son re-dimensionables.

FRAMEBORDER=”no”. Este atributo elimina el borde en un frame, pero si se quiere que se elimine completamente también hay que ponérselo al frame contiguo. Si se quiere eliminar los bordes de todos los

frames se debe colocar en la etiqueta FRAMESET.

TARGET=”nombre del otro frame”. Permite definir que los enlaces situados en un frame surtan efecto en otro frame.

TARGET=”_blank”. Hace que se abra una nueva copia del navegador y el enlace activado se carga en ella, a pantalla completa. Es decir, tendríamos dos copias del navegador funcionando a la vez.

TARGET=”_self”. Hace que el enlace se cargue en el propio frame.

TARGET=”_top”. Hace que el enlace se cargue a pantalla completa suprimiendo todos los frames, pero sin que se cargue una nueva copia del navegador. Este es particularmente útil. Un error muy común es olvidarse de poner este atributo en los enlaces que están en un frame, con lo que resulta que al ser activados la página llamada se carga dentro del propio frame, lo cual es muy molesto si esa página pertenece a otro sitio del Web y aún más grave si esa página tiene a su vez frames. Este inconveniente se evita poniendo este atributo dentro de las etiquetas de los enlaces.

Definición de los frames.

Primero se creará un documento HTML en el que se definirá cuántas zonas va a haber, qué distribución y tamaño van a tener y cuál va ser el contenido de cada una de ellas.

En el ejemplo que se va a desarrollar, la página va a tener dos frames distribuidos en columnas (es decir, uno al lado del otro, en cambio de uno encima del otro, lo que sería una distribución en filas).

Con respecto al tamaño, se hará que el primero (el del izquierda) ocupe el 20% del ancho de la pantalla y el otro el 80% restante. Y con respecto al contenido, el frame de la izquierda va a contener un documento HTML que va a servir de índice de lo que se vea en el otro (y que se va a llamar MIPAGIND.HTM),

Page 188: Usos Pedagogicos de internet

188Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

y el de la derecha otro documento HTML que va a servir de página de presentación (al que llamaremos MIPAGPRE.HTM).

Todo lo anterior se refleja en el siguiente documento HTML:

<HTML><HEAD><TITLE>Uso de frames</TITLE></HEAD><FRAMESET COLS=”20%, 80%”><FRAME SRC=”MIPAGIND.HTM”><FRAME SRC=”MIPAGPRE.HTM” NAME=”Principal”></FRAMESET></HTML>

Al analizar las líneas de código, se observa lo siguiente:

• Esundocumentoparecidoalosquesehantrabajado antes. La diferencia está en que en vez de utilizar la etiqueta BODY, que sirve normalmente para delimitar lo que se va a ver en la pantalla, se hace uso de la etiqueta FRAMESET (definir los frames).

• En este caso, con la etiqueta <FRAMESETCOLS=”20%, 80%”> se define que va a haber dos frames y que van a ir en columnas, una ocupando el 20% y la otra el 80% de la pantalla.

• Despuésdedefinirelnúmerodeframes,sudistribución y su tamaño, se define el contenido de cada frame. Esto se hace con las etiquetas:

<FRAME SRC=”MIPAGIND.HTM”><FRAME SRC=”MIPAGPRE.HTM”

NAME=”Principal”> El contenido del primer frame (el de la izquierda)

será el documento HTML MIPAGIND.HTM y el del segundo (el de la derecha) sea el documento HTML MIPAGPRE.HTM.

• Obsérvesequeenlaetiquetadelsegundosehaincluido el atributo NAME=”Principal”, pero no así en el primero. El motivo es que se necesita

dar un nombre al segundo frame pues, para este ejemplo, en el documento del primer frame se incluirán unos enlaces que van a ir dirigidos hacia él.

• GuardarestearchivocomoEJERCICIO11.HTM

Documentos HTML de cada frame.

Ahora se requiere confeccionar el documento HTML de cada uno de los frames. Es necesario recordar que son como páginas independientes que pueden tener cada una sus propias características y se puede añadir lo que se haya aprendido hasta ahora.

Documento del frame de la izquierda

Va a tener un fondo amarillo y va a contener dos enlaces dirigidos al frame de la derecha. Además, como muestra de que se puede añadir cualquier cosa en un frame, se va incluir el siguiente gif animado (persona23.gif ):

<HTML><HEAD><TITLE> Indice </TITLE></HEAD> <BODY BGCOLOR=”#FFBB00”><P><A HREF=”MIPAGPRE.HTM” TARGET=”Principal”> Presentación </A><P><A HREF=”EJERCICIO9.HTM” TARGET=”Principal”> Ejercicio 10 </A><P><IMG SRC=”persona23.gif”> </BODY></HTML>

Dentro de las etiquetas de los enlaces se puede observar algo nuevo y es el atributo TARGET (en inglés: objetivo, blanco), que sirve para hacer que al ser activado el enlace no se cargue en el propio frame sino en otro, precisamente en el que se ha llamado con ese nombre en el documento de definición de los frames.

Page 189: Usos Pedagogicos de internet

189Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

En este caso se le ha dado el nombre de “Principal” al frame de la derecha y es ahí donde se van a cargar los documentos HTML.

Guardar este documento con el nombre de MIPAGIND.HTM. Además, la imagen que se capturó persona23.gif se guarda con el documento.

Documento del frame de la derecha

Para este frame se va a definir un fondo negro y va a contener solamente un texto. Luego, en el taller de este tema se pueden definir otros objetos dentro de este frame.

Las líneas en HTML serían:

<HTML><HEAD> <TITLE> Presentacion </TITLE></HEAD><BODY BGCOLOR=”#000000” TEXT=”#0000FF”> <CENTER><FONT SIZE=+3> <STRONG><P> ESTE ES EL SEGUNDO FRAME <BR> <FONT COLOR=”#FF0000”> DE LA PAGINA</FONT> <BR> USO DE FRAMES </STRONG></FONT></CENTER></BODY></HTML>

Guardar este documento con el nombre de MIPAGPRE.HTM.

Frames anidados dentro de otros frames.

Existe la posibilidad de tener una distribución de los frames en filas y en columnas a la vez.

Estas distribuciones pueden ser complejas y se logran anidando filas dentro de una columna o a la inversa,

columnas dentro de una fila.

Por ejemplo, si se requiere la siguiente distribución: • Unframeestrechoenhorizontalenlaparte

superior, de lado a lado de la pantalla (altura, el 15%)

• Otro frame estrecho en vertical en la parteizquierda, debajo del anterior (anchura, el 20%)

• Unterceroocupandoelrestodelapantalla.

En realidad, esto equivale a la siguiente distribución:• Dosfilas.Lasuperiorocupael15%ylainferiorel

resto. • Lafila inferiorestáa suvezdivididaendos

columnas. La primera (la de la izquierda) ocupa el 20% y la otra, el resto.

El documento de HTML para la definición, primero de las dos filas, sería:

<HTML> <HEAD> <TITLE>Pagina con dos filas</TITLE> </HEAD> <FRAMESET ROWS=”15%, *”> <FRAME SRC=”documento_fila_superior”> <FRAME SRC=”documento_fila_inferior”> </FRAMESET></HTML>

Como la fila inferior, en realidad, son dos columnas (con una distribución del 20% y resto), se sustituye (anidando) la etiqueta <FRAME SRC=”documento_fila_inferior”> por:

<FRAMESET COLS=”20%, *”> <FRAME SRC=”documento_columna_izquierda”> <FRAME SRC=”documento_columna_derecha”></FRAMESET>

Con lo que queda el documento definitivo así:

Page 190: Usos Pedagogicos de internet

190Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

<HTML> <HEAD> <TITLE>Pagina con fila superior y dos columnas inferiores</TITLE> </HEAD> SRC=”documento_fila_superior”> <FRAMESET COLS=”20%, *”> <FRAME SRC=”documento_columna_izqda”> <FRAME SRC=”documento_columna_dcha”> </FRAMESET> </FRAMESET></HTML>.

TALLER

• Tomarelcódigoquesedioanteriormenteparaladefinicióndeframesanidadosydefinirunadirecciónpagina para cada frame.

• Lalíneasdecódigosepodránverasí:<HTML> <HEAD> <TITLE>Pagina con fila superior y dos columnas inferiores</TITLE> </HEAD> <FRAMESET ROWS=”15%, *”> <FRAME SRC=”EJERCICIO1.HTM”> <FRAMESET COLS=”20%, *”> <FRAME SRC=”EJERCICIO2.HTM”> <FRAME SRC=”EJERCICIO3.HTM”> </FRAMESET> </FRAMESET></HTML>• GuardarcomoEJERCICIO12.HTM

TALLERSOBRE EL HTML

El propósito de este taller es que los participantes apliquen las etiquetas de HTML vistas hasta este momento diseñando un sitio web de carácter institucional. Debe ser, en principio, un diseño muy sencillo, teniendo en cuenta que con las herramientas aprendidas no se logra hacer algo muy sofisticado. (Para eso se utilizará más adelante el Dreamweaver).

Page 191: Usos Pedagogicos de internet

191Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Puede realizarse en grupo (máximo tres personas).

1. Diseñar en papel el bosquejo general del sitio web que se quiere.2. Para este taller se trabajará sólo en una página de contenido. En papel diseñe la página. Una vez

revisado y aprobado el diseño, comience con el Bloc de notas.3. Tenga presente utilizar las diferentes etiquetas aprendidas.4. Para guardar su archivo cree primero una carpeta, puede ser con el nombre PAGINA WEB

INSTITUCIONAL o el que usted prefiera, y allí guarde su archivo. Recuerde que debe guardar ahí también las imágenes y fondos que requiera utilizar.

5. Si lo considera importante, por usar frames o vínculos a páginas que se crearán más adelante, cree páginas elementales (con caracteres básicos y textos que permitan controlar que todo sale bien) para que el frame o el vínculo no queden apuntando al vacío.

6. Cuando termine responda las siguientes preguntas:• ¿Cómolefuediseñadoelsitio?• ¿Cómolefuecreandoelcódigo?• ¿Legustóelresultado?• ¿Consideraqueelresultadoobtenidoesloqueesperaba.• ¿Consideraquepuedemejorarlosresultados?• ¿Cómofuelaexperienciaanivelpersonal?¿Sesintiócómododesarrollandoeltaller?¿Creeque

aprendió lo suficiente o necesita aprender más?

Formularios

¿Por qué se requiere el uso de formularios?

La manera general para que los lectores de una página se puedan comunicar con el propietario de la página es por medio de un enlace a una dirección de email con lo que se recibiría un email convencional.

Pero puede ser que lo que se necesite sea una respuesta concreta a unas opciones que se presentan o un comentario del usuario, para lo que sea necesario suministrarle un espacio en donde introducirlo.

Se puede hacer todo esto, además de otras cosas, utilizando los formularios con los que se pueden confeccionar páginas que contengan los elementos necesarios para ello, tal como botones de radio, listas de selección, cuadros de introducción de texto y de control, etc.

Los formularios permiten que los visitantes de la página envíen la información directamente o bien al servidor en donde hemos instalado un programa que procese esta información.

Por ejemplo, si se requiere crear una lista de correo los usuarios pueden introducir sus nombres y direcciones de e-mail y pulsar un botón de envío.

Page 192: Usos Pedagogicos de internet

192Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Esos datos se pueden recibir “en bruto” en el correo y luego se elaboraría manualmente la lista de correo, sin necesitar ningún programa para ello.

La otra posibilidad es instalar en el servidor en el que reside la página un programa especial para procesar esos datos y añadirlos a la lista de correo, y que incluso que pueda devolver automáticamente al usuario algún tipo de información, por ejemplo de verificación de los datos recibidos. Esto se consigue a través de la construcción de formularios los cuales permiten capturar y registrar los datos necesarios. Los formularios necesitan ejecutar programas o scripts por medio del CGI (Common Gateway Interface). El CGI permite a los formularios ser procesados por programas escritos en cualquier lenguaje, aunque los más usados en Internet son el Perl y el C.

El tipo de formulario que se describe a continuación podrá ser utilizado por la mayoría de los navegadores, con la notable excepción del Explorer (incluso la versión 3.0), por lo que es conveniente suministrar al final del formulario, como una alternativa para estos casos, un enlace de e-mail ordinario.

¿Cómo es la estructura de un formulario?

La estructura general de un formulario es:

1. Etiqueta de inicio: <FORM ACTION=mailto:dirección_de_email

METHOD=”POST” ENCTYPE=”TEXT/PLAIN”>

2. Cuerpo del formulario con los distintos elementos para poder introducir los datos.

3. Botones de envío y de borrado. 4. Etiqueta de cierre </FORM>

Etiqueta de inicio

El atributo ACTION indica la acción que se debe efectuar, en este caso, que los datos sean enviados por e-mail a la dirección indicada. (Si se usara un CGI sería aquí donde se indicaría la localización en el

servidor, que habitualmente es el directorio cgi-bin, para que procese los datos).

El atributo METHOD=POST indica que los datos sean inmediatamente enviados por correo a la dirección de e-mail, sólo se requiere que el usuario pulse en el botón de envío.

Con el atributo ENCTYPE=”TEXT/PLAIN” se consigue que las respuestas las recibamos como un archivo de texto, perfectamente legible y sin codificar.

Elementos para introducir los datos

Los elementos para introducir datos que se incluyen en el formulario son cuadros de texto, menús y botones de selección.

La introducción de los datos se consigue por medio de la etiqueta:

<INPUT TYPE=”xxx” NAME=”yyy” VALUE=”zzz”>

En donde:

xxx es la palabra que indica el tipo de introducción. yyy es el nombre que le asignamos nosotros a la variable de introducción del dato. zzz es la palabra asociada a un elemento.

Introducción por medio de texto (una línea)

En este caso es xxx=text, es decir, INPUT TYPE=”text”. El atributo VALUE no procede en este caso.

En este ejemplo, se solicita el apellido del usuario:

<FORM ACTION=mailto:[email protected] METHOD=”POST” ENCTYPE=”TEXT/PLAIN”> Escribe tu apellido: <BR>

Page 193: Usos Pedagogicos de internet

193Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

<INPUT TYPE=”text” NAME=”Apellido”> </FORM>

Que resulta:

Principio del formulario

Escribe tu apellido:

Final del formulario

Si el usuario introduce su apellido, p. ej. Ruiz, y pulsa el botón de envío (que verá más adelante), el buzón de e-mail recibirá un mensaje con siguiente texto:

Apellido=Ruiz

La longitud de este formulario es por defecto de 20 caracteres. Se puede variar incluyendo en la etiqueta el atributo SIZE=”número”.

Si no se indica la longitud el usuario puede introducir el número de caracteres que quiera. Se puede limitar esto incluyendo en la etiqueta el atributo MAXLENGTH=”número”.

En el ejemplo anterior, si se hubiera cambiado la etiqueta correspondiente por:

<INPUT TYPE=”text” NAME=”Apellido” SIZE=”10”

MAXLENGTH=”12”>

Se puede comprobar que no se pueden introducir más de 12 caracteres.

También se puede hacer que el texto introducido no sea reconocible (como cuando se da la contraseña de acceso a un buzón de e-mail), es decir, que todos

los caracteres se visualicen por asteriscos. Basta con cambiar en la etiqueta INPUT TYPE=”text” por INPUT TYPE=”password”. En el último ejemplo, la etiqueta correspondiente sería:

<INPUT TYPE=”password” NAME=”Apellido” SIZE=”10”

MAXLENGTH=”12”>

Introducción por medio de texto (múltiples líneas)

Cuando el texto a introducir puede alcanzar una gran longitud, por ejemplo un comentario, es conveniente utilizar un formulario de texto de múltiples líneas.

Esto se consigue con la etiqueta de inicio:

<TEXTAREA NAME=”yyy” ROWS=”número” COLS=”número”>

</TEXTAREA>

(Aquí no se utiliza INPUT TYPE sino ROWS, que representa el número de filas y COLS el de columnas).

Ejemplo, un formulario solicitando los comentarios del usuario:

<FORM ACTION=mailto:[email protected] METHOD=”POST” ENCTYPE=”TEXT/PLAIN”> Introduce tus comentarios: <BR> <TEXTAREA NAME=”Comentarios” ROWS=”6” COLS=”40”> </TEXTAREA> </FORM>

Page 194: Usos Pedagogicos de internet

194Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Que resulta:

Principio del formulario

Introduce tus comentarios:

Final del formulario

Es necesario tener claro que el salto de línea del texto introducido no se efectúa automáticamente.

Una vez que el usuario haya escrito sus comentarios dentro del formulario y haya pulsado el botón de envío, se recibirá un e-mail suyo con el siguiente texto:

Comentarios=Bla bla bla...

Introducción por medio de menús.

Si se requiere que el usuario en lugar de introducir un texto escoja entre varias opciones que se le presente, se define formulario en forma de menú.

Se consigue con la etiqueta de inicio <SELECT NAME=”yyy”> y la de cierre </SELECT>. Las distintas opciones a escoger se consiguen con la etiqueta <OPTION>.

Ejemplo: Se solicita al usuario que elija su color preferido:

<FORM ACTION=mailto:[email protected] METHOD=”POST” ENCTYPE=”TEXT/PLAIN”> Cuál es tu color preferido? <BR> <SELECT NAME=”ColorPreferido”> <OPTION>Rojo <OPTION>Verde <OPTION>Azul <OPTION>Amarillo </SELECT > </FORM>

Que resulta:

Principio del formulario

Cuál es tu color preferido?

Final del formulario

Si el usuario escoge Azul y ha pulsado el botón de envío se recibe un e-mail suyo con el texto: ColorPreferido=Azul

En el ejemplo anterior, sólo es visible en el formulario una opción. Si se quiere que sean visibles múltiples opciones a la vez se agrega en la etiqueta los atributos MULTIPLE SIZE=”número”, con lo que se especifica el número de opciones visibles.

Si en el ejemplo anterior se cambia la etiqueta correspondiente se digitará:

<SELECT NAME=”ColorPreferido” MULTIPLE SIZE=”2”>

Formulario de confirmación (checkbox)

Para que el usuario confirme una opción determinada se puede hacer uso de un formulario de confirmación,

Page 195: Usos Pedagogicos de internet

195Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

o checkbox, que se consigue con la etiqueta:

<INPUT TYPE=”checkbox” NAME=”yyy”>

Ejemplo: Se solicita al usuario que confirme su inclusión en una lista de correo:

<FORM ACTION=mailto:[email protected] METHOD=”POST” ENCTYPE=”TEXT/PLAIN”> <INPUT TYPE=”checkbox” NAME=”Lista”> Sí, deseo ser incluido en la lista de correo. </FORM>

Que resulta: Principio del formulario

Sí deseo ser incluido en la lista de correo.

Final del formulario

Si el usuario marca este formulario y pulsa el botón de envío, se recibe un e-mail suyo con el texto: Lista=On.

Si se quiere que el formulario aparezca inicialmente como marcado (el usuario no necesitará hacerlo), basta con añadir el atributo CHECKED dentro de la etiqueta.

En el ejemplo anterior sería:

<INPUT TYPE=”checkbox” NAME=”Lista” CHECKED>

Botones de radio

Cuando se quiere que el usuario elija una única opción entre varias se hace uso de los botones de radio, que se consiguen con la etiqueta:

<INPUT TYPE=”radio” NAME=”yyy” VALUE=”zzz”>

Donde yyy es el nombre de la variable que se trata de elegir y zzz es el nombre de cada una de las opciones en concreto.

Ejemplo: se solicita al usuario que defina cuál es su sistema operativo preferido:

<FORM ACTION=mailto:[email protected] METHOD=”POST” ENCTYPE=”TEXT/PLAIN”> Cuál es tu sistema operativo preferido? <BR> <INPUT TYPE=”radio” NAME=”SistemaOperativo” VALUE=”Win” CHECKED> PC <INPUT TYPE=”radio” NAME=”SistemaOperativo” VALUE=”Mac”> Mac <INPUT TYPE=”radio” NAME=”SistemaOperativo” VALUE=”Unix”> Unix </FORM>

Que resulta:

Principio del formulario

Cuál es tu sistema operativo preferido?PC Mac Unix

Final del formulario

El atributo opcional CHECKED que se ha añadido en la primera etiqueta hace que la opción Win aparece marcada por defecto. No es posible escoger más de una opción.

Page 196: Usos Pedagogicos de internet

196Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Si el usuario ha escogido otra opción y pulsa el botón de envío el e-mail que se recibe es con el texto: SistemaOperativo=Mac.

Botones de envío y de borrado.

Un elemento esencial en cualquier formulario es el botón de envío de los datos que se consigue con la etiqueta:

<INPUT TYPE=”submit” VALUE=”zzz”>En donde zzz es el texto que aparecerá en el botón.

Si se añade al primer ejemplo, en el que se solicitaba el apellido del usuario, las líneas de código serían:

<FORM ACTION=”mailto:dirección_de_email” METHOD=”POST” ENCTYPE=”TEXT/PLAIN”>Escribe tu apellido: <BR><INPUT TYPE=”text” NAME=”Apellido”> <P><INPUT TYPE=”submit” VALUE=”Enviar datos”> </FORM>

Que resulta:

Principio del formulario Escribe tu apellido:

Final del formulario

Otro botón necesario es el de borrado de los datos introducidos. Es conveniente en un formulario con muchos elementos. Es muy similar al de envío pues se consigue con la etiqueta:

<INPUT TYPE=”reset” VALUE=”zzz”>

En donde zzz es el texto que aparecerá en el botón.

Al añadir la etiqueta al ejemplo anterior quedaría:

<P><INPUT TYPE=”reset” VALUE=”Restablecer”>

El resultado es: Principio del formulario Escribe tu apellido:

Final del formulario

Se puede comprobar su funcionamiento escribiendo algo en el formulario y pulsando luego el botón de borrado.

DISEÑO DE LA INTERFAZ GRÁFICA

¿Qué es una interfaz gráfica?

La interfaz gráfica es la parte visible de un programa. Es la plataforma que permite la conexión y comunicación con el usuario. Una interfaz es la que ofrece toda la funcionalidad de un programa de una manera comprensible y fácil de usar. Presenta la información de forma agradable y clara.

La interfaz gráfica de usuario (GUI), surge como evolución de la línea de comandos de los primeros sistemas operativos y es pieza fundamental en un entorno gráfico, es un método para facilitar la interacción del usuario con el computador a través de la utilización de un conjunto de imágenes y objetos pictóricos (íconos, ventanas, etc.) además de texto.

¿Qué se debe tener en cuenta al diseñar una interfaz gráfica?

El diseño final de la interfaz gráfica depende de la naturaleza del sitio propuesto.

Page 197: Usos Pedagogicos de internet

197Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Al momento de diseñar una interfaz gráfica se pueden tener en cuenta las siguientes consideraciones60:• Necesidadesdelusuario• Necesidadesdelosdesarrolladores• Eldiseño

Dreamweaver

Existe una amplia y variada gama de programas especializados en el diseño de la interfaz gráfica, muchos de ellos incluyen la posibilidad de crear objetos de diverso tipo y formato, e imágenes con animación.

Para este caso particular se utilizará Dreamweaver MX2004 de Macromedia, herramienta flexible y versátil que permite, con un alto grado de satisfacción, llevar a cabo el diseño de la interfaz y, en general, de las páginas y el sitio que se ha planteado.

Dreamweaver es un programa muy sencillo e intuitivo que puede ser utilizado a muchos niveles. Desde el más básico, suficiente para crear una pagina personal de un usuario novato, hasta gestionar todo un sitio empresarial con un contenido de cientos de páginas.

¿Cómo es la ventana de Dreamweaver MX 2004?

60 INTERFAZ GRÁFICA. .http://www.bibliodgsca.unam.mx/tesis/tes7cllg/toc.htm

Page 198: Usos Pedagogicos de internet

198Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

En esta ventana se encuentran las partes características de una ventana del ambiente Windows. Debajo de la barra de título se encuentra la barra de Menú y en ella el acceso a todas las funciones que ofrece DREAMWEAVER.

Debajo de la barra de Menú está la barra de los grupos de paneles, la cual es contextual, es decir, que va cambiando dinámicamente según la tarea que se esté realizando.

En el centro de la pantalla está la pantalla de inicio. Se pueden distinguir tres zonas distintas.

• Enlazonadelaizquierdaseencuentralalistadelosdocumentosusados más recientemente y ofrece la opción de abrir cualquiera de ellos rápidamente seleccionándolos con un clic.

• Enlazonacentralsepuedecrearunnuevodocumentoenblancoencualquiera de los formatos mostrados.

• Enlazonadeladerecha,Dreamweaverpermiteutilizarunasplantillasde ejemplos para crear documentos de una manera rápida y sencilla.

• EnlapartederechaeinferiordelaventanadeDreamweaverseencuentran otros paneles y funciones.

Ventana del Documento.

Al seleccionar Crear nuevo > HTML se observará:

La barra del título del documento tiene los típicos controles de minimización, maximización y cerrar ventana. Esto es útil en el caso de que se tengan abiertos simultáneamente varios documentos.

Page 199: Usos Pedagogicos de internet

199Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

En la parte inferior derecha de la barra de estado se encuentran unos indicadores muy útiles. Con el de la derecha Dreamweaver indica el tamaño del documento en Kilo bites y el tiempo que un navegador estándar tardaría en visualizar completamente la página con una conexión telefónica a Internet.

Se puede elegir entre una lista de tamaños predeterminados. El tamaño óptimo depende de las dimensiones del monitor o pantalla en que se visualice la página. Dado que por ahora la mayoría de los usuarios de Internet tienen monitores de 800x600 píxeles, si se diseña una página con un tamaño superior puede suceder que las personas que quieran visualizar el sitio lo vean incorrectamente. Se debe tener muy presente que el objetivo la página es que sea vista por el mayor número posible de personas, por lo que no se deben poner trabas innecesarias a los visitantes.

Vistas de Edición

En el momento en el que se realiza el trabajo sobre la página Web es posible visualizar lo que se edita. En la barra de documentos en la esquina superior derecha se encuentran tres botones que modifican la vista de trabajo del documento. Estos corresponden a “Código”, “Dividir” y “Diseño”:

• En la vista “Código”, Dreamweaver muestrael código HTML de la página y permite editar directamente las instrucciones con las que el navegador del usuario mostrará la página.

• Enlavista“Diseño”Dreamweavermuestralapágina tal como se visualizará en el navegador del usuario, se puede editar sin necesidad de conocer el lenguaje HTML.

• Por último, la vista “Dividir” muestrasimultáneamente el código y la vista de diseño, de esta manera se pueden escribir instrucciones en lenguaje HTML en la página e instantáneamente

se puede comprobar como se visualizaría en un navegador.

De todas maneras, si se quiere ver en pantalla completa como se visualizaría la página se puede dar pulsar en el icono de Vista previa/Depurar en explorador.

Al seleccionar este icono Dreamweaver abrirá la ventana del navegador que tenga asociado por defecto y mostrará la página completa. En la ventana de Vista previa se puede detectar tanto los errores de diseño como los de código y directamente corregirlos en la aplicación de Dreamweaver sin tener que grabar y abrir el documento con cada prueba.

El Sitio: Introducción a la configuración de “El Sitio”.

Las páginas web tienen un contenido que puede formarse con diversos documentos que pueden ser desde otras páginas html, imágenes, scripts, animaciones, hasta cualquier tipo de objeto que se pueda vincular en una página HTML.

El conjunto de todos estos documentos que forman parte de la página y el conjunto de páginas que se enlazan se llama, en el lenguaje de las páginas web, un “Sitio” o “site” en ingles.

A continuación se va a explicar como diseñar un Sitio para albergar las páginas y sus elementos, de una forma sencilla y didáctica.

Todas las opciones de configuración están en el menú Sitio de la barra de menú.

1. Pulsando sobre el menú Sitio se despliega el menú. Para configurarlo por primera vez se escoge la opción Administrar sitios

2. Dreamweaver abre una ventana de diálogo con todas las opciones para administrar el sitio. Como aún no se ha creado ninguno, se escoge el botón Nuevo.

Page 200: Usos Pedagogicos de internet

200Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

3. Dreamweaver pregunta qué es lo que se quiere crear exactamente ¿un Sitio o un Servidor FTP y RDS? Se escoge Sitio.

4. La primera cuestión que Dreamweaver plantea es el nombre del sitio. Es muy útil que el nombre tenga una fuerte relación con el contenido de la página para poder recordarlo fácilmente.

5. Posteriormente, se preguntará sobre la tecnología con la que se va a trabajar. Como una página web puede enlazar documentos de muy diferentes tipos algunos de ellos son utilizados para intercambiar información con el servidor; en esta opción se elige el tipo documento dependiendo de las características del servidor con el que se esté trabajando.

Para el ejercicio que se está desarrollando no se van a utilizar las tecnologías de servidor así que se elegirá la opción “No”

6. El siguiente paso se relaciona con la forma de trabajar con los archivos durante la etapa de desarrollo; lo recomendado es seleccionar la opción de “Editar copias locales en mi equipo y luego cargarlas al servidor cuando estén listas”.

7. El paso que sigue, se relaciona con la forma en que se subirán las páginas que se creen al sitio de Internet. Por ahora, no se tratará este tema y por lo tanto se elegirá la opción Ninguno.

Con esto se acaba de proporcionarle a Dreamweaver la información necesaria para configurar un sitio y se confirman los datos de la definición.

8. En la pestaña de avanzado aparecen otras opciones relacionadas con la definición del sitio. Cuando se termine esta definición se selecciona el botón “Completado”.

Editar un Sitio.

1. Para adecuar un sitio a las necesidades de trabajo se debe acceder a la ventana de diálogo “Administrar sitios”.

2. Como ya se ha creado el sitio, para el ejemplo: “CursoDreamweaver” se selecciona el botón Editar.

3. En la ventana de diálogo se escoge la pestaña “Avanzadas” y, en el menú “Categoría”, la opción “Datos locales”

4. En la sección “Datos locales” se pueden cambiar y ajustar los valores del sitio, tales como “Nombre del sitio” o “Carpeta raíz local”; esto significa que se pueden designar manualmente la carpeta donde se van a situar las páginas que se van a crear y los documentos vinculados a ella.

5. Active el cuadro de opción “Actualizar lista archivos locales autom.” Así, cuando se modifique un archivo se actualizan automáticamente las carpetas locales durante las copias.

Page 201: Usos Pedagogicos de internet

201Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

6. Por último, con la opción “Carpeta predeterminada de imágenes” se le dice a Dreamweaver donde estarán agrupadas todas las imágenes con las que se trabajan, esto es muy útil y evita posteriores errores de vinculación.

7. En las demás opciones se configura la dirección HTTP del sitio, con lo que Dreamweaver detecta y distingue automáticamente las direcciones WWW de páginas internas al sitio, con lo que se ahorra tiempo al navegar.

8. Active la opción caché. Con ésta Dreamweaver actualiza y gestiona todos los cambios de las páginas y sus enlaces interiores automáticamente. Por ejemplo, si se cambia una imagen no se tiene que ir modificando una a una todas las páginas.

Opciones para administrar sitios

Las otras opciones que ayudarán a gestionar más fácilmente un sitio son: Duplicar, Quitar y Exportar.

• ConDuplicarseconsiguecrearunduplicadodelsitio que se tiene activo, con ello se logra duplicar totalmente la estructura del sitio. Es muy útil para crear duplicados perfectos del sitio en otros servidores, sobre todo si se quiere utilizar como plantilla de la estructura.

• Cuando se tieneunnúmero importantedesitios, algunos de ellos posiblemente obsoletos o simplemente que no se necesiten más, se pueden eliminar pulsando el botón Quitar.

• La opción Exportar permite guardar lascaracterísticas del sitio en un archivo XML, de forma que con un sólo archivo se puede guardar, recuperar e incluso compartir con otras personas las características del sitio fácilmente.

Las últimas opciones son Importar, Ayuda y Listo.

• ImportareslaopcióncomplementariadeExportar,con ella se puede crear un nuevo sitio a partir de las características de otro sitio exportado.

• LaopciónAyuda,seexplicaensímisma.• Cuando se termine de administrar el sito,

simplemente se pulsa el botón “Listo” y todos los cambios serán actualizados.

El Texto

De aquí en adelante se empezará a crear una página web. Será en principio sólo una página con texto y se irán descubriendo las distintas funcionalidades de Dreamweaver respecto al formato de los textos.

1. Para comenzar, se necesita crear una página nueva y darle un buen título.

2. Una vez se crea la página y se le haya dado el título, se escribirá en la vista de Diseño el texto normalmente y luego se le darán los formatos necesarios.

3. Una vez se escribe el texto de la primera página, se da clic en Insertar en el grupo de paneles Común.

4. Entre las opciones se puede elegir el tipo de panel que se va a tener activo. Éste dependerá de la acción que se vaya a realizar.

En Común se encuentran las opciones más habituales; sin embargo, las demás están especializadas en algún tipo determinado de acción.

5. Como ya se escribió un texto y se va a trabajar con él, se selecciona la opción Texto.

6. Si se quiere tener acceso a todos los paneles de forma rápida se escoge la opción “Mostrar como fichas” y Dreamweaver abre tantas pestañas como opciones de paneles a insertar tiene.

Page 202: Usos Pedagogicos de internet

202Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Formateando Textos

7. A continuación se dará formato y efectos al texto para realzar el diseño de la página. Es necesario recordar en este momento lo que se aprendió en HTML respecto al formato y énfasis de texto.

Cuando se escoge la opción Texto en la barra de los grupos de paneles Insertar, aparece en la ventana de trabajo unos botones que permiten dar formato y efecto al texto seleccionado.

8. En este caso, al primer párrafo del documento se le dará una apariencia de Encabezado1 y se selecciona h1. No es necesario seleccionar el párrafo sino que basta con tener el cursor en él.

9. Al segundo párrafo se le define un formato de Encabezado2, pulsando h2, y al tercer párrafo le da formato de Encabezado 3 con h3.

El Panel de Propiedades

Ahora se va a explicar el panel “Propiedades” que ayuda a mejorar el aspecto del texto.

Teniendo una parte del texto seleccionado, ir a la barra de Menú y escoger Modificar > Propiedades de la selección. La vista general del panel es la siguiente:

Desde este panel Propiedades se puede, teniendo seleccionada una línea o párrafo, por ejemplo el primero, aplicarle alineación “Centrada” simplemente pulsando en el ícono de la imagen.

En una misma página se pueden mezclar varios tipos de alineación, por ejemplo, se puede darle al segundo párrafo una alineación ajustada y mantener al mismo tiempo el centrado del primer párrafo.

En la zona izquierda del panel de propiedades aparecen unas opciones que aún no se conocen y que se aplicarán a continuación.

Estas son las propiedades, “Formato”, “Fuente”, “Estilo”, “Tamaño” y “Color”.

Page 203: Usos Pedagogicos de internet

203Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

La primera opción “Formato” permite cambiar el formato del párrafo por defecto. Inicialmente, los párrafos no tienen formato pero se puede elegir uno de la lista, en la cual aparecen otros efectos más que los mostrados en los botones vistos anteriormente. Según el efecto que se elija el párrafo tendrá una apariencia u otra.

En la opción fuente se puede predeterminar que juego de fuentes será visible por el usuario; esta opción es muy útil en el caso de que el usuario no tenga instalada la fuente elegida para la página ya que se puede establecer con esta instrucción un juego de fuentes suplentes.

La opción estilo hace referencia a una funcionalidad avanzada de un formato de páginas llamado CSS que se estudiará más adelante. Basta saber que existe y que controla la forma en que escribimos las instrucciones para el navegador.

En la opción tamaño se elige el tamaño de la fuente; si está habituado a sar procesadores de textos puede sorprender que a parte del tamaño por puntos (tamaño absoluto), al que se está acostumbrado, se ve también tamaño “pequeño” o “mayor”, por ejemplo.

Esto se explica porque los navegadores permiten al usuario elegir el tamaño de visualización de la letra, y si el usuario cambia el tamaño puede perderse el efecto deseado. Con los tamaños “relativos” los identificados con palabras, es posible conservar el efecto visual del texto aunque el usuario cambie estos valores en su navegador.

Por último, se pueden utilizar colores para dar más vistosidad a los textos, sólo se tiene que marcar el texto que se quiera colorear y elegir un color de la paleta.

Las Listas

Cuando se crea una página web puede surgir la necesidad de dar un aspecto más ordenado a los textos. Crear listas en HTML puede llegar a ser algo tedioso dependiendo la complejidad de su estructura y aspecto.

Dreamweaver también permite crear listas para hacer más atractivas y organizadas las páginas. Una de las formas de crear listas con Dreamweaver es activar la barra Texto, en el botón “Común”.

Page 204: Usos Pedagogicos de internet

204Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Al pulsar el botón “ul” se activa la opción “Listas simples o desordenadas”.

Al seleccionar el botón de lista desordenada la línea en la que esté activo el cursor de texto será el comienzo de una lista. Al dar la tecla Enter Dreamweaver convertirá el texto introducido en esa línea en una entrada de la lista asignándole una viñeta y prepara la siguiente línea, con otra viñeta, como otro elemento de la lista. Adicionalmente, en la parte inferior de la borde de la ventana que está mostrando la vista seleccionada, aparece la etiqueta HTML asociada con la función que se está utilizando, para este caso <UL> y <LI>.

Para terminar de introducir elementos en la lista sólo se debe pulsar la tecla Enter dos veces seguidas y ya se puede continuar escribiendo normalmente, como en Microsoft Word.

Dar formato a las listas

A continuación se aplicará formato también a las listas, para lo cual se debe acceder a las opciones de formato desde el panel Propiedades, en la parte inferior de la ventana de Dreamweaver.

Para aplicar formato a una lista completa, se debe marcar toda la lista, y no sólo un elemento, esto es por que Dreamweaver permite aplicar formatos de texto diferenciados a cada elemento de la lista; Dreamweaver permite combinar de forma sencilla distintos formatos sobre el mismo elemento.

Las Listas Ordenadas

Otro tipo de lista, estudiada también en HTML es el de listas ordenadas. Una lista ordenada se diferencia de las demás porque a cada elemento antecede un número en orden creciente.

Para crear en Dreamweaver una lista ordenada se pulsa el ícono de “lista ordenada” del panel Propiedades o en el ícono “ol” de la barra texto, en el grupo de paneles Insertar. El funcionamiento para añadir elementos de las listas o cerrar la lista es idéntico al de las listas desordenadas.

Page 205: Usos Pedagogicos de internet

205Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

También se pueden añadir elementos a una lista pulsando en el ícono “li”, independientemente del tipo de lista.

Las Listas de Definición

El último tipo de listas son las listas de definición formadas por elementos y sus definiciones. Para iniciar una lista de definición se selecciona la opción Texto de la barra de Menú y allí se selecciona Lista > Lista de definición. Se va a crear una lista de definición para los elementos Dreamweaver y Explorer. Debajo de cada elemento se tiene otro elemento en una línea con sangría que define el elemento anterior. Tan pronto se define aparecen, en el parte inferior de la ventana, las etiquetas HTML asociadas, <DL>, <DD>y <DT>

Primero se digita el término de la lista luego se da Enter. La siguiente línea aparece con una sangría que indica que se ha abierto el espacio para la definición. Luego se da otro Enter para continuar con el otro término y su respectiva definición. Cuando se quiere finalizar la lista se da dos veces seguidas Enter.

El resultado que se observa es:

Puede recordar el significado de cada etiqueta revisando nuevamente el aparte de HTML.

Todo lo mostrado con anterioridad respecto a los formatos de listas es también aplicable a las listas de definición.

Page 206: Usos Pedagogicos de internet

206Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

También se pueden elegir las opciones de colores avanzadas, aunque es posible que, dependiendo del navegador del usuario y las características de su tarjeta grafica, los colores no se muestren exactamente como se desee.

Otra opción muy útil es utilizar listas anidadas, es decir, una lista dentro de otra. Por ejemplo:

Se debe observar en la parte inferior de la ventana de diseño las etiquetas de HTML que aparecen, indicando la presencia de dos tipos de listas simultáneamente.

Las Tablas

Este no es un tema insignificante. Las tablas tienen muchísima importancia en lo que se refiere al diseño de páginas Web. Es el esqueleto sobre el que las páginas se construyen.

A continuación se creará una tabla normal como las que se pueden crear en cualquier procesador de textos.

1. Se puede crear una tabla fácilmente pulsando en el ícono Tabla de la barra Común, del panel Insertar, tal como se ve en la imagen:

Cuando se selecciona el icono, Dreamweaver abre una ventana de diálogo como la que se ven abajo.

Page 207: Usos Pedagogicos de internet

207Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

2. Aquí se definen la forma y características de la tabla que está creando.

Simplemente se tiene que introducir un valor en filas y otro en columnas para dimensionar el tamaño de la tabla; por ejemplo si digita 4 y 3 respectivamente, la tabla tendrá 12 celdas distribuidas en un rectángulo de 4 celdas de alto y 3 celdas de ancho.

Desde aquí se puede cambiar también el ancho de la tabla, que por ahora es de 300 píxeles.

3. También se puede definir una fila de encabezados o titulares, que puede ser por columna o una fila y una columna (opción Ambos).

Dreamweaver permite crear con un sólo clic diferentes tipos de encabezados. Esto es una forma muy sencilla de dar una apariencia más estética a las tablas.

4. Una vez definidas todas las características de la tabla se selecciona Aceptar.

Una de las ventajas de crear páginas Web con Dreamweaver en la vista de Diseño es que no hace falta saber nada acerca de programación para manejar toda su potencia.

Por ejemplo, si se quiere redimensionar la tabla, tradicionalmente y en HTML se tendría que haber ido al código de la página y teclear las nuevas dimensiones. Con Dreamweaver sólo se tiene que dar clic sostenido sobre el borde lateral de la tabla y arrastrar hasta la nueva posición.

5. Una vez que se tienen las medidas requeridas para la tabla sólo se debe introducir el texto dentro de cada celda.

Page 208: Usos Pedagogicos de internet

208Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Para el ejemplo se va a crear una especie de horario de actividades en el día.

• Paraintroducireltextoenunaceldasólosedaclicenelinteriordela misma y se escribe el texto. Para validarlo se puede dar clic en otra celda o pulsar la tecla Enter.

Filas y Columnas

Dreamweaver facilita el trabajar con tablas. Por ejemplo, si se da clic derecho sobre una celda activa de la tabla se despliega un menú contextual.

Al seleccionar la opción Tabla, al lado del menú actual, se despliega el siguiente menú (por eso la opción muestra una cabeza de flecha hacia la derecha), con numerosas opciones tales como seleccionar tabla, que sirve para aplicar un efecto a toda la tabla, o combinar celdas, para unir varias celdas en una.

Panel de Propiedades de las Tablas

Para dar un mejor acabado a la tabla se cuenta con la ayuda del panel Propiedades.

1. El primer paso es seleccionar la tabla y situar el cursor en la esquina de la tabla hasta que cambie el puntero para dar clic y marcar la selección.

2. Luego se despliega el panel Propiedades, pero esta vez el panel ha cambiado, ahora las opciones hacen referencia a las propiedades de la tabla.

Page 209: Usos Pedagogicos de internet

209Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

En la imagen anterior se ven las características de la tabla definida en el ejemplo: tiene 4 filas, 5 columnas y sus dimensiones son 300 píxeles de ancho (An) sin definir píxeles de alto (Al), el borde tiene grosor 2 y el alineamiento es el predeterminado o por defecto.

Las plantillas para tablas

Para darle a las tablas un aspecto más sofisticado de forma fácil y sencilla Dreamweaver tiene una poderosa herramienta llamada “plantillas” que ayudará en esta tarea.

Para utilizarla simplemente se debe:1. Tener seleccionada la tabla2. Ir a la barra de Menú de Dreamweaver y pulsar sobre la opción

“Comandos”.3. En el menú desplegable que se abre, dar clic sobre “Formatear

tablas”. 4. Dreamweaver abre una ventana de diálogo llamada “Formatear Tabla”.

En la parte superior hay 3 zonas, la izquierda es un menú desplegable a través del que se ven ejemplos de las plantillas.

5. Para elegir una plantilla sólo se da clic sobre la opción deseada, por ejemplo, filas alternas verde y amarillo.

Se pueden ensayar los diferentes formatos de tabla y cuando se encuentre la deseada se da clic en el botón Aplicar y luego en Aceptar, ubicados en la zona derecha de la ventana.

En la tabla lo único que ha cambiado es el formato de la tabla, no el contenido ni sus dimensiones.

La tabla tiene ahora los colores y la estética de la tabla seleccionada en la plantilla, pero Dreamweaver respeta la forma en que se ha insertado la tabla en la página.

Formatear tablas

Si las combinaciones de colores prediseñadas no son las deseadas es posible seleccionar desde el margen izquierdo la fila o en el margen

Page 210: Usos Pedagogicos de internet

210Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

derecho la columna y buscando el color deseado en la paleta, o desde el cuadro de diálogo Formatear tabla.

• Laprimeraopciónserefierealafilasuperiordelatabla;sepuededefinirel alineamiento del texto del encabezado (alineado a la izquierda, a la derecha o al centro).

• Conestilodetextosepuederesaltarelencabezadoconunestilodeletra negrita o itálica.

• Todoloquesehavistoparaloscoloresestambiénválidoparaaplicarloal color del texto de los encabezados, simplemente se tiene que tener en cuenta que el color que se elija debe tener bastante contraste respecto al fondo para ser visible.

• Dreamweaverpermitetenerdistintosformatosparaelencabezadosuperior y para el encabezado lateral.

• Sepuededefinirlaalineaciónparatodalacolumnaytambiénelestilode visualización de las fuentes, se pueden elegir los mismos formatos que en el encabezado superior o se pueden cambiar los formatos. Por ejemplo, se puede tener en el encabezado superior un tipo de letra resaltada y en el encabezado lateral un formato en itálica.

Cada vez que se selecciona un color, éste tiene un número hexadecimal asociado. Se debe recordar que hay un número universal de identificación para cada color. Con este número se puede estar seguro de que se ha elegido el mismo color exactamente y no un tono superior o inferior.

Formato de Plantillas

En la parte inferior de la ventana de diálogo se encuentran las opciones de formato de los encabezados de la plantilla.

Se hace desde este panel:

Page 211: Usos Pedagogicos de internet

211Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Porúltimo,puedecambiarseelbordedelatabla.Puededarseleun grueso de borde desde 1 hasta el valor que se quiera, teniendo presente que el grosor del borde crece a costa de disminuir el tamaño de las celdas.

• Unpuntoimportantealahoradediseñarpáginasweb,yqueledatanto valor a las tablas cuando se trata de crear estructuras de páginas, es el hecho de que se pueda un dar al borde un grosor de cero.

Las Imágenes

Es indiscutible que para que una página sea atractiva debe tener una estética visual importante. La manera más sencilla de añadir una imagen a una página es:

1. Seleccionar la opción Insertar, de la barra de menú, y buscar en el menú desplegado la opción imagen.

2. En la ventana de diálogo que Dreamweaver abre, se puede buscar la imagen que se quiere insertar en la página; simplemente se tiene que seleccionar y dar clic en el botón Aceptar de la ventana diálogo.

3. Una imagen se inserta en la posición que ocupa el cursor al momento de escoger las opciones para añadirla. También se puede escribir texto en la misma línea en que se inserta la imagen. Eso significa que se puede combinar en la misma línea texto e imágenes, sin importar el orden. Se puede escribir una línea de texto y en cualquier punto de ella insertar la imagen, o se puede insertar primero la imagen y después escribir un comentario a su lado.

Dreamweaver permite insertar imágenes de varias maneras. Ya se ha visto como hacerlo desde la barra de menú, ahora se verá como insertar imágenes desde el panel Insertar, con la barra Común activada.

Page 212: Usos Pedagogicos de internet

212Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

1. Se puede seleccionar en la barra Común en el ícono Imagen tal como se ve en la imagen:

2. Se muestra la misma ventana de diálogo de antes y se puede seleccionar el archivo.

Una última forma de insertar imágenes en la página es desde el grupo de paneles de la derecha de la ventana Dreamweaver. Al seleccionar la barra Archivos se mostrará el sitio que se ha configurado anteriormente.

El sitio es una estructura de directorios que alberga las páginas; si se ha configurado adecuadamente el sitio, incluido el directorio de las imágenes, simplemente se tiene que arrastrar la imagen correspondiente desde el panel hasta el lugar de la página donde se quiere situar.

Panel Propiedades de Imagen

Para acceder a las propiedades de las imágenes sólo se da un clic sobre la imagen de la cual se quiere activar las propiedades. Tal como se ve en la siguiente imagen:

Page 213: Usos Pedagogicos de internet

213Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

1. Lo primero es darle a la imagen un nombre. Con esto se le dice a Dreamweaver que se va a considerar la imagen como un objeto. Si le asigna un nombre representativo es mucho más cómodo trabajar con los archivos.

2. Sobre el nombre Dreamweaver muestra el “peso” o “tamaño” en KB de la imagen; esto es muy importante para controlar el “peso” final de la página.

Hay que tener en cuenta que cuanto más “peso” tenga una página más lenta será de visualizar por los usuarios, en especial por aquellos que no tienen una conexión de Internet de alta velocidad.

3. Es importante diferenciar el tamaño de peso de la imagen con el tamaño de dimensiones de la imagen; una imagen, independientemente de su peso, puede tener las dimensiones que se necesiten. Esto se consigue introduciendo los valores deseados en las casillas Ancho y Alto.

En el caso de que se prefieran las medidas originales no es necesario recordar las cifras, simplemente se da clic en el icono Restaurar.

En la parte central de la ventana, se tienen las casillas “origen” y “vínculo”. La casilla origen hace referencia al nombre del archivo de la imagen. Pulsando sobre la carpeta de su derecha se puede navegar por la estructura del ordenador hasta encontrar la imagen que se desee insertar en ese punto.

Page 214: Usos Pedagogicos de internet

214Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

En la casilla Vínculo se puede introducir el nombre de la página web enlazada a la imagen. Este es el funcionamiento normal de las páginas web; Dreamweaver permite con un sólo clic crear un vínculo desde una imagen de manera que pulsando sobre ella, el navegador llegue hasta otra. Más adelante se estudiará el manejo de vínculos.

4. En la casilla Vínculo se da el nombre de la página destino a la que se desea vincular desde la imagen.

En la ventana aparece la casilla “Alt”, esto significa “Alternativa”. En caso de que el usuario, por cualquier razón, no pueda visualizar en su computador las imágenes de la web, el texto de la casilla “Alt” se muestra en el lugar de la imagen hasta que ésta pueda ser mostrada.

Por eso es tan importante que el texto sea lo suficientemente descriptivo para que el usuario capte el significado del enlace sin ver la imagen.

Combinar Imágenes y Tablas

A continuación se empezará a crear una tabla con texto e imágenes insertadas en las celdas.

En la próxima imagen se observa una tabla de 3 filas por 3 columnas, según la plantilla que se seleccionó en el ejemplo anterior. Sólo se han introducido datos en el encabezado de la columna de la izquierda, es decir, en la primera celda de cada fila.

Page 215: Usos Pedagogicos de internet

215Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Ahora se da clic en el interior de la celda donde se quiere introducir la imagen. Una vez que la celda esté activa se inserta la imagen con alguno de los métodos que ya se conocen.

En la siguiente imagen se ve como queda la tabla con la imagen y un comentario con la descripción de la imagen en la celda de la derecha de la imagen.

Se pueden situar tanto textos como imágenes en cualquiera de las celdas de la tabla.

Los Comportamientos

Los comportamientos hacen referencia a la funcionalidad avanzada de Dreamweaver que facilita mucho la creación de páginas web más dinámicas. Los comportamientos son, siendo necesaria la redundancia, comportamientos que se asignan a determinados sucesos para que la página reaccione de una manera determinada. Todo esto se aprecia mejor con un ejemplo.

Se puede acceder a los comportamientos en el grupo de paneles de la derecha de la ventana de Dreamweaver.

1. El primer paso es seleccionar el objeto sobre el que se desea aplicar el comportamiento, por ejemplo una de las imágenes de la tabla.

2. A continuación se despliega el menú “etiqueta” y se da clic sobre la pestaña Comportamientos.

3. Debajo de la leyenda “Comportamientos” se

encuentra un signo “+”. Al dar clic sobre él se desplegará el menú de Comportamientos disponible para el objeto seleccionado. Esto último es importante pues los comportamientos cambian según el objeto seleccionado.

4. Si es una imagen, los comportamientos disponibles son:

• “Intercambiarimagen”.Estecomportamientologra un efecto atractivo; cuando el usuario pase el puntero del mouse sobre la imagen, esta imagen cambiará y será sustituida por otra distinta.

Se pueden conseguir páginas muy efectivas con este comportamiento, un poco de imaginación y buen gusto.

Tras seleccionar la opción intercambiar imagen, se muestra un cuadro de diálogo en el que solicita que se defina el origen, esto quiere decir, ¿por cuál imagen quiere que sea sustituida la imagen seleccionada?

Los vínculos o enlaces

A continuación se van a crear algunos enlaces paso a paso.

1. El primer paso es seleccionar, por ejemplo, un texto. Este texto será el enlace con la página destino.

Page 216: Usos Pedagogicos de internet

216Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

2. En la barra Común se selecciona el ícono Hipervínculo, tal como se ve en la imagen siguiente:

3. Dreamweaver abre un cuadro de diálogo en el que

se completarán los campos necesarios.

El primero es el texto del enlace, que en este caso coincide con el texto que se ha seleccionado anteriormente.

4. El segundo paso es seleccionar la página con la que se quiere vincular el enlace; se puede escribir el nombre o buscarla por las carpetas y seleccionarla.

5. La siguiente opción dice como se accederá al destino. Se puede utilizar la misma ventana del navegador o abrir otra ventana independiente. Esto es particularmente útil cuando se quiere que el usuario permanezca en la página después de ver el contenido de la página vinculada.

6. La opción título se refiere al título de la página que se va a abrir, de esta manera se tiene cierto control sobre las páginas.

Cuando se aceptan los cambios realizados y se vuelve a la vista de diseño se ve como ha cambiado el formato del texto, ahora aparece azul y subrayado. Este es el formato por defecto que adoptan todos los enlaces.

Por otra parte, se pueden realizar vínculos dentro de la misma página. Esto es particularmente útil en el caso de páginas extensas ya que se puede crear un índice en la cabecera de la página y con un clic ir a la sección que interese al usuario.

1. El primer paso, como siempre, es seleccionar un punto de la página. En este caso se selecciona un punto para situar un anclaje o marca, este es el punto al que posteriormente se va a referenciar.

2. Una vez que se hayahecho la selección se debe pulsar en el icono Anclaje de la barra Común.

3. En la ventana de diálogo siguiente se debe crear un Nombre de anclaje, es decir, un nombre único al que después se pueda referenciar de manera sencilla.

4. El siguiente paso es crear el punto de enlace, es decir, marcar una palabra, frase o imagen sobre la que se dará clic para ir al destino que ya se ha elegido.

5. Una vez que se ha seleccionado el texto, se va al panel de Propiedades y se da clic sobre la opción Vínculo, esta vez no introducirá ninguna página web.

Page 217: Usos Pedagogicos de internet

217Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Simplemente se escribe el nombre del anclaje precedido por el signo “#”

6. La opción destino se puede utilizar tal como se ha visto anteriormente: en la misma página o en una nueva.

De esta manera cuando se de clic sobre el enlace la página se desplazará hasta mostrar el punto de anclaje al que se ha vinculado al enlace.

Enlace externos

1. Para crear enlaces a páginas exteriores, situadas en Internet, se selecciona el texto que va a servir como enlace.

2. El siguiente paso es buscar en la barra Común el icono de Hipervínculo.

3. En la ventana de hipervínculo se introduce en la casilla de vínculo la dirección URL de la página a la que deseemos enlazar.

4. En la opción Destino se puede elegir cualquiera de las opciones vistas anteriormente.

5. Cuando se haya terminado se dará clic en el botón Aceptar.

Dreamweaver Avanzado

Las capas en Dreamweaver

¿Qué son las capas en Dreamweaver?

Una capa es un elemento de página HTML que se puede colocar en cualquier lugar del documento.

Las capas pueden contener texto, imágenes u otros contenidos que se pueden situar en el cuerpo de un documento HTML. En Dreamweaver una capa es una etiqueta <DIV> con una posición absoluta o relativa.

Las capas, tal y como se describen, se refieren al concepto de diseño de Dreamweaver y no a la etiqueta <LAYER>.

Aspectos básicos de las capas

Dreamweaver puede emplear capas para diseñar la página. Puede colocar unas capas delante o detrás de otras, ocultar algunas capas mientras muestra otras y mover capas por la pantalla. Puede colocar una imagen de fondo en una capa y, a continuación, insertar una segunda capa, con texto y un fondo transparente, delante de la primera.

Las capas proporcionan una gran flexibilidad a la hora de colocar contenido.

Para asegurarse de que todos los usuarios pueden ver su página Web, diséñela utilizando capas y, posteriormente, convierta las capas en tablas. Si cree que los visitantes de la página van a usar navegadores más recientes, puede realizar el diseño con capas, sin convertirlas en tablas.

• CódigoHTMLparacapas

Al insertar una capa en un documento, Dreamweaver inserta la etiqueta HTML de dicha capa en el código.

Se puede configurar Dreamweaver para que utilice la etiqueta <DIV> o <SPAN> para las capas. Dreamweaver crea las capas utilizando de forma predeterminada la etiqueta DIV. Se pueden utilizar otras dos etiquetas para crear capas: LAYER e ILAYER. Sin embargo, estas etiquetas sólo son compatibles con Netscape Navigator; Internet Explorer no las reconoce. Dreamweaver reconoce las etiquetas LAYER e ILAYER pero no las utiliza para crear capas.

Page 218: Usos Pedagogicos de internet

218Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

La diferencia entre la etiqueta DIV y la etiqueta SPAN está en que los navegadores que no admiten capas introducen saltos de línea adicionales antes y después de la etiqueta DIV. Es decir, la etiqueta DIV es un elemento de nivel de bloque, mientras que la etiqueta SPAN es un elemento en línea. En la mayoría de los casos es más conveniente que el contenido de la capa aparezca en un párrafo independiente en los navegadores que no admiten capas. Por tanto, la mayoría de las veces será preferible usar DIV en lugar de SPAN.

Cuando dibuja una capa en Dreamweaver ésta se muestra donde la ha dibujado, pero Dreamweaver inserta su código al principio de la página, inmediatamente después de la etiqueta BODY. Si utiliza el comando Insertar capa en lugar de Dibujar una capa, el código se colocará en el punto de inserción.

Si crea una capa anidada Dreamweaver insertará el código dentro de la etiqueta que define la capa padre.

• AcontinuaciónsemuestraunejemplodecódigoHTML de una capa:

<DIV ID=”Layer1” STYLE=”position:absolute; visibility:inherit; width:200px; height:115px; z-index:1”></div>

• ElsiguienteesunejemplodecódigoHTMLdeuna capa anidada en otra:

<DIV ID=”Parent” STYLE=”position:absolute; left:56px; top:54px; width:124px; height:158px; z-index:1;”> Contenido situado en el interior de la capa padre. <DIV ID=”Nested” STYLE=”position:absolute; left:97px; top:114px; width:54px; height:69px; z-index:1;”> Contenido situado en el interior de la capa anidada.</DIV></DIV>

Es posible definir las propiedades de colocación de las capas en la página incluidas las coordenadas x e y, índice z (también denominado orden de apilamiento) y visibilidad.

Inserción de bloques de contenido para diseño.

Se pueden utilizar etiquetas DIV para situar bloques de contenido en el documento. Esto es especialmente útil si ya se tiene una hoja de estilo CSS con estilos de posición adjunta al documento.

Dreamweaver permite insertar rápidamente una etiqueta DIV y aplicarle estilos existentes. Se puede utilizar un archivo de diseño de Dreamweaver como punto de partida para el diseño de CSS, seleccionando un archivo en la categoría Diseños de páginas (CSS) del cuadro de diálogo Nuevo documento.

Para insertar una etiqueta DIV:

1. En la ventana de documento situar el punto de inserción en el lugar donde desea que aparezca la etiqueta DIV.

2. Seguir uno de estos procedimientos:• Seleccionar Insertar > Objetos de diseño >

Etiqueta DIV. • EnlacategoríaDiseñodelabarraInsertar,hacer

clic en el botón Etiqueta DIV. Aparece el cuadro de diálogo Insertar etiqueta Div.

3. Completar este cuadro de diálogo. Para más información hacer clic en el botón Ayuda del cuadro de diálogo.

4. Hacer clic en Aceptar.

La etiqueta DIV tendrá el aspecto de un cuadro en el documento con texto de marcador de posición. Al desplazar el puntero sobre el cuadro, Dreamweaver lo resaltará. Si la etiqueta DIV se sitúa absolutamente o relativamente actúa como una capa de Dreamweaver.

Page 219: Usos Pedagogicos de internet

219Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Cambio del color de resaltado de los bloques de contenido.

Cuando se desplaza el puntero sobre un bloque de contenido, Dreamweaver lo resalta. Dreamweaver resalta los bloques que tengan una clase, un identificador o un estilo asociado.

Se puede activar o desactivar el resaltado según sea necesario y cambiar su color en las preferencias.

Para cambiar las preferencias de resaltado de los bloques de contenido: 1. Seleccionar Edición > Preferencias (Windows)

o Dreamweaver > Preferencias (Macintosh). Aparece el cuadro de diálogo Preferencias. Seleccionar Resaltando en la lista de categorías de la izquierda.

2. Realizar uno de estos cambios: • Paracambiarelcolorderesaltadodelosbloques

de contenido, hacer clic en el cuadro Color al pasar el ratón por encima y seleccionar un color mediante el selector de color (o bien escribir el valor hexadecimal del color de resaltado en el cuadro de texto).

• Paraactivarodesactivarelresaltadodelosbloquesde contenido, activar o desactivar la selección de la casilla Mostrar correspondiente a Ratón por encima. Estas opciones afectan a todos los objetos, que Dreamweaver resalta cuando pasa el puntero del ratón sobre ellos.

3. Hacer clic en Aceptar.

Utilización de bloques de contenido para diseño.

Después de insertar una etiqueta DIV se puede manipular el bloque de contenido o añadirle contenido. Las etiquetas DIV de bloque de contenido cuya posición es absoluta o relativa actúan como capas de Dreamweaver.

Las etiquetas DIV de bloque de contenido cuya posición no es absoluta o relativa no tienen bordes visibles, pero si se pasa el cursor por encima de un bloque de contenido Dreamweaver resalta el bloque (siempre y cuando tenga clase, id y estilo asociados). El color de resaltado se puede cambiar o desactivar.

Cuando se selecciona un bloque de contenido cuya posición no es absoluta o relativa, puede verse y editarse las reglas para el bloque en el inspector de etiquetas.

Para añadir contenido al bloque, se sitúa el punto de inserción en el bloque y, a continuación, se añade contenido como se haría en una página.

Para ver y editar reglas aplicadas a un bloque de contenido:1. Seguir uno de estos procedimientos para

seleccionar la etiqueta DIV:• Hacerclicenelbordedelbloque.Buscarel

resaltado para ver el borde.• Hacerclicenelinteriordelosbordesdelbloquey

seleccionar la etiqueta DIV del selector de etiquetas en la parte inferior de la ventana de documento.

2. Seleccionar Ventana > Inspector de etiquetas para abrir el inspector de etiquetas, si no está abierto, y hacer clic en la ficha CSS, si no está abierta. Las reglas que se aplican a la etiqueta DIV aparecen en el panel.

3. Llevar a cabo los cambios necesarios. Para colocar el punto de inserción en un bloque para añadir contenido:

• Hacerclicencualquierlugardentrodelosbordesdel bloque. Para cambiar el texto del marcador de posición en un bloque de contenido

• Seleccionareltextoyescribirencimaopresionarlatecla Suprimir. Se puede añadir contenido al bloque de la misma forma que le añadiría contenido a una página.

Page 220: Usos Pedagogicos de internet

220Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Inserción de una capa

Dreamweaver permite crear capas en la página fácilmente y colocarlas con precisión. También puede crear capas anidadas.

1. Se puede utilizar un archivo de diseño de Dreamweaver como punto de partida para el diseño de CSS. Seleccionar un archivo en la categoría Diseños de páginas (CSS) del cuadro de diálogo Nuevo documento.

2. Cuando se inserta una capa aparece una marca de código de capa en la vista de diseño. Dreamweaver muestra de manera predeterminada el borde de la capa y resalta el bloque (siempre que tenga asociado una clase, id o estilo) cuando se desplaza el puntero por encima.

3. Se puede desactivar el marcador de código de capa desactivando los elementos invisibles y ocultando los bordes de las capas. Se puede cambiar o desactivar el color del resaltado.

Cuando la opción Elementos invisibles está activada, los elementos de la página pueden cambiar de posición. Sin embargo, los elementos invisibles no se muestran en los navegadores. Por ello, cuando se ve la página en un navegador, todos los elementos invisibles aparecen en la posición correcta.

4. Después de crear una capa se le puede añadir contenido situando el punto de inserción en la capa; a continuación se añade contenido cómo se haría en una página.

Para dibujar una sola capa o varias capas consecutivamente:1. En la categoría Diseño de la barra Insertar, hacer

clic en el botón Dibujar capa.2. En la vista de diseño de la ventana de documento

seguir uno de estos procedimientos: • Arrastrarparacrearunasolacapa.

• ArrastrarelmousemientraspresionalateclaControl (Windows) o Comando (Macintosh) para dibujar varias capas consecutivamente. Se podrá continuar dibujando nuevas capas mientras no suelte la tecla Control o Comando.

Para insertar una capa en un lugar concreto del documento:• Situarelpuntodeinserciónenlaventanade

documento y seleccionar Insertar > Capa.

Para colocar el punto de inserción en una capa:• Hacerclicencualquierlugardentrodelosbordes

de la capa. Se resaltarán los bordes de la capa y aparecerá el manejador de selección, pero la capa no quedará seleccionada.

Para mostrar u ocultar marcas de código de capa:• SeleccioneVer>Ayudasvisuales>Elementos

invisibles.

Para mostrar u ocultar bordes de capa: • SeleccioneVer>Ayudasvisuales>Bordesde

capa.

Anidación de capas

Una capa anidada es aquella cuyo código se encuentra dentro de otra capa.

La anidación se usa a menudo para agrupar capas. Una capa anidada se mueve junto con su capa padre y puede configurarse para que herede la visibilidad de ésta.

Se puede activar la opción Anidación para anidar automáticamente una capa al dibujar una capa dentro de otra capa.

Para dibujar una capa anidada:1. En la categoría Diseño de la barra Insertar, hacer

clic en el botón Dibujar capa.

Page 221: Usos Pedagogicos de internet

221Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

2. En la vista de diseño de la ventana de documento, arrastrar el cursor para dibujar una capa dentro de una capa existente: Si Anidar está desactivado en las preferencias de Capas, arrastrar el ratón mientras se presiona la tecla Alt (Windows) u Opción (Macintosh) para anidar una capa dentro de otra existente.

Las capas anidadas pueden ofrecer distinto aspecto según el navegador. Al crear capas anidadas se debe comprobar con frecuencia su aspecto en distintos navegadores durante el proceso de diseño.

Para insertar una capa anidada:• Colocarelpuntodeinserciónenelinteriordeuna

capa existente en la vista de diseño de la ventana de documento y seleccionar Insertar > Capa.

Para anidar una capa existente dentro de otra utilizando el panel Capas:1. Seleccionar Ventana > Capas para abrir el panel

Capas.2. Seleccionar una capa en el panel Capas y, mientras

presiona la tecla Control (Windows) o Comando (Macintosh), arrastrar la capa con el ratón hasta la capa de destino del panel Capas.

3. Soltar el botón del mouse cuando se resalte el nombre de la capa de destino.

Para anidar automáticamente las capas cuando se dibuja una capa que comienza dentro de otra:• SeleccionelaopciónAnidarenlaspreferenciasde

Capas.

Configuración de preferencias y propiedades de capa.

Dreamweaver permite especificar una configuración predeterminada para las capas. También puede ver y configurar diversos atributos de una o más capas en el inspector de propiedades.

Para la configuración de las preferencias de capa se usa la categoría Capas del cuadro de diálogo Preferencias para definir la configuración predeterminada de las capas nuevas.

Para ver o definir las preferencias de capas:

1. Seleccionar Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh). Aparece el cuadro de diálogo Preferencias.

2. Seleccionar Capas en la lista Categoría de la izquierda.

3. Realizar los cambios necesarios. Para más información hacer clic en el botón Ayuda del cuadro de diálogo.

4. Hacer clic en Aceptar.

Para visualizar y configurar las propiedades para una sola capa, se selecciona una capa y el inspector de propiedades muestra las propiedades de capa.

Para ver y configurar propiedades de capa:1. Seleccionar una capa.2. En el Inspector de propiedades (Ventana >

Propiedades) hacer clic en la flecha de ampliación de la esquina inferior derecha para ver todas las propiedades en caso de que no estuviese ya ampliado.

3. Cambiar los atributos de la capa estableciendo sus propiedades. Para más información hacer clic en el botón Ayuda del inspector de propiedades.

Para la visualización y configuración de propiedades para múltiples capas se seleccionan dos o más capas y el inspector de propiedades de capas muestra las propiedades de texto y un subconjunto de todas las propiedades de las capas, lo que permite modificar varias capas de una sola vez.

Para seleccionar múltiples capas:• MantengapresionadalateclaMayúsmientrasse

selecciona las capas.

Page 222: Usos Pedagogicos de internet

222Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Para ver y establecer las propiedades de varias capas:1. Seleccionar varias capas.2. En el Inspector de propiedades (Ventana >

Propiedades), hacer clic en la flecha de ampliación de la esquina inferior derecha para ver todas las propiedades en caso de que no estuviese ya ampliado.

3. Cambiar los atributos de las capas definiendo sus propiedades. Para más información, hacer clic en el botón Ayuda del inspector de propiedades.

Administración de capas

Puede seleccionar capas para trabajar con ellas. Puede cambiar el orden de apilamiento y la visibilidad de las capas. El panel Capas proporciona una forma práctica de administrar las capas.

Utilización del panel Capas

El panel Capas proporciona un medio para manejar las capas del documento. Se usa el panel Capas para evitar ocultamientos, cambiar la visibilidad de las capas, anidar o apilar capas y para seleccionar una o más capas.

Las capas se muestran en forma de lista de nombres; en orden de índice z. La primera capa que se creó estará situada al final de la lista mientras que la última que se creó aparecerá en la primera posición de la lista.

Para abrir el panel Capas: • SeleccioneVentana>Capas.

Para mostrar u ocultar capas anidadas:• Hacerclicenlosbotonesdesignomás(+)osigno

menos (–) (Windows) o la flecha de ampliación (Macintosh) que se encuentra junto al nombre de la capa.

Puede seleccionar una o varias capas para manipularlas o cambiar sus propiedades.

Para seleccionar una capa del panel Capas:• EnelpanelCapas(Ventana>Capas),hacerclicen

el nombre de la capa.

Para seleccionar una capa de la ventana Documento seguir uno de estos procedimientos:• Hacerclicenunmanejadordeseleccióndecapa.

Si el manejador de selección no está visible, hacer clic en cualquier punto dentro de la capa para hacerlo visible.

• Hacerclicenunbordedelacapa.• Hacerclicdentrodeunacapamientraspresiona

las teclas Control y Mayús (Windows) o Comando y Mayús (Macintosh). Si hay múltiples capas seleccionadas esta operación desactivará todas las demás capas y sólo dejará seleccionada aquella en la que ha hecho clic.

• EnlavistadeDiseñohacerclicenlamarcadecódigo de capa que representa la ubicación de la capa en el código HTML. Si no ve la marca de código de capa, seleccionar Ver > Ayudas visuales > Elementos invisibles.

Para seleccionar múltiples capas siga uno de estos procedimientos:• EnelpanelCapas(Ventana>Capas),presione

Mayús y hacer clic en dos o más nombres de capa.

• EnlaventanaDocumento,presioneMayúsyhacerclic en la parte interior o el borde de dos o más capas.

Cuando haya múltiples capas seleccionadas los manejadores de la última capa seleccionada se resaltarán en negro. Los manejadores de cambio de tamaño de las demás capas se resaltarán en blanco.

• Cambiodelordendeapilamientodelascapas.

Se utiliza el inspector de propiedades o el panel Capas para cambiar el orden de apilamiento de las capas.

Page 223: Usos Pedagogicos de internet

223Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

La capa que figura en la parte superior de la lista del panel Capas es la primera en el orden de apilamiento y aparece delante de las otras capas.

En el código HTML el orden de apilamiento o el índice z de las capas determina el orden en que se dibujan las capas en un navegador.

Puede cambiar el índice z para cada capa mediante el panel Capas o el inspector de propiedades.

Para cambiar el orden de apilamiento de capas en la paleta de capas:1. Seleccionar Ventana > Capas para abrir el panel

Capas.2. Seguir uno de estos procedimientos:

• Arrastrarunacapahaciaarribaohaciaabajohasta el nivel deseado dentro del orden de apilamiento. A medida que mueve la capa aparece una línea que indica donde se mostrará la capa. Soltar el botón del ratón cuando la línea de colocación aparezca en el lugar deseado dentro del orden apilamiento.

• EnlacolumnaZhacerclicenelnúmerodela capa que desea cambiar; escribir un número mayor para desplazar la capa hacia arriba en el orden de la pila o un número menor para desplazarla hacia abajo.

Para cambiar el orden de apilamiento de capas utilizando el inspector de propiedades:1. Seleccionar Ventana > Capas para abrir el panel

Capas y ver el orden de apilamiento actual.2. Seleccionar una capa del panel Capas o de la

ventana de documento.3. En el inspector de propiedades de capas (Ventana

> Propiedades) escriba un número en el cuadro de texto Índice Z.• Escribaunnúmerosuperiorparacolocarlacapa

en un nivel superior del orden de apilamiento.• Escribaunnúmeroinferiorparacolocarlacapa

en un nivel inferior en el orden de apilamiento.• Cambiodelavisibilidaddeunacapa

Mientras se trabaja con un documento se puede mostrar y ocultar capas manualmente utilizando el panel Capas para ver qué aspecto tendrá la página en distintas condiciones. Al seleccionar una capa se hace visible y aparece delante de las otras.

Para cambiar la visibilidad de las capas:

1. Seleccione Ventana > Capas para abrir el panel Capas.

2. Hacer clic en la columna con el icono de ojo para cambiar su visibilidad. • Sielojoestáabiertosignificaquelacapaes

visible. • Siestácerradolacapaesinvisible.• Sinohayiconodeojogeneralmentelacapa

hereda la visibilidad de su padre. (Cuando las capas no están anidadas el padre es el cuerpo del documento que siempre está visible.) Asimismo, el icono de ojo no aparece cuando no se especifica visibilidad (lo que se indica en el inspector de propiedades como visibilidad predeterminada).

Para cambiar la visibilidad de todas las capas a la vez:• EnelpanelCapas(Ventana>Capas)hacerclicen

el icono de ojo del encabezado que se encuentra en la parte superior de la columna. Este procedimiento puede establecer que todas las capas estén visibles u ocultas pero no que hereden esta propiedad.

Manipulación de capas

Cuando se trabaja con el diseño de la página puede seleccionar, mover, cambiar el tamaño y alinear capas. Debe seleccionarse una capa para que sea posible moverla, cambiar su tamaño o alinearla. Para evitar la superposición de capas al moverlas o cambiar su tamaño, use la opción Evitar solapamiento.

Cambio del tamaño de capas

Se puede cambiar el tamaño de una capa individual o de múltiples capas simultáneamente para asignarles

Page 224: Usos Pedagogicos de internet

224Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

la misma anchura y altura. Si está activada la opción Evitar solapamientos no se podrá cambiar el tamaño de una capa para que se superponga a otra.

Para cambiar el tamaño de una capa:1. En la vista de diseño seleccionar una capa.2. Siga uno de estos procedimientos para cambiar el

tamaño de la capa:• Sepuedecambiareltamañoarrastrandouno

de los manejadores de cambio de tamaño de la capa.

• Sepuedecambiareltamañopíxelapíxel,mantenga presionada la tecla Control (Windows) u Opción (Macintosh) mientras se presiona una tecla de flecha. Las teclas de flecha mueven los bordes derecho e inferior de la capa. Esta técnica permite cambiar el tamaño utilizando los bordes superior e izquierdo.

• Paracambiareltamañoenelincrementodeajuste a la cuadrícula se mantienen presionadas las teclas Mayús-Control (Windows) o Mayús-Opción (Macintosh) mientras se presiona una tecla de flecha.

• Enelinspectordepropiedades(Ventana>Propiedades) se escriben los valores de anchura (An) y altura (Al). Al cambiar el tamaño de una capa cambiarán su anchura y altura. Esta operación, sin embargo, no define qué cantidad de contenido de la capa queda visible.

Para cambiar el tamaño de múltiples capas a la vez:1. En la vista de diseño seleccionar dos o más capas. 2. Seguir uno de estos procedimientos:

• ElijaModificar>Alinear>Asignarmismoancho o Modificar > Alinear > Asignar mismo alto. Las primeras capas seleccionadas se ajustarán a la anchura o la altura de la última capa seleccionada (resaltada en negro).

• Enelinspectordepropiedades,bajoVariascapas (Ventana > Propiedades), introduzca los valores de anchura y altura. Estos valores se aplicarán a todas las capas seleccionadas.

Cómo mover capas

Se pueden mover las capas en la vista de Diseño de forma muy similar a como se mueven los objetos en las aplicaciones gráficas más básicas. Si está activada la opción Evitar solapamientos no podrá mover una capa para que se superponga a otra.

Para mover una o más de las capas seleccionadas:1. En la vista de diseño seleccionar una o varias

capas.2. Siga uno de estos procedimientos: • Sepuedemoverlascapasarrastrandoelmanejador

de selección de la última capa seleccionada (resaltada en negro).

• Paramoverlacapapíxelapíxelutilizarlasteclasde flecha. Mantener presionada la tecla Mayús mientras se presiona una tecla de flecha para mover la capa en el incremento actual de ajuste a la cuadrícula.

Alineación de capas

Se utilizan los comandos de alineación de capas para alinear una o varias capas con el borde de la última capa seleccionada. Cuando se alinean capas, las capas hijas que no están seleccionadas pueden moverse si se selecciona y se mueve su capa padre. Para evitarlo no utilice capas anidadas.

Para alinear dos o más capas:1. Seleccionar la capa en la vista de diseño.2. Elegir Modificar > Alinear y seleccionar una

opción de alineación. Por ejemplo, si se selecciona Superior, se moverán todas las capas de modo que sus bordes superiores queden en la misma posición vertical que el borde superior de la última capa seleccionada (resaltada en negro).

En el sitio del curso encontrará más información relacionada con utilidades avanzadas de Dreamweaver. Acceda a éste para enriquecer la página Web de su institución.

Page 225: Usos Pedagogicos de internet

PROYECTOS DE APRENDIZAJE COLABORATIVO

Unidad 4

Page 226: Usos Pedagogicos de internet
Page 227: Usos Pedagogicos de internet

227Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

PROYECTOS DE APRENDIZAJE COLABORATIVO

PROPÓSITOS

• Evidenciarlasenormespotencialidadesdeproyectoscolaborativos fundamentados en Internet.

• Comprender el concepto de proyectocolaborativo.

• Desarrollarproyectoscolaborativos,teniendoencuenta todos los elementos necesarios para su concepción, formulación, planeación y ejecución.

ENSEÑANZAS

ENSEÑANZAS AFECTIVAS

“Las tecnologías de la información y la comunicación ofrecen un entorno ideal en el que generar nuevos espacios educativos de construcción del conocimiento. El movimiento

de Comunidades de Aprendizaje se fundamenta en el aprendizaje dialógico, desde esta concepción comunicativa se considera que el aprendizaje depende principalmente de la interacción entre personas, de la construcción conjunta de significados. Diseñar espacios educativos virtuales bajo esta premisa exige situar la interacción en el centro del proceso

educativo”.61

Antonia Lozano DíazUniversidad de Almería

Una de las principales preocupaciones en los entornos educativos es encontrar la forma como sistemática y efectivamente será posible integrar tecnologías en procesos académicos y garantizar su contribución a la formación de individuos competentes para desempeñarse en forma óptima en el entorno social y cultural en el que se encuentran. En este sentido, la formulación y ejecución de proyectos colaborativos soportados con Internet presenta una alternativa con gran potencial para alcanzar los objetivos mencionados en tanto que estos proyectos (precisamente por ser proyectos) responden a necesidades específicas en

forma sistemática y planificada integrando diferentes actores. Al vincularlos a Internet encuentran en este medio una excelente plataforma de soporte para su ejecución, ya que permite interconectar en forma permanente a los diferentes actores, ampliar las posibilidades de comunicación y encontrar infinidad de ejemplos, recursos e información de base para su ejecución. Así mismo, en estos proyecto Internet se concibe no sólo como una red de información sino como una plataforma con infinidad de utilidades para enlazar personas e intenciones en pro de un objetivo común.

Teniendo en cuenta que el medio en el que nos desenvolvemos actualmente requiere que los individuos desarrollen diferentes destrezas de aprendizaje (dada la amplia y veloz generación y reevaluación del conocimiento), es clara la necesidad de generar espacios y posibilidades para que los individuos aprendan a aprender y puedan compartir su saber.

“Las comunidades de aprendizaje cada día toman mayor fuerza, el trabajo colaborativo es considerado indispensable

en el quehacer de la escuela y de la sociedad entera”.

Por otra parte, trabajar con proyectos de aprendizaje colaborativo es una estrategia metodológica con grandes ventajas para apoyar el proceso pedagógico, pues permite dinamizar y diversificar los ambientes de aprendizaje con un propósito de aprendizaje claro. Así mismo, las características de los proyectos y las posibilidades de Internet promueven la integración de áreas, la interacción de diferentes personas y el desarrollo de habilidades cognitivas necesarias para construir conocimiento.

Este tipo de proyectos permite la aplicación de conocimientos aprendidos, por lo que pueden constituirse como herramientas de evaluación de competencias para interpretar situaciones, proponer

61 http://www3.usal.es/~teoriaeducacion/rev_numero_05/n5_art_lozano.htm

Page 228: Usos Pedagogicos de internet

228Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

soluciones y poner en juego una gran cantidad de saberes. Su principal finalidad es la búsqueda de soluciones a problemas que aquejan a la comunidad (barrio, escuela, localidad, ciudad, etc.). No obstante, la apropiación de saberes no estaría completa sin las capacidades de análisis, síntesis, proposición, etc., ya que “cuando se enfrenta un problema o tarea que constituye un desafío, utiliza el conocimiento, las habilidades, y las ayudas que otras personas han desarrollado, así como su propio conocimiento, habilidades y la experiencia adquirida en trabajos anteriores.”62 Esta estructura conduce al estudiante a desarrollar y potencializar competencias poco trabajadas tales como la interpretación, argumentación y la proposición, generando un cambio en nuestro sistema de enseñanza que le brinda a los niños y jóvenes espacios para la crítica, el análisis, la creación y la práctica.

Por otra parte, en estos proyectos se resaltan los espacios para el trabajo en grupo, lo que favorece el aprendizaje y permite ver en los pares aliados para alcanzar las metas comunes formuladas en consonancia con los intereses de los alumnos y los objetivos de aprendizaje. Dentro de estos trabajos grupales se produce el intercambio de ideas, discusiones, opiniones respecto del tema de aprendizaje en cuestión, lo que sirve mucho para que cada alumno aprenda algo de sus compañeros. Esto es aún más importante en este momento histórico en el que las estructuras sociales se han debilitado. “Un número importante de niños, adolescentes y jóvenes adultos se sienten solos, desconectados de sus padres, pares, o desconectados de la escuela, sin dirección y propósito y con una falta de una auténtica impresión de quiénes son y qué tipo de personas son (Johnson 1980)”.

Una vez se dé a conocer a fondo qué es un proyecto colaborativo telemático, cómo se desarrolla y algunos modelos, se harán evidentes razones suficientes para incorporarlos dentro de los procesos de aprendizaje. Sin embargo, para presentar una idea de los alcances de esta herramienta, se revisarán proyectos desarrollados o en vía de desarrollo, que tienen positivas repercusiones en la comunidad implicada.

Observe y lea con atención el proyecto Colaborativo Puertas a la paz en la página http://www.telar.org/paz/, que involucra a varios países latinoamericanos. El propósito de este proyecto es propiciar espacios intencionados de sensibilización, reflexión e intercambio que generen acciones y proyectos que contribuyan a modificar la realidad local y global para lograr una cultura fundamentada en la paz.

1Visite la página http://www.educarchile.cl/ntg/proyectos_colaborativos/1620/channel.html con el fin de consultar más material con respecto a la justificación de los procesos colaborativos y la página www.redacademica.edu.co para consultar la descripción de otros proyectos colaborativos de diversas temáticas generados en Colombia.

62 http://www.eduteka.org/tema_mes.php3?TemaID=0007

Page 229: Usos Pedagogicos de internet

229Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Este proyecto es una acción educativa orientada a generar CAMBIOS en la realidad sociocultural en que se vive con el fin de humanizarla.63

Este tipo de proyectos genera una gran cantidad de beneficios en la comunidad que se involucra, ya que además de incentivar la participación y democracia a gran escala desde la escuela se constituye un agente generador de alternativas y transformación social que trabaja desde la raíz de los pequeños y grandes problemas de la comunidad.

La página principal del portal del proyecto ofrece un menú muy completo para el conocimiento de éste. Dentro de la filosofía se encuentran los propósitos y objetivos, en la metodología la organización y la forma de contacto con el proyecto, en la sección proyecto completo se hace la presentación de este, tanto en documento Word como en Power Point.

Otro PCT interesante es Internet como recurso educativo para mejorar la comunicación escrita de los alumnos. El documento que registra esta experiencia desde sus objetivos hasta los logros alcanzados lo puede consultar en la página: http://www.educared.net/pdf/congreso-i/c7.pdfEste proyecto está encaminado a cubrir una necesidad que surge como una iniciativa escolar pero que se proyecta a diferentes niveles dentro y fuera de ella, ya que concierne a procesos comunicativos tanto primarios y sencillos (cartas, notas, poemas), como elevados y especializados (ensayos, sustentaciones, artículos, etc.).

Después de haber analizado los dos proyectos modelos, organice un debate con los compañeros de trabajo y compare estas dos experiencias teniendo en cuenta:

• Lamaneraenquesurgen• Losproblemasqueabordan• Losobjetivosplanteados• Lasactividadesquedesarrollan• Elimpactoenlacomunidad• Yotrostópicosqueobserveyconsiderepertinentetratar.

63 http://www.telar.org/paz/

1Sugerimos una revisión exhaustiva, no sólo de los enlaces mencionados, sino también del resto de la página, y que posteriormente elabore un documento con las impresiones que le deja este proyecto, para comentarlas en grupo.

Page 230: Usos Pedagogicos de internet

230Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

ENSEÑANZAS COGNITIVAS

P.1 Un proyecto colaborativo es una aplicación de Internet en procesos pedagógicos.

P.2 La elaboración de guías, la investigación temática y el aprendizaje autónomo por parte de alumnos y profesores, son otras formas de implementar Internet en los procesos educativos, diferentes a los proyectos colaborativos.

P.3 En los proyectos colaborativos se busca la integración de todos los miembros de una comunidad en pos de la solución interdisciplinaria, de problemáticas y necesidades colectivas.

P.4 Los proyectos colaborativos escolares,los proyectos colaborativos sociales y los proyectos colaborativos de intereses comunes son dos clases de proyectos colaborativos.

¿Qué es un proyecto colaborativo soportado con Internet?

Un proyecto colaborativo es una aplicación de Internet en procesos pedagógicos que permite en forma muy efectiva integrar recursos de Internet con un propósito de aprendizaje. Ya hemos comentado otras formas de integrar Internet en procesos pedagógicos (elaboración de guías, aprendizaje autónomo, investigación temática). Los proyectos colaborativos se diferencian de estos por cuanto implican el trabajo colectivo de diferentes actores con problemáticas comunes que buscan dar una solución a las mismas.

Aplicación de Internetcon enfoque pedagógico

o Objetivo: Solución a problemas comunes

o Cada miembro del grupo es responsable del aprendizaje de los demás.

o Interdisciplinariedad.

Proyectos colaborativos escolares Proyectos colaborativos sociales Proyectos colaborativos de intereses comunes

Elaboración de Guías con base en recursos de la red.

Investigación temática.

Aprendizaje autónomo.Intercambio académico

PROYECTO COLABORATIVO

SOPORTADO CON INTERNET

Page 231: Usos Pedagogicos de internet

231Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Son principalmente actividades con propósitos efectivos, que se apoyan en el aprendizaje significativo relevante por su carácter motivante y de interrelación entre diferentes disciplinas e individuos. Esta interrelación es fundamental para cumplir uno de los objetivos de los PCT, ya que del buen trabajo depende que el proyecto progrese o no y alcance los resultados esperados.

Así mismo, estos proyectos se caracterizan por ser interdisciplinares y por unir a profesores y estudiantes en la búsqueda de soluciones. Por tener una base pedagógica permiten desarrollar diferentes aprendizajes y en el proceso cada uno de los miembros es responsable tanto de su aprendizaje como del de los restantes miembros del grupo. El aprendizaje colaborativo se convierte entonces en un conjunto de métodos de instrucción y entrenamiento apoyados con tecnología y estrategias para propiciar el desarrollo de habilidades, conocimientos y conductas.

La principal cualidad de estos proyectos es la colaboración como esencia de la construcción de conocimientos.

“Colaboración es la construcción colectiva de un punto de convergencia, donde los objetivos o propósitos individuales de cada participante encuentra un espacio de realización, en consonancia y complementación con los objetivos o

propósitos de los otros participantes” 64

El profesor William Heard Kilpatrick fue el precursor de la idea del trabajo con base en proyectos en el primer cuarto de este siglo. Kilpatrick abogaba para que las escuelas se basaran en la elección de los proyectos que engendran “actividades con propósito”. El argumentaba que los proyectos ayudan a crear un ambiente de aprendizaje muy enriquecedor y que las experiencias de los alumnos no deben estar confinadas sólo a la sala o a la vida de la escuela. “Estas actividades con propósito llevan a que la institución

educativa no sólo prepare para la vida sino también a que sea vida en sí misma”. Una de las tristes nociones de la educación formal es que ésta tiene que, por obligación, ocurrir dentro de las paredes de la sala de clases. Las actividades reales, como su nombre lo indica, proveen de verdaderas oportunidades para el aprendizaje relevante de los alumnos. Un proyecto permite que los estudiantes interactúen activamente con otros y pertenezcan a la experiencia del mundo físico.65

Otro de los factores clave para fomentar la creación de proyectos colaborativos es el impulso cultural de la comunidad a la que pertenece el estudiante; dentro de éste se encuentra, por ejemplo: promoción de valores, folclor, costumbres, programas escolares, etc.

Al igual que cualquier proyecto, los PCT requieren de tres grandes fases para su óptimo desarrollo:

1. Planificación – fase Inicial de programación2. Organización – fase de selección, clasificación y

disposición de información3. Ejecución – fase de realización y cumplimiento del

proyecto

El inicio de este proceso es ya de por sí riguroso y exigente, aunque no por ello debe dejar de ser lúdico. Consiste en la detección de un problema o una necesidad que se quiera abordar para el planteamiento de una alternativa original.

Hay que tener en cuenta que el desarrollo de los proyectos colaborativos parte de cuestiones que requieren el hallazgo de una salida o alternativa para su mejora en una comunidad, necesita de la participación activa de los miembros que la componen, en este caso del cuerpo docente, administrativo y del alumnado. Estos últimos tendrán la oportunidad de adquirir una responsabilidad más grande a la que han estado acostumbrados, ya que tendrán un mayor control

64 http://www.inclusioneducativa.cl/proyectos.htm 65 http://www.educainformatica.com.ar/docentes/tuarticulo/educacion/proyectos/

Page 232: Usos Pedagogicos de internet

232Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

sobre su proceso de aprendizaje lo cual aumentará la motivación hacia éste.

Algunas características esenciales de los Proyectos Colaborativos

• LosPCTcuentanconunfacilitadordeproyectoqueacompaña y asesora a las escuelas participantes.

• Culminaconunproductoconcretoyparamostrar(publicaciones, página Web en Internet, muestras abiertas, acciones a desarrollar en la comunidad local, etc.)

• Presentaunaseriededetallesqueenmarcanlosobjetivos del proyecto: a qué edades está dirigido, planificación del tiempo, plazo final, propósito educativo, tipo de comunicación y respuestas requeridas, personas a contactar, etc.66

• Losparticipantesjueganrolespredefinidosyesenciales al objetivo del proyecto.

• Elprofesorformapartedeunequipoparticipativopara facilitar el aprendizaje. El profesor debe ser un motor del proceso; debe desplazarse de un equipo a otro, observando, escuchando, preguntando, respondiendo, ofreciendo sugerencias, actuando como guía y recurso”. Si bien el aprendizaje basado en proyectos colaborativos permite libertad a los alumnos, el docente es quien establece los límites, mantiene las expectativas y orienta en lo que es fundamental conocer, discutir y modelar. Así también deberá asumir un papel estimulador tanto del pensamiento individual como grupal.67

• Elestudiantetieneunpapelparticipativotantoenvariadas actividades de aprendizaje como en la

emisión de juicios respecto de lo adecuado de los propósitos. Durante un proyecto se espera que los alumnos sean capaces de demostrar su habilidad para planificar, organizar y llevar a cabo una tarea, resolver un problema, aplicar la iniciativa, imaginación, pensar lógicamente y comunicarse. Se espera también que los alumnos lleven un diario de aprendizaje documentando sus pensamientos de su éxito o fracaso en sus acercamientos, cambio en el estilo de investigación, otras reacciones y futuros planes. Los alumnos se responsabilizan de un proceso de búsqueda (investigación), identifican el problema, formulan hipótesis y seleccionan y aplican soluciones. Se programa y planea para el individuo fundamentándose en sus necesidades y problemas. No se planea para un grupo promedio, se recurre a la instrucción en grupo, el trabajo en equipos y asesorías individuales (al profesor).

• La responsabilidad del aprendizaje no esúnicamente del alumno, también lo es del docente, de los diseñadores, etc.

• Laevaluaciónbuscaverificarel logrode lospropósitos.

• Laevaluaciónserealizaatravésdepracticasdecampo, investigación, elaboración de proyectos trabajos etc.

• Laevaluaciónespermanentedadoquebuscaseruna oportunidad más de aprendizaje.

• Laplaneaciónsefundamentasiempreenlospropósitos de aprendizaje.

• Latecnologíaesvistacomounaherramientaquesoporta los procesos de comunicación y difusión.

66 OCHOA, Maria Patricia. ORREGO, Crecencio. Aprendizaje basado en Proyectos colaborativos telemáticos. http://www.informaticaeducativa.com/coloquios/mesas/uno/crescencio/proyectos.doc 67 Proyecto ENLACES (Chile), “Aprendizaje Basado en Proyectos”, documento de trabajo del proyecto ENLACES, Chile. Traducido y Adaptado de la revista “Educational Leadership”por Mónica Campos, Instituto de Informática Educativa Universidad de la Frontera, Temuco - Chile 1996.

Page 233: Usos Pedagogicos de internet

233Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

La integración de los participantes exige altos niveles de comunicación e interacción. Internet provee una plataforma sólida para este propósito.

¿Cómo se integra el computador como soporte a estos proyectos?

Proyectos y el uso de las comunicaciones a través del computador68

Por: Guillermo Covarruvias

Las estrategias para introducir el computador al curriculum pueden ser diversas y, muchas de ellas, dependerán exclusivamente de la creatividad del docente. Pero también pueden ser tomadas en consideración aquellas que nos parezcan pertinentes para mejorar los aprendizajes de los educandos y para que estos aprendizajes sean significativos.

Los proyectos colaborativos de telecomunicaciones son una buena alternativa para introducir el uso del computador al aula y continuar proporcionando nuevas posibilidades, no sólo para aprender a trabajar con base en proyectos colaborativos sino, también, para facilitar o fortalecer en los alumnos el desarrollo de habilidades que le permitan un buen uso del computador. Los niños se enfrentan a nuevas formas de aprendizaje y el computador les permite obtener un producto. Todos los niños pueden aprender. Es trabajo nuestro, los profesores, encontrar los métodos más efectivos y significativos para que la comprensión se haga más fácil y los aprendizajes ocurran.

Los proyectos interdisciplinarios generalmente llaman la atención de cursos de variados países y comprometen a estudiantes con diferentes niveles de conocimiento. En forma sutil es posible integrar las telecomunicaciones y por ende el computador al curriculum, al aula, provocando así cambios que se deseen lograr en el proceso enseñanza-aprendizaje.

Los proyectos colaborativos permiten tanto a alumnos como a profesores tener un amplio conocimiento y comprensión de otras culturas y de muchas posibilidades alrededor de ellos. Con el propósito de que los aprendizajes sean efectivos, los profesores debemos introducir al currículo diversos estilos de aprendizajes para promover mejor comprensión de lo que se aprende.

Muchos alumnos y profesores encuentran las actividades de comunicaciones por computador muy emocionantes al comienzo, pero este tipo de fenómeno es común en casi toda nueva experiencia. Después de un momento de emociones la novedad desaparece y los alumnos quieren más de esta experiencia. Es necesario entonces darle sentido y relevancia al uso de las comunicaciones. Si estas comunicaciones no tienen propósito y la recompensa es muy pobre no tiene sentido hacer esfuerzos.

Clasificación de proyectos colaborativos

Clasificar los proyectos colaborativos puede ser una labor bastante extensa ya que existen infinidad de enfoques para su realización. A continuación se presentan algunos criterios de clasificación que pueden ser de utilidad en el momento de plantear los proyectos de cada institución.

68 COVARRUVIAS, Guillermo. Proyectos colaborativos. http://www.nuevaalejandria.com/00/colab/proyectos-colaborativos.htm

Page 234: Usos Pedagogicos de internet

234Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

Criterio de clasificación Clases

Tipo de impacto Escolar, social, de intereses comunes.Origen Internos (de propia creación) o externos (vinculación a un

proyecto creado por otros)Disciplina De una disciplina o interdisciplinariosTiempo de desarrollo De corto o largo plazo

Sin embargo, con el propósito de dar un primer acercamiento abordaremos las clasificaciones relacionadas con el tipo de impacto.

¿Qué es un proyecto colaborativo escolar?

Los proyectos colaborativos de índole escolar son aquellos cuyo objetivo es dar solución a problemas académicos, relacionados con el aprendizaje de una o más áreas del currículo escolar en temáticas determinadas; su principal escenario de acción es la escuela, los actores son los estudiantes y profesores y los resultados tangibles están asociados a un mejor desempeño en las áreas escolares de impacto.

TALLERRevisión de proyectos colaborativos escolares.

Los proyectos relacionados a continuación son proyectos de índole escolar. En cada uno de los tres ejemplos sugeridos realice la siguiente exploración:

• Determineenformaclaracuálessonlosobjetivosyalcancesdelproyecto.• Comenteconsucompañerosupercepciónsobrelaestrategiametodológicaabordada(quétan

conveniente y coherente con los objetivos la encuentra, discuta la pertinencia de las actividades planteadas).

• Comentesuopiniónalrededordelpotencialdeaprendizajedelosproyectosencadaunadelasáreas.• Clasifíquelosteniendoencuentalosotroscriteriosrelacionadosenlatabladeclasificación.

Ingrese al sitio:http://redescolar.ilce.edu.mx/redescolar/proyectosEncontrará una serie de proyectos colaborativos, clasificados por su temática.

• Ingresealenlace“Latierrasemueve”ubicadoenlasección“Geografía”.• Ingresealenlace“Detlacuilosypergaminos”ubicadoenlasección“Historia”

Ingrese al sitio:http://www.redacademica.edu.co/ Busque el enlace “programas y proyectos” y, desde allí, ingrese a la sección “oriéntate”. Encontrará una

Page 235: Usos Pedagogicos de internet

235Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

serie de proyectos formulados y ejecutados que le servirán de punto de referencia en la formulación de los suyos.• Ingresealenlace“Queagradableeslalecturaylaescritura”

¿Qué es un proyecto colaborativo social?

Los proyectos colaborativos de índole social son aquellos cuyo objetivo central es la investigación y/o solución de problemas de la comunidad y cuya formulación está orientada a la formación de sujetos sociales con habilidades para comprender y transformar su entorno. Éstos pueden o no estar enmarcadas en un área del currículo, pero su principal objetivo es la acción sobre el entorno a través de la investigación social, la proposición de soluciones, los trabajos de campo, etc.

Los proyectos escolares y los proyectos sociales NO son excluyentes; un proyecto escolar puede tener incidencia social, y uno social incidencia escolar. La diferenciación se hace más clara al verificar el objeto de estudio a través del proyecto. Generalmente, los proyectos sociales encuentran apoyo en cada una de las áreas y, en todo caso, entre más disciplinas involucre (en forma estructurada y coherente), será más enriquecedor para los actores.

TALLERRevisión de proyectos colaborativos sociales.

Los proyectos relacionados a continuación son proyectos de índole social. En cada uno de los cuatro ejemplos sugeridos realice la siguiente exploración:

• Determineenformaclaracuálessonlosobjetivosyalcancesdelproyecto.• Comenteconsucompañerosupercepciónsobrelaestrategiametodológicaabordada(quétan

conveniente y coherente con los objetivos la encuentra, discuta la pertinencia de las actividades planteadas).

• Discutaalrededordelimpactosocialquepuedengenerarlosproyectos.• Comentecuálesconsideraqueseríanlosresultadosencuantoalaformacióndesujetossocialescon

potencial de transformación de su entorno. • Clasifíquelosteniendoencuentalosotroscriteriosrelacionadosenlatabladeclasificación.

Ingrese al sitio:http://www.tecedusin.gob.mx/vyp/evpp.html• Encontraráelproyecto:Estrategiasparacontribuiravalorarlavidaysusaccionesenunasociedad

donde la práctica de valores aseguren una vida sana y pacífica

Page 236: Usos Pedagogicos de internet

236Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

69 http://www.saludycambio.cl/gicams.htm

Ingrese al sitio:http://www.anep.edu.uy/ces/adolescenciaysalud/adolescencia.htm• Encontraráelproyectocolaborativo“Adolescenciaysalud”.

Ingrese al sitio:http://www.redacademica.edu.co/ • Busque el enlace “programas y proyectos” y, desde allí, ingrese a la sección “proyectos

colaborativos”. • Ingresealproyecto“Prevenciónsobrealcoholismoyusodedrogasalucinógenas”

Ingrese al sitio:www.colombiaaprende.edu.co• Busqueelenlace“Proyectoscolaborativos”eingresealenlace“Toleranciaparavivirenpaz”.

¿Qué es un proyecto colaborativo de intereses comunes?

Estos proyectos colaborativos permiten enlazar a personas con intereses comunes (ya sean artísticos, culturales, científicos, etc.) para que entre todos construyan saberes y soluciones relacionadas con el campo de acción. Estos pueden o no estar enmarcados en un área del currículo, sin embargo, generalmente son liderados e integrados por profesionales de diferentes áreas. Estos proyectos pueden ser abiertos a la comunidad en general y, en la mayoría de las casos, cualquier persona puede hacer parte de ellos.

Las facilidades de Internet permiten que estos proyectos estén integrados por infinidad de personas, ubicadas en diferentes partes del mundo que pueden compartir información y producción alrededor de una temática. Un ejemplo de este tipo de proyectos es “Salud y cambio”, red latinoamericana alrededor de la Medicina Social:

“Salud y cambio es parte de un proyecto colaborativo que incluye la creación de una base de datos y de un web site con material seleccionado de la producción de investigadores y académicos del campo de la Medicina Social latinoamericana.

La base de datos y el material documental así como el web site se localizan en la Universidad de Nuevo Mexico EEUU y será accesible a practicantes, académicos, investigadores, estudiantes y otras personas interesadas a través de Internet”.69

Page 237: Usos Pedagogicos de internet

237Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

TALLER Revisión de proyectos colaborativos de intereses comunes.

En cada uno de los tres ejemplos sugeridos realice la siguiente exploración:• Determineenformaclaracuálessonlosobjetivosyalcancesdelproyecto.• Comenteconsucompañerosupercepciónsobrelaestrategiametodológicaabordada(quétan

conveniente y coherente con los objetivos la encuentra, discuta la pertinencia de las actividades planteadas).

• Discutaalrededordelaspotencialidadesdelproyectoparageneraraprendizajesenlastemáticasmanejadas.

• Reviselafacilidadparaintegrarsealproyectoycuálesseríanlosposiblesrolesqueintervienenenelproyecto.

• Clasifíquelosteniendoencuentalosotroscriteriosrelacionadosenlatabladeclasificación.

Ingrese a el sitio:http://www.educar.org/participar/• Encontraráelsitiodeunambiciosoproyectocolaborativoquebuscaenlazaraprofesoresdetodoel

mundo en torno a diversos contenidos educativos. (Recomendado).

Ingrese al sitio:http://www.eco-index.org/• EstesitionaciódeunproyectodelaAlianzaparaBosquesquesellamó“CarreraparaSalvaral

Neotrópico” cuya intención fue desarrollar sistemas de monitoreo y evaluación para los proyectos de conservación. Este proyecto indicó una clara necesidad: los conservacionistas necesitan una manera fácil de compartir información y aprender de las experiencias de unos y otros. La lucha continua para conservar la biodiversidad ha dado como resultado proyectos exitosos que a menudo pueden llevarse a cabo en cualquier otro sitio y una mirada de lecciones aprendidas que pueden ayudar a no repetir los mismos errores y lograr resultados positivos.

Ingrese al sitio:http://www.cibersociedad.net/inicio.htm• ElObservatorioparalaCiberSociedadsedefinecomoComunidadDigitaldeConocimientosobrelas

dimensiones sociales y culturales de las Tecnologías de la Información y la Comunicación.

TALLERTALLER DE RECONOCIMIENTO

Revise la descripción de proyectos desarrollados por comunidades de Kennedy, Bosa y otros sectores de la ciudad, en la página http://www.redacademica.edu.co/. Organicen un debate en torno a esta lista de proyectos y comente cuál llama más su atención y por qué.

Page 238: Usos Pedagogicos de internet

238Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

ENSEÑANZAS EXPRESIVAS: CÓMO FORMULAR PROYECTOS DE APRENDIZAJE COLABORATIVO

Todo proyecto requiere un rigor para garantizar el cumplimiento de los objetivos. De acuerdo a una revisión previa de varios proyectos existen ciertos parámetros a establecer para tener claridad sobre los diversos aspectos qué componen el proyecto; como los siguientes:

Planeación del Proyecto

Genere ideas para el proyecto

Lo primero que ha de hacerse cuando se quiere desarrollar un proyecto colaborativo es discutir entre los miembros participantes las temáticas o problemáticas que podrían abordarse teniendo en cuenta el carácter prioritario y utilitario de éstas, es decir, se plantearán posibles ideas para la ejecución de un proyecto contemplando aspectos como:

• Losproblemasqueaquejanasucomunidad(Colegio, Barrio, Sector) o las necesidades que ésta tiene. Ejemplo: basuras, violación a los derechos, pérdida de valores como el respeto, problemas de gramática u ortografía, etc. Las posibilidades son muchísimas.

• Elimpactoenlacomunidad.Cómorecibiríalacomunidad la iniciativa.

• Losbeneficiosquetraeríaeldesarrollodeunproyecto alrededor de la comunidad.

• Qué disciplinas dialogarían en la ejecucióndel proyecto. Siempre se procurará involucrar varias disciplinas con el ánimo de fomentar la participación y de enriquecer la forma del proyecto. Es valioso e incluso necesario que el proyecto cuente con diversos aspectos artísticos (diseño gráfico, promoción y publicidad, elaboración de recursos físicos requeridos, etc), científicos (física, matemáticas, biología, etc) sociales y ciencias humanas. En general, es fundamental establecer

cuáles aprendizajes se pueden generar a través de los proyectos.

• Tengaencuenta resultadoseducativosqueobtienen los alumnos del plantel.

• Laviabilidaddeunproyectoqueabordelastemáticas planteadas. Reflexionar acerca de qué tan fácil o difícil resultaría la aplicación del proyecto, cuáles serían esas facilidades o dificultades y qué posibilidades habría de superar las dificultades.

• Alseleccionarel temadebeconsiderarsiespertinente asociar el uso de TICs al mismo.

• Esimportanterevisarelplandeestudiosparaubicar nivel, grado y asignatura (s) de apoyo.

Formule un problema

Una vez se cuenta con la temática establecida formule por escrito el problema en forma clara y concreta. La formulación del problema es la estructuración del proyecto pues es hacia allá hacia donde se encaminarán los esfuerzos.

En primer lugar, deberá revisarse si el problema es susceptible de resolverse mediante un proyecto colaborativo. Puede inquirirse sobre la significación del problema, es decir, si su solución representa una aportación importante al campo de estudios y si puede abrir nuevos caminos. Se aconseja además preguntarse: ¿Es un problema nuevo o ya existen trabajos sobre él? En este caso, ¿las soluciones son pertinentes?, ¿Vale la pena emplear tiempo y esfuerzo en su solución, aunque ésta sea provisional?

Formule los Objetivos

Una vez se tiene claro qué problema se va a atacar y en qué forma, se formularán los objetivos del proyecto. Recuerde que los objetivos son las metas que se busca alcanzar con el proyecto, por lo tanto, representan el norte del trabajo. Tenga en cuenta que los objetivos deben responder al problema planteado en la fase anterior, en forma completa. Formule un objetivo general y unos objetivos específicos. Es fundamental entender que los objetivos específicos son complementarios entre sí y apuntan hacia el

Page 239: Usos Pedagogicos de internet

239Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

objetivo general. Los objetivos responden a la pregunta: ¿PARA QUÉ?, ¿QUÉ SE BUSCA CON LA INVESTIGACIÓN?. Un objetivo debe redactarse con verbos en infinitivo que se puedan evaluar, verificar o refutar en un momento dado.

Seleccione la clase de proyecto a emprender

De acuerdo con el tema de interés que resultó del análisis anterior y el problema formulado determine si el proyecto será de índole escolar, social o de intereses comunes. Así mismo, determine si será interdisciplinar o de una disciplina.

Delimite el proyecto

Es importante establecer hasta dónde llegará con el proyecto. Cuáles serán los límites de las acciones, las investigaciones y de tiempo para su ejecución. Para ello, tenga en cuenta el perfil de sus alumnos, la cantidad de personas a involucrar en el proyecto, la disponibilidad de tiempo y la caracterización del problema.

Dé un título al proyecto

El título del proyecto debe ser preciso y completo. Está destinado a indicar dónde, qué, cómo y cuándo, en forma clara y sucinta indica el lugar a que se refieren los datos, el fenómeno que se presenta, las variables que sé interrelacionan y la fecha a que se refiere la información.

Justifique el proyecto: ¿Por qué?

Una vez que se ha orientado el proyecto, definido por el planteamiento del problema y establecidos los objetivos, se debe indicar las motivaciones que llevan a desarrollar el proyecto. Para ello se debe responder a la pregunta de: ¿POR QUÉ SE VALE LA PENA REALIZAR EL PROYECTO?

Elabore la descripción del proyecto

Elabore un documento resumen en el que aparezca la descripción del proyecto. Incluya:

1. Nombre del proyecto: Debe ser coherente con la temática del proyecto y reflejar los propósitos de éste.

2. Formulación del objetivo general y de los objetivos específicos del proyecto.

3. Resumen breve del proyecto.

Los futuros ejecutores encontrarán en estas línea, el resumen, la idea global del tema que se aborda, el objetivo general y el producto que se pretende lograr. La descripción puede resultar fundamental para lograr la motivación de los potenciales participantes, sean estos los propios alumnos u otros colegas con sus alumnos.

La descripción debe presentar la idea del proyecto y no debe abarcar más de diez líneas

Productos esperados

Este es quizá uno de los aspectos trascendentales en la formulación del proyecto. Es muy importante hacer objetiva la forma de medir el cumplimiento de los objetivos. Por esto, establecer qué se obtendrá con el proyecto será un faro para la ejecución de las acciones por cuanto presenta una base evaluable, objetiva y socializable. Así mismo, materializar el resultado del proyecto es motivador para los ejecutores por cuanto dará la idea de finalizar la tarea. Estos productos deben guardar absoluta coherencia con los objetivos planteados pues, de lo contrario, el proyecto apuntaría a diferentes vías. Son productos comunes: publicaciones, sitios web, revistas, entre otros.

Establezca la metodología a seguir: ¿Cómo?

Si ya se tiene claro el punto de partida y el punto de llegada, es necesario determinar la forma cómo se desarrollará el proyecto.

• Mencionelasactividadesarealizarenordensecuencial: ¿cuál es el proceso que se deberá ejecutar para lograr los propósitos? Es importante determinar las fases del proyecto, y establecer las actividades al interior de cada una de estas fases.

Page 240: Usos Pedagogicos de internet

240Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Recuerdequeseestácontandoconlasayudastecnológicas para soportar las actividades.

• Limitelasfasesylasactividades.¿Quéseesperalograr en cada fase?, ¿Qué se espera de cada actividad?

• Determinelosresponsablesparacadaactividad.

Determine el apoyo de Internet al proyecto

• Teniendoencuentalametodologíaestablecida,documente en qué forma Internet va apoyar el proceso. Determine quiénes y en qué momentos utilizarán Internet y cuáles servicios serán privilegiados.

Elabore un cronograma detallado de actividades: ¿Cuándo?

Establezca límites temporales para cada actividad. Planee en forma general y específica en qué momento se contará con las actividades finalizadas. Sea realista, no subestime ni sobreestime las tareas. El tipo de Cronograma recomendado para presentar el plan de actividades que orienten un trabajo de investigación es el de GANTT.

Determine las necesidades y fuentes de información

La información es fundamental para el desarrollo del proyecto. Contando con ayudas informáticas es posible sistematizar su recolección, almacenamiento, difusión y tratamiento en forma más eficiente. De acuerdo con el tipo de trabajo que se esté realizando las fuentes pueden varias. A continuación se presentan algunas sugerencias:

La investigación cualitativa utiliza los siguientes instrumentos y técnicas para la recolección de datos. Se eligen de acuerdo con el problema en estudio.

• Observación• Historiasdevida.• Autobiografías• Anécdotas.

• Relatos.• Registrosanecdóticos.• Notasdecampo.• Preguntasetnográficas.• Análisisdedocumentos.• Diarios,cuadernos.• Archivos.• Entrevistasnoestructuradasyestructuradas.• Entrevistaaprofundidad.• Métodossociométricos.• Inventariosylistadosdeinteracciones.• Grabacionesenaudioyvideo.• Fotografíasydiapositivas.• Testderendimiento.• Gruposfocalesogruposdediscusión.• Textos pedagógicos producidos por los

educadores.• Autoinformes.• Artefactosfísicos.• Análisisdocumental:actas,trabajosdeestudiantes,

artefactos, dibujos, juegos, mapas, etc.

Dado el carácter emergente (que va surgiendo) de la investigación cualitativa, todas estas posibilidades se seleccionan, se aplican, se conjugan y se replanifican, de acuerdo con el criterio del investigador a medida que el estudio avanza. No todos los instrumentos y técnicas se aplican en el mismo estudio. Un estudio cualitativo puede hacerse solamente a partir de historias de vida. Así mismo, puede utilizar mediciones o cuantificaciones sin que por ello pierda su carácter cualitativo. La perspectiva contemporánea de investigación admite el diálogo entre enfoques, técnicas y métodos. No hay método puro. Ningún método es, por sí solo, autosuficiente para comprender y transformar la realidad educativa.

La investigación cuantitativa utiliza los siguientes instrumentos y técnicas para recolectar datos:

• Cuestionarios.• Escalasdeactitudes.• Encuestas.

Page 241: Usos Pedagogicos de internet

241Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

• Análisisdecontenido.• Fichasdeobservaciónsistemática.• Testestandarizados:Testdeinteligencia,tests

de aptitudes, tests de personalidad. Escalas de intereses. Tests de vocacionalidad.

• Pruebasderendimiento.• Encuestasdeopinión.• Inventarios.• Fichasdecotejo.• Experimentos.• Técnicasproyectivas.• Estadísticasdescriptivas.• Pruebasestadísticas.

Recuerde que Internet es una enorme fuente de datos. Si el problema y los objetivos están bien delimitados la búsqueda de soporte en este medio será muy efectiva. Sin embargo, la idea de emprender proyectos colaborativos es involucrar a profesores y estudiantes con su realidad. Por lo tanto, no puede restringirse como fuente única de información a Internet. El trabajo de campo es fundamental para documentar el proyecto ya que la realidad de cada institución y de cada joven no es virtual... es real. Es esencial conjugar en forma eficiente todas las fuentes de información.

Determine las personas necesarias y sus roles: ¿Con quiénes?

Es importante relacionar las personas que participarán: asesores, equipo de recolección de datos, equipo de comunicaciones, equipo de relatores, etc., especificando el perfil y el rol que jugarán en el proyecto. Tenga en cuenta que las personas aprenden mejor cuando son responsables de sub-tareas dentro de las tareas grupales.

Muchas veces, cuando queremos entablar comunicación y establecer un trabajo colaborativo con colegas y sus cursos que son de regiones distintas a la nuestra, o de otros países, un mismo tema puede corresponder a otros cursos y a otras edades. Fijar el intervalo de edades de los participantes entrega límites pero también abre posibilidades de intercambio.

Especifique los recursos a utilizar: ¿Con qué?

Establezca qué recursos se necesitarán durante el proyecto. No olvide contar con herramientas tecnológicas de soporte. Garantice que todos los participantes tendrán una cuenta de correo electrónico y acceso a Internet en determinados momentos de la ejecución.

Establezca la forma y los momentos de evaluación del proyecto.

Defina los criterios que se utilizarán para evaluar el trabajo realizado por los participantes; tome en cuenta siempre sus propósitos. Establezca los momentos de evaluación: no limite la evaluación al final del proceso. Lo que no se mide no se puede controlar. La evaluación debe ser permanente y tenga en cuenta que existe la posibilidad de que deba replantear partes del proyecto según los resultados de las evaluaciones. Es fundamental que al delimitar las actividades sea muy claro que se espera en cada fase del proceso. Estos son los insumos de la evaluación.

“La evaluación tiene dos componentes. Uno es la evaluación de contenidos, la otra es la evaluación del proyecto como instancia de aprendizaje colaborativo. Desde el punto de vista de la evaluación de contenidos, además de las pruebas de rendimiento, se sugiere el uso de dos instrumentos: la bitácora y el portafolio. La bitácora consiste en el registro cotidiano del acontecer del proyecto según la perspectiva de quién mantiene la bitácora. De algún modo es un “diario de vida”. Se puede señalar que algunas preguntas que se pueden ir respondiendo en esta bitácora son: ¿Cómo se inició el trabajo? ¿Cuáles han sido las dificultades? ¿Cómo las he superado? ¿Cómo ha sido el trabajo de colaboración con las otras personas de mi grupo? ¿Cómo ha sido el trabajo colaborativo con personas de otros grupos? ¿Cuánto he aprendido? ¿De qué forma este tipo de trabajo me ha ayudado a aprender? ¿Qué ha significado para mi?. Evaluar el proyecto como instancia de aprendizaje colaborativo es importante. Para esto es importante la bitácora. Se pueden

Page 242: Usos Pedagogicos de internet

242Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

analizar las bitácoras de los profesores, de los encargados de grupo, y de alumnos al azar. El análisis de narraciones de los alumnos respecto a la experiencia, son fórmulas de evaluación cualitativa que entregan una muy rica información de los aspectos íntimos del proyecto”.

El portafolio consiste en una carpeta donde se van almacenando los estados de avance del proyecto. Porque en un proyecto de aprendizaje colaborativo trabajan las personas en grupo, y cada persona al interior de cada grupo tiene asignado un rol y tareas específicas como ha sido presentado en el esquema de aprendizaje cooperativo, se debe tener una carpeta para el grupo y tantas carpetas individuales como participantes haya en el grupo. El producto se puede mantener actualizado en el sitio Web o enviarlo en un archivo a los demás colaboradores en el proyecto, en los tiempos que esté estipulado.70

70 www.redenlaces.cl/doc/Ucv/web/site/centro0305.htm 71 Flórez, Rafael. “Hacia una Pedagogía del Conocimiento”. Editorial McGrawHill. Santafé de Bogotá, 1997.

Para tener en cuenta:

• Sedebenbuscaractividadesquepermitandelocotidianollegaralconocimientoespecíficodelamateriaencuestión,como también no ahorrar en experiencias constructivas para el educando.

• Esimportantetenerconcienciaqueenesteprocesoelaprendizajeesmutuo.Busquedejarqueelalumnoleenseñe,dele esa oportunidad.

• Nuncamenosprecielologradoencadaclase.¡Cadaclaseesúnica!.Sisepiensadeéstamaneranohabránecesidadde decir: “Vamos Atrasados”, pues se verá que aunque no sea de una manera secuencial tal y como está presentado el programa en el papel, todos los objetivos se lograrán y los temas serán cubiertos.

• Siempresedeberelacionarlaactividaddesarrolladaconelconocimientoinherenteaésta,yésteasuvezconsuaplicabilidad.

• Sedebeestimularlainvestigaciónatravésdecasosypreguntas.Amedidaqueseavanceenlassolucionessedebengenerar replanteamientos que lleven a precisar mejor los supuestos, las premisas y sus restricciones.71

Page 243: Usos Pedagogicos de internet

243Copyright© Todos los derechos reservados

Unidad 1 Unidad 2 Unidad 3 Unidad 4

TALLER

1. Al final de este taller encontrará una lista de páginas de portales educativos, en ellas podrá encontrar diferentes proyectos colaborativos. Reúnase en grupo con 4 compañeros y elijan uno de los proyectos que les llamen la atención discutan acerca de él:

• Cómoestáplanteado.• Utilidad.• Recursosnovedosos.• Facilidaddeimplementación.• Verifiquelaformacómosehadesarrolladoelprocedimientodeformulacióndelmismo.• IdentifiqueenquéformaInternetessoportedelosproyectos.Y otros factores que crean necesarios para posteriormente exponerlo al resto de los compañeros. 2. Ahora van a desarrollar su propio proyecto. La idea es utilizar información de Internet, buscar proyectos

similares que sirvan como ejemplo, extraer recursos novedosos, etc. Tome como ejemplo el Proyecto Pedagógico de Aula Lectores para el futuro, del profesor Rubén Darío Suárez.

(www.colombiaaprende.edu.co/innova/1600/article-72759.html).

3. No olvide que pueden plantearlo en torno a una problemática escolar o comunal. Esta actividad puede requerir de varias sesiones, el objetivo será exponerlo y elegir uno para adecuarlo e implementarlo por medio de la página de este curso.

Relación de sitios recomendados en donde pueden encontrarse referentes interesantes en para el proceso de formulación de un proyecto colaborativo

• http://www.cibereduca.com• http://www.contraclave.org• http://www.culturalandia.com/• http://www.educaguia.com• http://www.liceus.org/• http://www.forumdigital.blogspot.com/• http://www.eduteka.org/• http://www.colombiaaprende.edu.co/sitios/1610/propertyvalue-27263.html (proyectos colaborativos en Colombia)• http://www.eduteka.org/directorio/index.php?sid=396424953&t=sub_pages&cat=279 (proyectos colaborativos ejemplos)• www.conexiones.eafit.edu.co• http://www.nuevaalejandria.com/maestros/clases/ (compartir material entre docentes hispanoamericanos)• http://www.avanza.org.co/(portaleducativocolombiano)• http://www.sol-e.com/(serviciodeorientacióndelectura)• http://www.educoas.org/• http://www.educared.org.ar• http://www.escobar-site.com.ar/aula/paginas/convenio.htm

Page 244: Usos Pedagogicos de internet

BIBLIOGRAFÍA SUGERIDA

• FERRÉS,Joan,MARQUÈS,Pere(Coords.).(1996).ComunicaciónEducativa y Nuevas Tecnologías. Barcelona: Editorial Praxis.

• CABERO,Julio(Coord.)(1998).Mediosaudiovisualesynuevastecnologías para la formación en el siglo XXI Murcia: Diego Marín.

• MAJÓ,Joan;MARQUÈS,Pere(2002).Larevolucióneducativaenlaera Internet. Barcelona. Praxis.

• PAVÓN,Francisco.(2001).EducaciónconNuevasTecnologíasdelaInformación y la Comunicación. Sevilla: Kronos.

• REPARAZ, Charo; SOBRINO, Ángel; MIR, José Ignacio. (2000).Integración curricular de las NNTT. Barcelona: Ariel.

• RODRÍGUEZ DIÉGUEZ, José Luís, SÁENZ y otros (1995).Tecnología Educativa. Nuevas Tecnologías aplicadas a la Educación. Alcoy: Editorial Marfil

• SANCHO,JoanaMariayotros(1994).ParaunaTecnologíaEducativa.Madrid: Espasa-Calpe.

• SANJOSÉ,Carlos(Coord.)(1999).Tecnologíasdelainformaciónenla educación. Madrid: Anaya Multimedia.

• TEJEDOR,F.J.yVALCÁRCEL,A.G.(1996).PerspectivasdelasNuevasTecnologías en Educación. Madrid: Narcea.