COM.

AUDIOVISUAL EN LA RED: CLASE TERICA

REDES DE COMUNICACIN E INTERNET -Introduccin: Redes de comunicacin. Internet: la Red de redes. - Redes de comunicacin: Redes de comunicacin: Conjunto de equipos, sistemas y medios de transmisin, analgicos o digitales, que posibilitan que la informacin circule de un punto a otro u otros. Red (Def. RAE): *Conjunto de elementos organizados para un determinado fin. Red del abastecimiento de aguas. Red telegrficas o telefnicas. Red ferroviaria o de carreteras. * Conjunto de ordenadores o de equipos informticos conectados entre s que pueden intercambiar informacin. # Convivencia analgico-digital. Hoy todo en da se digitaliza, aunque sigue habiendo medios analgicos. Las redes estn en transformacin digital. Brecha digital o crack tecnolgico. - Entorno analgico / entorno digital: Documentos analgicos Documentos digitales Informacin continua de naturaleza Informacin discreta compuesta de bits. diversa. Baja interactividad. Alta interactividad. Escasa reutilizacin. Alta reutilizacin. Impacto directo. Impacto mediato. Costes altos (impresin, almacenamiento Costes bajos o nulos de impresin, y distribucin) almacenamiento y distribucin. Gran dificultad de modificacin o Gran facilidad de modificacin o actualizacin. actualizacin. Gran dificultad de copia o reproduccin. Gran facilidad de copia o reproduccin. Bsqueda lineal y limitada. Bsqueda aleatoria y navegabilidad. -Internet: la Red de redes: Interconexin de redes: *Internet hace referencia a un sistema global de informacin que est relacionado lgicamente por un nico espacio de direcciones global basado en el protocolo de Internet (IP) o en sus extensiones. * Es capaz de soportar comunicaciones usando el conjunto de protocolo TCP/IP o sus extensiones u otros protocolos compatibles con IP. * Emplea, provee o hace accesible, privada o pblicamente, servicios de alto nivel en capas de comunicaciones y otras infraestructuras relacionadas. -Internet: cronologa: 1963: Transmisin de datos por paquetes. 1969: Networking. Se realiza la primera conexin remota entre computadores. Se crea la red ARPANET.
1

 1973: e-mail a nivel internacional (desde Estados Unidos llega a Noruega y Gran Bretaa) 1974: Nace el protocol TCP (Transmission-Control-Protocol) 1981: Theodor Nelson acua el trmino hipertexto. Slo se transmita texto. 1982: El Protocolo TCP/IP se convierte en estndar de comunicaciones para Internet. # Por el momento slo se transmita texto, nada de imgenes. 1990: Nace el lenguaje html para la creacin del hipertexto. 1991: Nace la WWW, con la creacin de documentos en html y el uso del protocolo http para la comunicacin de informacin de computador a computador. 1993: Desarrollo del navegador Mosaic (antecesor de Netscape). La WWW, que combina texto e imagen, empieza a reemplazar sistemas basados en mero texto (Gopher). 1994: 3 millones de hosts en Internet. 1995: WWW se abre a nivel comercial. Las empresas privadas forman parte ya de la red. Se hace accesible a todo el mundo. Ya no es slo para los militares o universidades. # Una vez saturada la red, se crea Internet 2. Ahora estamos en Internet 3. -Internet: la Red de redes. Internet Protocolo TCP/IP Servidores Dominios (IP/DNS) WWW Protocolo http. Traduccin de IP a URL. Cdigo html Traduce cdigos binarios al lenguaje natural. Soporta aplicaciones multimedia. Se asocia a multitud de formatos. Usuario Navegador. Mden. Direccin IP.

# Las conexiones pierden informacin en el trayecto de la central a tu casa. El servidor transmite informacin de un lado a otro. El servidor es de acceso a todo el mundo. Los caminos entre los ordenadores y las centrales no son rectos. -Qu son las redes de comunicacin e Internet? WWW: Consulta/Publicacin de Documentos y Servicios Hipermediales. WWW: hipertexto e hipermedia. > Hipertexto: texto que contiene enlaces con otros documentos. Seleccionando estos enlaces con el ratn o teclado se puede acceder a otro documento que a su vez puede ser hipertextual. > Hipermedia: los documentos hipermedia contienen enlaces a otros documentos textuales o a otros medios: sonido, imgenes, vdeo, programas (Java) - Sociedad de la informacin:
2

 2 definiciones: *Sociedad de la Informacin como el estado de desarrollo social caracterizado por la capacidad de sus miembros (ciudadanos, empresas y Administracin Pblica) para obtener y compartir cualquier informacin, instantneamente, desde cualquier lugar y en la forma que se prefiera. * Sociedad de la Informacin como el progresivo desarrollo y aplicacin de las Tecnologas de la Informacin y las Comunicaciones (TIC) y su impacto sobre las formas de organizacin econmica y social: continuo proceso de cambio, que ms all de lo estrictamente econmico, tiene vertientes sociales y culturales. Los riesgos y oportunidades son mltiples: queremos una sociedad de 2 velocidades, en la que la tecnologa de la informacin acreciente la distancia entre capas sociales, gnero o regiones, o una sociedad ms homognea que disminuya las diferencias? Cules son las acciones, los retos que hay que asumir? Cul es el papel de la industria, la administracin, los polticos o los usuarios? # Hay varias visiones del concepto de Sociedad de la Informacin. Economa poltica: -Concepto clave: nuevo orden mundial de la informacin. - Asumir: Que la comunicacin no es una actividad comercial como las dems: implicaciones culturales y sociales. Papel de los medios en el desarrollo social. El crecimiento exponencial de aparicin de nuevas tecnologas de la informacin y la comunicacin. El creciente peso de la informacin en la sociedad: hacia una sociedad de la informacin. La necesidad de establecer modelos diferenciados de desarrollo de las comunicaciones segn pases y regiones. -Y especficamente: El creciente proceso de concentracin en las industrias culturales. El entrelazamiento entre lo pblico y lo privado, muy patente en materia de radiofusin. El contexto moderno de imperialismo y neocolonialismo culturales: Relacin con el Estado dominante y/o con los estados subordinados. En cuanto a los medios de comunicacin social no se puede hablar de un nico modelo capitalista (rasgos especficos que varan segn el Estado-Nacin) -Economa poltica: Ante estas cuestiones se hace necesario establecer polticas de comunicacin nacionales, locales/regionales e internacionales. Polticas de comunicacin: qu modelos y estructuras de la comunicacin para qu modelo de sociedad? La investigacin en materia poltica se hace ms importante cuanto mayor es el crecimiento de la tasa de cambio tecnolgico. -Technological gap o desfase tecnolgico: Definicin: creciente distanciamiento tanto en trminos de conocimiento como de oportunidades econmicas al que puede dar lugar la desigualdad en el acceso
3

a las tecnologas por parte de los distintos sectores sociales y de los distintos pases. (E. Saperas). Estas desigualdades tambin se producen en los orgenes de la informacin, en la disponibilidad de los contenidos y en las lenguas utilizadas en la red (Knowledge gap) Factores que inciden en este desfase: *Magnitud y rapidez de la innovacin tecnolgica. * Desigualdades de partida. Por qu Technological gap est asociado a las nuevas tecnologas? Los viejos media (MCM): * Sus efectos se deban simplemente al nivel de exposicin. * Cobertura homognea. * Destinatario pasivo. Los nuevos media: *Efectos sobre la sociedad en su conjunto (peligro de brecha digital en la Sociedad de la Informacin) * Cobertura heterognea. * Destinatario menos pasivo (interactividad). Hamelink, una de las visiones ms negativas del Technological gap y sus efectos sobre la sociedad actual (SI): *En algunos sectores, la informacin se hace cada vez ms compleja y especializada. A pesar de la magnitud global de la informacin hay ms gente que sabe menos. * La explotacin de la informacin requiere de competencias que estn muy desigualmente repartidas en la sociedad. * El hardware y el software avanzados son caros. La mayora de los usuarios tienen que arreglrselas con instrumentos obsoletos. * La informacin slo es fuente de poder si se tiene acceso a una compleja infraestructura de produccin, tratamiento, almacenamiento, etc. * El control y el acceso a los avances tecnolgicos estn muy desigualmente repartidos por el mundo. -A qu llamamos sitio web? Crear sitio local: ventana sitio. *Antes de publicar un sitio, es decir copiarlo una vez finalizado en un servidor web, hay que empezar por crearlo en un equipo local. Todos los documentos que constituyen el sitio (pginas html, imgenes, animaciones) tendrn que ser almacenados en una o varias carpetas relacionadas. * Un sitio web es realmente una coleccin de archivos y carpetas en un ordenador conectado a Internet. Cuando estos archivos se encuentran en un ordenador local, reciben el nombre de sitio local. Cuando se encuentran en un servidor web, se llama sitio remoto. -Diseo de una WEB: Definicin de la estructura/niveles. Definicin de la estructura de pgina/pantalla. Navegabilidad/Ayudas. Principios del diseo de pginas web. -Definicin de la estructura/niveles. Secuencial o lineal.
4

*Para llegar a la ltima pgina hay que recorrer todas las anteriores. Adecuada para la presentacin de manuales o aplicaciones donde el usuario deba recorrer forzosamente una serie de pginas para conseguir su objetivo. * No es un modelo adecuado para un sitio WEB. Jerrquica. *Se agrupan las pginas en niveles, de tal modo que para llegar al ltimo nivel se debe pasar por los intermedios. * La mayor parte de los usuarios estn familiarizados con los diagramas jerrquicos, y les resulta fcil de comprender este esquema de navegacin. * Muy utilizado. Estructura muy bien, es difcil perderse. Un ejemplo sera la pgina web de la universidad. Permite muchos niveles. Problemas de la estructura jerrquica: hay que hacer muchos clicks. Retcula/parrilla. *Las parrillas son una buena forma de asociar variables, en una serie de categoras estndar. * Para tener xito con este tipo de estructura es necesario que las unidades individuales de una parrilla, compartan una estructura de temas y subtemas absolutamente uniforme. * Se relacionan de forma horizontal, y uno de ellos de forma vertical. Estructura cuadriculada. Red/web (Estructura telaraa) *El objetivo es fomentar el pensamiento asociativo y la libre circulacin de ideas; los usuarios siguen sus intereses en una secuencia nica para cada usuario. * Requiere mucha planificacin para evitar ofrecer al usuario un caos de enlaces innecesarios para llegar a determinados tems de informacin. * Se supone que esta estructura la tienen que tener todas las webs. Problemas de esta estructura: requiere mucha realizacin y puede ser muy saturada o larga. No se puede llegar a nica pantalla cuando hay mucha informacin. Se puede perder el usuario. * Esta estructura se utiliza cuando hay poca informacin, o cuando la web es pequea. Mixta 2. *Esta estructura es una combinacin de jerrquica y red/telaraa. * Los usuarios recuerda mejor la informacin con este tipo de estructura (jerrquica con enlaces cruzados del tipo estructura red), puesto que la estructura jerrquica resulta demasiado restrictiva y la red/telaraa ofrece demasiada informacin y lleva a la confusin. * Permite organizar la informacin sin ser restrictivo porque permite acceder a cosas de forma directa, sin caer en la confusin de tener todo en la misma pgina. * Esto es lo primero que se hace. A partir de esta estructura se desarrollan las pginas que necesito. Paralela. *En ficciones interactivas este tipo de estructura resulta de utilidad para organizar acciones o puntos de vista de una misma historia que se desarrollan simultneamente, permitiendo al usuario seleccionar diferentes puntos de vista.
5

 Concntrica. *En juegos o ficciones interactivas este modelo sirve para estructurar de un modo coherente las escenas de cada uno de los mundos o zonas del interactivo, articuladas en torno a tareas u objetivos que se plantean al usuario como condicin necesaria para acceder al siguiente nivel. * Utilizado en videojuegos y tambin para pginas webs (artsticas). Ejemplo: Mario Bross. Es una estructura concntrica. -Definicin de la pgina/pantalla. Una de las cosas ms importantes es estructurar el contenido de la pgina/pantalla. Dnde colocar el men de navegacin, cuntos elementos colocar, cunto espacio dejar para el contenido, etc. -Trabajo: hacer la estructura web de la pgina web que haremos de trabajo final. Pensar una pgina web que queremos hacer. La estructura tiene que tener un mnimo de 3 niveles. No todo tiene que tenerlo. Bien una de sus partes, o el todo. Ejemplo: de algo grande pasamos a 3 cosas ms pequeas. De esas tres cosas, de cada una, salen otras 3. Y de esas, otras tres. Quiere que enlacemos el primer nivel, con el segundo y con el tercero. Traer escrito. El men tiene que ir en el mismo lado. Tiene que repetirse. Tiene que haber una plantilla estable. Ejemplo: 1 nivel, pgina de inicio, 2 nivel, los enlaces a los que te lleva la pgina de inicio, 3 nivel, los enlaces a los que te llevan los enlaces. -Trabajo: hay que disear la pantalla base de Inicio. Tiene que servir para todas las secciones. Va a tener cabecera, barras a los lados, submen? Hay que decidir dnde poner la cabecera, si arriba o a un lado. En mi trabajo, poner una opcin en el men principal que ponga VOLVER. Mi pgina tiene una estructura jerrquica. Hay que disear nuestra pgina. Hay que pensar en la plantilla de pgina. sta se tiene que adaptar a todas las pginas de nuestra web. Cmo se adapta la estructura al 3 nivel? Es decir, hay que hacer la plantilla de todas las opciones de la web, tanto inicio, submen y enlaces. Hay que pensar en los contenidos de esa pgina, esto no se escribe, solo se pone el nombre del contenido. No puede variar el tamao. La estructura tiene que ser constante. En mi pgina no poner pginas despegables, porque tengo muchos enlaces. El men tiene que tener como mximo entre 8 y 10 enlaces.

-Navegabilidad / Ayudas: Men de navegacin: *Los mens de navegacin son bsicamente listas de enlaces hipertextuales a diferentes pginas o secciones. De su estructuracin depender en gran medida que los usuarios encuentren lo que buscan. * Pgina de inicio: la pgina de inicio es la puerta principal de acceso. Por ella entrarn la mayor parte de los usuarios. * Segn el tamao de tu proyecto multimedia, la pgina de inicio permite: -enlazar todas las pginas desde la pgina principal. - enlazar slo las secciones principales. Ayudas a la navegacin: *Iconos claros y unificados. * Distintos elementos: volver, rastro, mapa, etc. * Evitar callejones sin salida. * Incorporacin de ventanas nuevas (en web).
6

-Principios del diseo de pginas web: C.R.A.P.: Contraste, Repeticin, Alineacin y Proximidad. *Contraste. Elementos que no son lo mismo, deben de ser diferentes. Contrastando fuertemente los elementos, conseguiremos que el usuario se desplace de un elemento a otro acertadamente hasta el final de la pgina. * Repeticin. Repite el estilo de tu pgina durante toda ella, creando consistencia. Si relacionas elementos de una determinada manera en un rea, repite esta tendencia en otras reas. * Alineacin. Todo en la pgina necesita estar visualmente conectada con alguna otra cosa. Nada debera estar fuera de su lugar o en una posicin distinta del resto de elementos de diseo (salvo que ese sea el efecto a lograr). * Proximidad. La proximidad crea una relacin de significados. Elementos relacionados deberan agruparse, y entre elementos diferentes debera hacer el suficiente espacio entre ellos para que se apreciara esa diferenciacin. Estos elementos se tienen que aplicar a la composicin. -Lenguaje multimedia: La composicin: toda composicin tienen que tener una serie de elementos visuales. El mensaje visual: *Informacin (contenido) * Soporte: -Textura - Forma - Estructura - Movimiento - Lnea (elemento importante) - Color (elemento importante) - Tipografa (elemento importante) Textura: modificacin o variacin de la superficie de los materiales, sirve para expresar visualmente las sensaciones obtenidas mediante el sentido del tacto, para representar materialidad y/o volumen. *La textura no siempre tiene cabida. Cuando nos enfrentamos a la posibilidad de incorporar elementos con textura debemos preguntarnos: -Si est de acuerdo con el resto de los elementos. - Si el tema de la web es adecuado para la colocacin de elementos texturados. - Analizar qu clase de textura y en qu elementos debemos colocar texturas. Forma: es el elemento ms fcilmente distinguible y el ms abundante. Adems, resulta mucho ms sencilla la interpretacin de los mensajes visuales que otros, y la forma es el de ms sencilla captacin de todos los elementos visuales. Estructura: da cierto empaque a nuestra pgina web. Algunas veces es el elemento ms importante en una pgina web. Movimiento: Lnea: a pesar de la simpleza de la lnea, este elemento es esencial en la composicin. En el diseo de pginas multimedia, la lnea adquiere diversas

connotaciones y es elemento que contribuye a la estructuracin y organizacin y al resaltado y destaque de diferentes contenidos. Color: adems de las funciones habituales de contraste. Colores fros +/formalidad. Colores pasteles +/- placidez, comodidad y familiaridad. Colores clidos/fuertes +/- impacto visual. En un cartel slo se pueden destacar 3 elementos: como color, tipografa o imagen. Si se destacan ms elementos, no se resalta nada. El amarillo sobre fondo azul es la combinacin que ms se ven. Tambin se ven muy bien: negro sobre rojo y blanco sobre negro. Tipografa: no es un elemento bsico, aunque ahora est de moda. Tiene muchas limitaciones. La forma de utilizar la tipografa se hace como imagen. # Una pgina web es bsicamente texto hipervinculado. Sintaxis visual (Gestalt): *La necesidad de equilibrio tensin. Toda composicin necesita equilibrio y tensin. -La necesidad humana de ordenacin (horizontal/vertical) -La tensin = recuperar el equilibrio: nivelacin, agudeza visual, atraccin, agrupamiento, etc. -El movimiento genera tensin. Una figura que parece que se mueve genera algo de tensin. * Representacin simbolismo Abstraccin -Representacin = imagen fiel. -Simbolismo = simplificacin unvoca del significado debe reconocerse, recordarse, reproducirse -. -Nivel de abstraccin = nivel de arbitrariedad. - Toda representacin tiene un nivel de abstraccin. * Dinmica del contraste. -La explicacin del contrario compensacin. - El ojo busca patrones para aclarar el mensaje. - Contraste de tonos, colores, contorno, escala. Tcnicas de comunicacin visual (sintaxis visual): *Equilibrio Inestabilidad. * Simetra Asimetra. Obtener una simetra exacta puede resultar difcil, pero s se puede buscar simetra de bloques y espaciados. Disponer de los elementos de forma simtrica brinda sensacin de orden. * Regularidad Irregularidad. * Simplicidad Complejidad. * Sutileza Audacia. * Etc. - Trabajo: pensar en la estructura definitiva y hacerla fsicamente en Dreamweaver, en casa. Copiarlo en un pent y traerlo el prximo da a clase. Tambin traerlo impreso. Hacer slo el Index. Mantener la estructura estable. Para tener la misma estructura en cada apartado de mi pgina, una vez que ya he creado la estructura de la primera pgina en Dreamweaver, guardar como y cambiar el contenido. Hay que hacer un buen contraste entre el fondo y la letra que escribo. Mirarlo en Internet. -Examen: preguntas cortas. Examen da martes 13 de Marzo. A las 10:30. Si no se puede ir a esa fecha, se puede ir a Mayo. El examen vale un 50%, y es necesario aprobarlo.

- Trabajo: entregar la prctica final el 27 de Marzo. Entregar en el casillero, en un CD. Tanto la memoria como la pgina grabarlo en el CD. Las prcticas valen el 50% de la nota final. La pgina web debe seguir: utilizar plantillas, una estructura de navegacin con un mnimo de tres niveles, contener enlaces a pginas externas, vnculo de correo electrnico y un vnculo a un audio, video o animacin. Adems se tiene que hacer una memoria del proyecto, de entre 2000 y 2500 palabras (explicacin de los procesos de eleccin y decisin seguidos, justificacin de la finalidad y objetivos del proyecto, estructura elegida incluyendo el rbol, diseo de la interfaz o pantalla, elementos de diseo seleccionados y principios de usabilidad que guiaron su creacin). Poner en mi PGINA de qu va, en una lnea. -Qu es la Usabilidad? La usabilidad se refiere a la capacidad de un software de ser comprendido, aprendido, usado y ser atractivo para el usuario, en condiciones especficas de uso. Cuando el software usa una interfaz digital bien estructurada y la interfaz fsica desaparece. Definicin formal: *El grado en el que un producto puede ser usado por determinados usuarios para conseguir objetivos especficos con eficacia, eficiencia y satisfaccin en un contexto especfico de uso. # Hay diferentes grados de usabilidades dependiendo del contexto. Para que no haya problemas, hay que hacer aplicaciones especficas para cada aparato. El grado de satisfaccin del usuario tiene que ver en el contexto que usa el aparato. # Antiusabilidad: cuando la informacin no llega al usuario ni de la manera ni en el tiempo en el que l la quiere. -Usabilidad: aspectos a tener en cuenta: Utilidad del producto para el usuario. Facilidad de aprendizaje. Memorizacin. Eficacia. Que llegue al objetivo final. Eficiencia (errores). Hay que ver cuntos errores hay. Satisfaccin. -Importancia de la Usabilidad: Para el usuario: *Es la diferencia entre hacer una tarea de forma precisa y completa o no, de forma que el proceso sea ameno o frustrante. Para el desarrollador: *Es la diferencia entre el xito o el fallo de un sistema. Para el gestor: *Es determinante de la productividad. -Constancia de la Usabilidad. Usabilidad = Simplicidad = Satisfaccin del usuario = Mayores beneficios. La satisfaccin del usuario disminuye la incomodidad y el estrs. Beneficio directo para el usuario: menor tiempo de aprendizaje. Diseos usables suele implicar diseos ms simples. Diseos ms simples son ms baratos de construir. Diseos centrados en el usuario tienen xito en las aplicaciones de mercado. -Ejemplos que mejoran la Usabilidad en la Web:
9

 Resumen de una lnea del contenido al principio de un portal. Formato Simple en la Navegacin. Navegacin Rpida por el Portal. Accesos rpidos. Inclusin de ayudas a la navegacin, motores de bsqueda (ayudas a la navegacin: todo aquello que acompaa, es decir, opciones de volver, atrs, mapas de la web, etc.) NO utilizar imgenes, sonidos o animaciones simplemente para decorar la pgina. -Los diez mandamientos de la usabilidad (Profesor Pedro Pernas): Primer mandamiento: *Si algo es un botndebe aparecer un botn. *Si algo no va a serlo, no debe serlo. # Si algo no es un vnculo, que no aparezca una lnea abajo cuando se pone el cursor encima de una palabra. Segundo mandamiento: *No hagas un parque de atracciones. Un lugar web debe estar escrito en piedra. # Nada decorativo, que sea sobrio y estable. Tercer mandamiento: *No pongas nada importante a ms de uno/tres clicks de distancia. # La informacin complementaria puede estar a ms de 3 clicks, pero lo importante y bsico no. Cuarto mandamiento: *La ortografa es muy importante. Ms de lo que te crees. Quinto mandamiento: *No mates al usuario Mmalo y ponle fcil las cosas. # El usuario es el elemento principal, por lo que hay que facilitarle la navegacin. Que sea fcil y sencillo. Sexto mandamiento: *No cometers actos impuros. No mezcles estilos, lenguajes, etc. sin una finalidad concreta. Sptimo mandamiento: *Se puede hacer de otra manera ms simple? Entonces no uses artilugios complicados (flash). Para alucinar a tu audiencia, no hace falta que la flashees. Octavo mandamiento: *Siempre ha de ser posible la marcha atrs todos cometemos errores. # Que haya una opcin de volver atrs. Noveno mandamiento: *Sed breves, muy breves. # Es un principio bsico ser breve. Dcimo mandamiento: *Y sobre todo haced un buen examen de conciencia: -Qu sitio es este? (identificador del sitio) -En qu pgina estoy? (nombre de la pgina) -Cules son las principales secciones de este sitio? (secciones) -Qu opciones tengo en este nivel? (navegacin local) -Dnde estoy en el esquema de las cosas? (indicadores de usted se encuentra aqu) -Cmo puedo buscar algo?
10