El diseño gráfico

María Jesús Lamarca Lapuente. Hipertexto: El nuevo concepto de documento en la cultura de la imagen.


  
 

Inicio     navega al azar mapa conceptual 

Del diseño gráfico al diseño hipertextual

El hipertexto, sobre todo en la Word Wide Web y más concretamente, la hipermedia le deben mucho al diseño gráfico. Aunque hay autores que afirman que el diseño gráfico surge al albor de la imprenta, de la revolución industrial o de las vanguardias del siglo XX, lo cierto es la historia del diseño gráfico es tan larga como la comunicación visual. Los ejemplos aquí aludidos sobre los inicios y desarrollo de la escritura y la fusión entre imagen y texto (pictogramas, jeroglíficos, caligrafías china y árabe, etc.) confirman que es un arte de raíces muy antiguas.

Ya en los códices, la escritura fue en sí misma un vehículo expresivo del arte y estos trabajos artísticos se mecanizaron con la introducción de la imprenta. El collage, por ejemplo, ha sido utilizado desde antiguo, aunque es en la revolución industrial cuando el diseño gráfico cobra gran importancia,Collage de miniaturas enlazando con la pintura, la poesía y la arquitectura del siglo XX y adquiriendo un gran desarrollo gracias al impulso de los medios de comunicación de masas.

Hoy se produce una extraña mezcla entre arte y técnica, debido al potencial de la imagen y los sonidos digitales. La introducción del sonido, fotografías e imágenes fijas de diversos tipos, animaciones e imágenes en movimiento, vídeos y otras morfologías en el hipertexto (hipermedia) se convierten en los vehículos expresivos no sólo del arte tecnológico y digital, sino del propio texto. Escritura textual, imagen y sonido se funden y confunden en el hipertexto. La forma cobra tanta importancia como el contenido.

Collage de miniaturas. Norte de Francia (posiblemente París), 1470-1490.
 http://www.library.upenn.edu/special/gallery/schoenberg/aop30_link.html

Algunos textos poéticos ya utilizaban características visuales y sonoras como parte de su campo imaginativo, como hemos visto en el caso de los caligramas y la poesía visual como un intento de fusión entre imagen y texto. Pero es es el siglo XIX cuando se empiezan a establecer relaciones más estrechas entre la imagen y el texto, gracias a la aparición de medios técnicos como la litografía y el grabado en acero. Los medios electrónicos elevaron esas potencialidades pero hoy, los medios digitales, suman nuevas potencialidades a límites inconcebibles hace unos pocos años.

Al igual que en el diseño gráfico, en el diseño de un hipertexto cobran una particular relevancia la tipografía, el color y la utilización de numerosos elementos icónicos.

La tipografía ha estado siempre ligada a su época y se sometía a los gustos y medios existentes en su tiempo. Los tipos góticos tienen mucho que ver con el arte de la época, el "modern style" de principios del siglo XX se refleja también en la tipografía, y el constructivismo está presente en las obras de la Bauhaus. La tipografía es una combinación indisoluble de forma estética y función práctica que en algunas épocas encuentran un perfecto equilibrio, mientras que en otras se produce un predominio de la forma expresiva sobre la función o, al contrario, el sentido práctico triunfa sobre el campo creativo y artístico.

cartel1   cartel2   cartel3   cartel4

La tipografía clásica centrada usando varias formas de letras tuvo sus orígenes en los letreros y en la caligrafía, pero se buscaron nuevas formas de comunicación más efectiva. Toulouse-Lautrec fue el primero en usar la litografía para realizar carteles a gran escala, combinando imágenes y texto bajo una nueva estética y con una nueva funcionalidad que era dirigirse a una audiencia. Desde entonces, las calles de las ciudades se empapelaron literalmente con este nuevo medio y el cartelismo comienza su desarrollo imparable.

Los movimientos de vanguardia también utilizaron el cartel de forma profusa. Los futuristas no sólo introdujeron elementos de los anuncios en su literatura sino que, seducidos por la tecnología, se apropiaron de muchos elementos de la producción industrial. Nace la nueva tipografía y se crean numerosas revistas de corte experimental e innovador que quieren romper con la simetría de la página impresa. También los expresionistas utilizaron el cartel como base de sus ilustraciones agresivas y los dadaístas realizaban toda clase de montajes de imágenes -ilustraciones y fotografías- junto a composiciones tipográficas.

Durante y tras la revolución rusa, el cartel de diseño constructivista sirve para la apología política en la nueva Unión Soviética. E igual trascendencia e importancia tuvo el cartelismo de signo político durante la guerra civil española, donde la fotografía también se convierte en un medio muy útil para la propaganda política.

cartel5      cartel7   cartel8  

 cartel9   cartel10   cartel11   cartel12

Pero sin duda, el auge del cartel se manifiesta plenamente en su función comercial. La publicidad se empieza a desplegar no sólo a través de los carteles, sino también por medio de todo tipo de folletos, catálogos, embalajes, etiquetas adhesivas, libros, etc.

 publicidad1  publicidad2   publicidad3  Josep Artigas, Barcelona, 1948. Cartel publicitario para Cruz Verde, aún vigente. La imagen del señor del abrigo creada para un cartel se aplicará también en displays, anuncios y envases del producto.   publicidad5

   publicidad6         publicidad7      publicidad8  publicidad9

El cartel de cine, desde la aparición del cinematógrafo, ha sido también objeto continuo y permanente de tratamiento del diseño gráfico:

  cartel cine1  cartel cine2  cartel cine4  cartel cine5  cartel cine6  cartel cine7

Fuente: Cartelia http://www.cartelia.net

El cartel del siglo XIX es informativo, anuncia funciones de teatro, corridas de toros, cabarets, circos, festejos, etc. En el período de entreguerras los diseñadores trabajan con ideología. A partir de los años 40, los publicitarios trabajan para la empresa y los valores del mercado. Estas son las funciones predominantes en las distintas épocas, aunque todos estos usos conviven de forma simultánea. A partir de los años 60, el diseño gráfico ya forma parte indisoluble de la cultura y de la economía de los países industrializados. En la actualidad, la publicidad conjuga los valores del mercado con los valores estéticos. Una muestra bastante exhaustiva de carteles con fines publicitarios, se puede visitar en el Museo Virtual del Arte Publicitario del Centro Virtual Cervantes, que realiza un recorrido histórico por el cartel publicitario:  http://cvc.cervantes.es/actcult/muvap/

La publicidad siempre ha intentado fusionar el contenido textual con la forma de expresión. Mezclar ilustraciones e imágenes con argumentos persuasivos y seductores que conmuevan y muevan al espectador.

anuncio publicitario1   anuncio publicitario2  anuncio publicitario3   anuncio publicitario4

La revolución electrónica y la posibilidad de la manipulación digital de la imagen han tenido un gran impacto sobre el diseño gráfico de la publicidad. El morphing, o la posibilidad de metamorfosis continua de la imagen, ha facilitado esta labor hasta límites inimaginables.  

La facilidad de manipulación de la imagen hace posible que modifiquemos la imagen original a nuestro antojo y así, la imagen de un cartel original no sólo sirve a la publicidad para la que fue diseñado, sino que también se convierte en la herramienta base para la contrapublicidad y la reivindicación política anticonsumista contra el propio anuncio publicitario.

contrapublicidad1   contrapublicidad2   contrapublicidad3

      Fuente: Consume hasta morir. http://www.consumehastamorir.com/infografía

La prensa escrita (periódicos y revistas) es un medio que ha utilizado y desarrollado profusamente el diseño gráfico. La tipografía, la inclusión de ilustraciones y fotografías para documentar la "realidad" y el uso de otras composiciones plásticas más recientes como la infografía impresa en papel, han sido recursos masivamente utilizados por la prensa. La utilización de tecnologías mecánicas, electrónicas y ahora digitales ha supuesto una serie de saltos cualitativos para la historia y evolución de este medio. Hoy la fotocomposición por medio del ordenador facilita enormemente esta labor y, sin duda, la facilidad de tratamiento, almacenamiento, reproducción y manipulación que suponen la tipografía y las imágenes digitales, el uso de la infografía en pantalla, las imágenes y los gráficos interactivos, la aparición de las imágenes en 3 dimensiones  y la existencia de la realidad virtual que permite una inmersión virtual en la imagen, abren nuevos caminos y expectativas. El "lector" pasivo de imágenes se ha convertido hoy en lector activo o usuario interactivo, puesto que puede abrir las imágenes, desarrollarlas y modificarlas a su antojo.

 

En el diseño gráfico ya son imprescindibles las nuevaspantallas tecnologías: los ordenadores, los escáneres, las imágenes 3D, las impresiones digitales, etc. El diseño digital es una realidad nueva que ha revolucionado el diseño gráfico tradicional también sobre papel. Ahora proliferan las imágenes pixeladas típicas de la televisión o de Internet sobre papel, tipografías no suavizadas, decoraciones vectoriales típicas de Flash, etc. Pero la nueva revolución ha sido el diseño gráfico sobre las pantallas y el desarrollo masivo de las interfaces gráficas.

Fuente: Tecnología Digital: Interfaces http://www.imageandart.com/tutoriales/interfaces/intro.htm

Sin duda, la aparición del hipertexto y de la World Wide Wide ha creado una nueva profesión técnica: el diseñador de hipertextos o el diseñador de webs, y una nueva disciplina: la arquitectura de la información, puesto que en el diseño del hipertexto importa tanto organizar y estructurar el contenido de la información como la la presentación visual de ésta mediante la interfaz. El lenguaje HTML o Hipertext Markup Language es, en sí mismo, un lenguaje de marcas que dan más información que la información meramente textual (texto plano). Precisamente, las marcas o etiquetas del hipertexto no sólo permiten la existencia de los enlaces que caracterizan esencialmente al hipertexto, sino que añaden información vital para la tipografía del texto como son su orden, disposición, estructura y formato. Las etiquetas de encabezamiento y cuerpo del documento establecen la estructura del mismo y mediante otras marcas y atributos se establecen los tipos de fuentes (letras), tamaño, estilos tipográficos, etc. 

Quien escribe un hipertexto no precisa sólo manejar el lenguaje HTML (aunque ahora hay programas que nos facilitan enormemente esa labor sin tener ningún conocimiento previo del mismo), sino que también debe incluir una serie de elementos de presentación visual: texturas, imágenes fijas y en movimiento, logotipos, iconos, etc. Aparte del contenido y el diseño técnico de un hipertexto o una web mediante la creación de herramientas de navegación, usabilidad, interactividad y accesibilidad, hay que tener en cuenta también el diseño estético y funcional, y aquí surge la figura del diseñador gráfico que debe controlar las texturas, imágenes fijas y en movimiento, los logotipos, las nuevas logografías, etc. El hipertexto y la WWW constituyen un nuevo campo para el diseño gráfico. El diseño de la estructura hipertextual, su usabilidad, accesibilidad y la posibilidad de ofrecer interactividad son algunas de las características que deben tener en cuenta los diseñadores de la web.

Junto al autor del contenido de los documentos, hace su aparición el webmaster. Se trata del de la persona que mantiene, gestiona y actualiza las páginas. Cuando se trata de un entorno de trabajo en grupo o de un hipertexto colaborativo, pueden ser varias las personas que tienen autorización para ejercer la función de webmaster. Es corriente establecer unas pautas comunes a modo de recomendaciones o redactar un manual de estilo para que los diferentes webmasters y autores se atengan a ellas. De esta manera se pueden fijar normas para la tipografía, estilos y formatos de documento, lenguajes de marcado, forma de publicación, etc. Lo normal es utilizar un estilo común para dar a una colección completa de documentos o hiperdocumentos una coherencia visual. En ocasiones,gráfico de diseño HTML el webmaster ni siquiera es quien ha realizado el diseño original, puesto que es muy común descargar esta tarea en empresas y trabajadores especializados en el diseño web. Una vez creada una plantilla o varias plantillas de documentos por el diseñador, los gestores del web pueden fácilmente insertar el contenido sobre dichas plantillas. En cualquier caso, el webmaster realiza unas funciones similares a las del impresor en el medio impreso, ya que es quien da la forma externa a un contenido intelectual. Hacer buenas páginas webs multimedia es todo un arte, además de una técnica sumamente compleja, a pesar de que los recientes programas de edición de páginas web facilitan enormemente la tarea, pues ya no hay que teclear a mano las etiquetas en lenguaje HTML e insertar música e imágenes es "coser y cantar".

A primera vista y nada más entrar en la página principal de un hipertexto y, más concretamente de un sitio web, con casi total seguridad averiguamos si la función del sitio es mostrar un contenido intelectual -lo normal es que predomine la forma texto sobre la forma gráfica-, o si no tiene primordialmente esta función, en cuyo caso predominará la imagen sobre el texto. Podríamos decir que en este caso predomina la forma hipermedia sobre la forma hipertexto.

Si la página tiene un fin comercial y publicitario, la web se asemejará a un cartel multimedia y utilizará todas las técnicas del cartel publicitario e incluso las del anuncio televisivo. Aunque no será así en todos los casos, pues muchas webs con fines educativos echan mano de numerosos recursos multimedia (por ejemplo los museos virtuales), como también lo hacen los periódicos y revistas en línea. A fin de cuentas, el diseño de una página de periódico impresa se parecía mucho al diseño de una web tanto en su forma gráfica como en la función. La prensa se organiza en forma de cajas que pueden incluir texto e imágenes, ofrece columnas a modo de índices para luego dar entrada al desarrollo del texto, usa distintas tipografías, las fotos organizan el texto de las noticias a su alrededor y viceversa, en un resumen puede aparecer una fotografía en miniatura que a modo de icono conecta con el texto completo, un bloque de texto perteneciente a la misma noticia se enlaza en páginas distintas, etc. Y ahora es posible añadir nuevas funcionalidades como incluir vídeos, audio o gráficos interactivos y otros recursos audiovisuales. Realmente, la prensa se ha adaptado perfectamente a la tecnología hipertextual, porque estaba en la base de ella como lo demuestran la paginación, la diagramación, la composición en cajas o módulos, el modelo de texto en forma de pirámide invertida, la posibilidad de lectura fragmentada y multisecuencial, etc. La prensa on line y la prensa impresa se incluyen mutuamente. Cada vez es más frecuente el uso de la infografía sobre papel, y los gráficos interactivos en línea son verdaderas obras de arte que, a través de la imagen, cumplen una función explicativa mayor que su expresión en forma textual.

 infografía en papel2    infografía en papel2

Infografías sobre papel. Fuente: El País, 14-1-97 y El País, 26-9-97

 infografía interactiva

Infografía sobre la Web: El País, Los secretos de la vida. Las distintas formas de reproducción: http://www.elpais.es/


Bibliografía:

ACM SIGGRAPH. http://www.siggraph.org/

BASTOS DE QUADROS, Itanel. "El diseño gráfico: de las cavernas a la era digital". Revista Latina de Comunicación Social, núm. 19, julio de 1999. http://www.ull.es./publicaciones/latina/a1999fjl/70ita.htm

Ciberteca.net. Tutoriales de diseño gráfico http://www.ciberteca.net/directorio/diseno_grafico/

Clip-Art. The Net's Best Clipart, Font, Photo and Web Graphic Links: http://www.clip-art.com/

Computer Graphics Group (CGG). http://graphics.lcs.mit.edu/

FERNÁNDEZ COCA, Antonio. Producción y diseño gráfico para la World Wide Web. Barcelona, Paidós,1998

Image & Art. http://www.imageandart.com

La Logoteca. Archivo de marcas, símbolos y logotipos. http://www.visual.gi/logoteca/

MARCO ALEDO, José Luis. "La tipografía experimental". Métodos de Información. nº 6/7. Julio/Septiembre 1995. http://www.uv.es/biblios/mei6/fp3.html

NIELSEN, Jakob. End of web design. 2000. http://www.useit.com/alertbox/20000723.html

SAUTÉ, Enric. El diseño gráfico. Desde los orígenes hasta nuestros días. Barcelona, Gustavo Gili, 1979.

SATUÉ, Enric. El diseño gráfico en España. Historia de una forma comunicativa nueva. Madrid, Alianza Editorial, 1997.

Standford Computer Graphics Laboratory. http://graphics.stanford.edu/

Typephases. "Manual de diseño digital". En Manual de diseño digital. http://platea.cnice.mecd.es/~jmas/manual/html/diseno_grafico.html

Typephases. "Manual de diseño Web". En Manual de diseño digital. http://platea.cnice.mecd.es/~jmas/manual/html/diseno_web.html

Typephases. "Manual de tipografía: Uso, organización y creación de fuentes tipográficas digitales". En Manual de diseño digital. http://platea.cnice.mecd.es/~jmas/manual/html/tipografia.html

Visual. Magazine de diseño, creatividad y comunicación. http://www.visual.gi/html/portal.htm

  Arriba 


 Título: Hipertexto, el nuevo concepto de documento en la cultura de la imagen
 Autora: María Jesús Lamarca Lapuente (currículo personal)

 Contacta

 Tesis doctoral. Universidad Complutense de Madrid

 URL: http://www.hipertexto.info

 Fecha de Actualización: 08/12/2013   

 184 páginas web. 2.627 archivos. 2.208 imágenes. Tamaño: 52.406Kb.
 34.389 enlaces (10.436 externos y 23.953 internos)
  

 

Ver el perfil de María Jesús Lamarca Lapuente en LinkedIn

Esta obra está licenciada bajo las siguientes condiciones: 
Creative Commons License
Creative Commons Reconocimiento-NoComercial-NoDerivados-Licencia España 2.5.

 


OTRAS PÁGINAS DE LA AUTORA
 

           Blog El Cultural a la PuertaBlog El Cultural a la Puerta:: http://puertadetoledo.blogspot.com/ 

                                                                                                                AGETECA. Base de Datos de Gestión Cultural
                                                                                                                 Ageteca. Base de Datos de Gestión Cultural:
      
                                                                                                    http://www.agetec.org/ageteca

Fundación Ricardo Lamarca, ajedrez y cultura

Fundación Ricardo Lamarca, Ajedrez y cultura http://www.fundacionlamarca.es

 

 

La artesa digital

Blog La artesa digital
http://artesadigital.blogspot.com.es

Especial Poesía: Hasta allí hemos llegado

Blog La artesa digital Flickr La artes@ digital: Galería de fotos mundo
 digital y mundo analógico: http://www.flickr.com/photos/artesadigital/

Blog miembras

Blog Miembras: usos lingüísticos, políticos y sociales del lenguajeBlog Miembras: Usos lingüísticos, políticos
 y sociales del lenguaje http://miembras.blogspot.com

 

Mapa de navegación / Tabla de contenido / Mapa conceptual / Tabla de documentos / Buscador / Bibliografía utilizada / Glosario de Términos / Índice Temático / Índice de Autores