Códigos visuales: elementos, percepción y lenguaje
1. Códigos visuales
El lenguaje visual es el lenguaje que desarrollamos en el
cerebro relacionado con la manera como interpretamos lo
q ue perc ibimo s a t ravés de l os ojos ("visual ment e"). Es el q ue
utiliza imágenes y signos gráficos. Tiene por objeto la
transmisión de mensajes a través de la imagen. El lenguaje
visual es el sistema de comunicación que se emplea en la
creación de mensajes visuales.
Formas
La forma es la propiedad de la imagen o de un objeto que define
su aspecto. En otras definiciones, como la de Adolf von
Hildebrand, es el movimiento que la cosa ha obtenido en su
lucha por ocupar un lugar en el espacio. La forma de un objeto
suele reconocerse por estar delimitada por su borde
proyectado desde un punto de vista que normalmente
corresponde con el punto de vista del observador. En el
lenguaje visual, la forma más en términos gestálticos, la
constituye el contorno o borde exterior general de una
entidad visual o figura, donde identificamos también
características como su color, textura, tamaño, luminosidad.
La forma puede ser abstraída obteniendo sus datos y
representada en forma de un dibujo en el plano. Igual que en el
mundo de las artes etc.
Colores.
El color es uno de los elementos esenciales de la
configuración de una forma como la interpretamos o la
apreciamos en el espacio. La ciencia en su objetiva
2. observación ha podido especular sobre diferentes maneras de
percibirlo. El color suele organizarse cromáticamente en un
círculo, en el que se suelen diferenciar los colores primarios
o generativos, los colores secundarios, producto de la
mezcla de dos primarios, y los terciarios, resultantes de la
mezcla de tres colores primarios, en algunos casos colores
"de menor saturación" o "intensidad" por la presencia de la
complementariedad en la gama cromática. También se suelen
diferenciar los colores luz de los colores pigmento. Dentro
de la gama cromática suelen distinguirse igualmente los
colores de gama fría (azul es, viol et as, verdes) de l os cál idos
(amaril l os, naranjas, rojos).
Los atributos perceptuales del color son la luminosidad, el
tono y la saturación. Desde el punto de vista físico, el color
es una propiedad que va relacionada a la iluminación y está
directamente relacionada con la forma. A nivel funcional,
psíquico, el color tiene un papel fundamental en la
comunicación, ya que conecta de un modo muy directo con el
campo emocional del individuo.
Textura
La textura hace referencia normalmente a los rasgos visuales
representados en la superficie de un objeto que da carácter e
identidad al mismo en la representación. Suelen ser pequeños
rasgos visuales que definen la relación de “veracidad” entre
el objeto real y el objeto representado. Así la textura de una
imagen o un fragmento de imagen, suele dar identidad
diferenciando al objeto representado. Las texturas suelen
integrarse en el conjunto de la imagen, aportando una
sensación ambiental y pasando muchas veces desapercibidas en
la imagen o en los objetos representados.
Existen dos categorías de textura:
-Textura visuales producto del comportamiento de la luz
sobre las superficies de los objetos; y la percepción que
tenemos de ella es solo de carácter visual.
3. - Textura táctil: cuando interviene el tacto y la vista. La
textura se puede describir como la cualidad de una superficie
que posee elementos texturantes. De estos elementos
texturantes se puede definir: tamaño, separación y dirección.
Compositivamente la textura, como elemento plástico, posee
un peso visual muy importante. La textura es el tipo de masa,
con sus diferentes tipos de ángulos, inclinaciones
definiciones, etc. Podemos sentir por medio del tacto y definir
el tipo de la textura por ejemplo: La cartulina tiene una
textura lisa, mientras que el piedrín tiene una textura áspera.
Iluminación
La iluminación es un aspecto más de la configuración de las
imágenes, ya que de ella depende que sean percibidas las
formas, los colores, y el resto de los elementos visuales en el
plano de la representación. La luz existe implícitamente en la
representación, pero también es sugerida a través de la
relación de contraste, de sombras proyectadas y demás
recursos visuales que sean representados.
Formas y elementos visuales básicos
A lo largo de la historia de la producción visual, se han
establecido diversas teorías en la búsqueda de una gramática
visual esencial que intenta recoger cómo interactúan los
diversos elementos que intervienen en las imágenes. Algunas de
estas teorías, aceptan que existe una serie de formas básicas,
como son el cuadrado, el triángulo y el círculo – de las
cuales es posible derivar formas y estructuras visuales más
complejas.
Independientemente a las formas básicas, existen un conjunto
de entidades gráficas que podríamos considerar esenciales,
muy relacionadas con el dibujo científico o sistema diédrico
como son el punto, la línea y el plano.
El punto es considerado la unidad mínima de expresión visual
por algunos teóricos de la imagen.
4. La línea es un elemento esencial y básico en la representación
visual. Suele usarse para delimitar espacios básicos o definir
elementos en la representación. La línea es un recurso esencial
en dibujo y básicamente delimita el espacio.
El plano hace referencia a una superficie delimitada
visualmente. El plano es el elemento visual básico de
representación del volumen. A través del plano se configura el
espacio tridimensional.
Percepción visual y Gestalt
La psicología de la Gestalt es una teoría de la percepción
surgida en Alemania a principios del siglo XX que alude a los
modos de percepción de la forma de aquello que vemos.
Nuestro cerebro decodifica la información que recibimos a
través de diversas asociaciones que se producen en el
momento de la percepción.
Los principios de la Psicología de la
Gestalt son:
• Ley de relación figura-fondo: El ojo reconoce una figura
sobre un fondo, sin embargo figura y fondo pueden funcionar
como fondo y figura respectivamente. En este caso se habla de
una relación reversible o ambigua. Un ejemplo claro de un
autor que haya realizado imágenes con estas características
es Escher.
5. Relación figura-fondo bien definida: La imagen puede
destacarse claramente del fondo.
Relación figura-fondo indefinida: También conocido como
"mímesis". En este caso se produce una confusión que no permite
diferenciar claramente la figura del fondo.
• Ley del Cierre: Nuestra mente añade los elementos faltantes para
completar una figura.
• Ley de la Semejanza: Nuestra mente agrupa los elementos
similares en una entidad. De este modo, dos elementos de forma
similar rodeados de elementos cuyas formas difieren a éstos,
serán asociados. La semejanza puede darse a través de las
variantes de la forma, el tamaño, el color, la textura, el tono
de los elementos y la dirección de las formas.
• Ley de la Proximidad: El agrupamiento parcial o secuencial de
elementos por nuestra mente.
• Ley de Simetría: Las imágenes simétricas son percibidas como
iguales, como un solo elemento en la distancia. Aún sabiendo
que la mitad de nuestro cuerpo no es exactamente igual a la
otra mitad, al dividirlo, percibiremos dos partes simétricas
pues responden a un mismo patrón de formas.
• Ley de Continuidad: La mente continúa un patrón, aún después de
que el mismo desaparezca.
• Ley de Simplicidad: Cuando miramos una figura la percibimos de
la manera más simple posible.
• Ley de Pregnancia: Cuando una figura es pregnante, por su
forma, tamaño, color - valor, direccionalidad, movimiento,
textura, nos referimos al grado en que una figura es percibida
con mayor rapidez por el ojo humano. Aquello que capte
nuestra atención en primer orden, tendrá mayor pregnancia que
el resto de las formas de la composición. Supongamos que, en
el caso de la pregnancia por tamaño, coloquemos 5 objetos
sobre la mesa, cuatro de ellos pequeños y uno de ellos enorme
en comparación al resto. Cuando nuestra vista se dirija a
estos, hemos de ver en primera instancia al más pregnante, en
este caso, al único de gran tamaño.
6. Todas estas leyes responden al modo de percibir del ojo
humano, a través del cual el cerebro decodifica la
información visual. Constituye el modo en que percibimos
constantemente. Actúa sobre nosotros, y nosotros actuamos
en relación también a ello.
En cuanto al manejo de los códigos visuales, tanto para su
estudio como para su empleo en la creación de mensajes
comunicacionales, es importante tener en cuenta las
relaciones entre el campo y la figura donde, además de las
características formales, la ubicación de los elementos
también es generadora de sensaciones e interpretada por
nuestro cerebro. De este modo, si delimitamos una imagen a
través de un encuadre, ubicando uno de sus elementos en la
parte central del campo, éste dará sensación de quietud y
atraerá al espectador. Sin embargo, si el mismo objeto es
ubicado en la parte superior central del campo, la sensación
generada será de tensión.
La sintaxis visual o sistemas de
ordenación
Algunos de los elementos sintácticos de la imagen o
principios del diseño visual son los siguientes:
• Alineamiento
• Balance
• Contraste
• Énfasis
• Espacio negativo o contrafirma.
• Movimiento
• Proporción
• Proximidad
• Repetición
• Ritmo
• Unidad
7. Diferencias entre
XHTML Y CSS
XHTML y CSS
XHTML es un est ándar (al igual q ue el HTML) propuest o po r
el Consorcio W3C, y se pretende conseguir que todos los
documentos web sean compatibles en cualquier
navegador (no sol ament e en ordenadores, sino t ambién en
c ual q uier disposit ivo). Según el propio organismo, es una
"reformulación del estándar HTML 4", con el que es
c ompat ibl e al 100%.
CSS son las siglas de "Cascade StyleSheet", y especifica la
forma del diseño de l os document os (t ant o XHTML c omo
HTML). Una misma página web (un mismo document o XHTML,
por ejempl o ) puede ser vist a de diferent e forma en un PC
que un PDA, gracias a diferentes hojas de estilo CSS.
Ut il izar XHTML+CSS t e puede ayudar a mejorar t u
posicionamiento web en Google. Por una parte,
conseguirás que el código de tus páginas web sea más
limpio y claro a los ojos del robot de
Google ('googl ebot ' es c apaz de l eer doc ument os XHTML).
Facilitar la labor a este robot siempre es un punto a
nuestro favor.
Por otra parte, aumentarás la densidad de las palabras
c l ave dent ro de l o s c ont enidos (ver 'dónde situar las
keywords'), ya q ue muc has de l as et iq uet as t e oc uparán
muchísimo menos espacio. Esto también supone un menor
peso para tus páginas web, lo cual Google agradecerá. Y
podrás a su vez cambiar rápidamente los estilos de
ciertas palabras, modificando la importancia que les
8. quieres otorgar.
Además, cumplir con el estándar XHTML te abrirá la puerta
a diseñar páginas web para dispositivos móviles o nuevas
tecnologías que vayan surgiendo. Y el uso de CSS te
permitirá cambiar el aspecto de estas páginas en cuestión
de minutos. En combinación con las páginas dinámicas,
puedes conseguir un sitio web realmente eficiente.
Originalmente, las páginas HTML sólo incluían
información sobre sus contenidos de texto e imagenes.
Con el desarrollo del estándar HTML, las páginas
empezaron a incluir también información sobre el aspecto
de sus contenidos: tipos de letra, colores y márgenes.
La posterior aparición de tecnologías como JavaScript,
provocaron que las páginas HTML también incluyeran el
código de l as apl icac iones (l l amadas scripts) q ue se
utilizan para crear páginas web dinámicas.
Incluir en una misma página HTML los contenidos, el
diseño y la programación complica en exceso su
mantenimiento. Normalmente, los contenidos y el diseño de
la página web son responsabilidad de diferentes personas,
por lo que es conveniente separarlos.
CSS es el mecanismo que permite separar los contenidos
definidos mediante XHTML y el aspecto que deben presentar
esos contenidos:
Figura 1.2 Esquema de la separación de los contenidos y su
presentación
Una ventaja añadida de la separación de los contenidos y
su presentación es que los documentos XHTML creados
son más flexibles, ya que se adaptan mejor a las diferentes
9. plataformas: pantallas de ordenador, pantallas de
dispositivos móviles, impresoras y dispositivos
utilizados por personas discapacitadas.
De esta forma, utilizando exclusivamente XHTML se crean
páginas web "feas" pero correctas. Aplicando CSS, se
pueden crear páginas "bonitas" a partir de las páginas
XHTML correctas.
10. Diseño editorial
El diseño editorial es la rama del diseño gráfico que se
especializa en la maquetación y composición de distintas
publicaciones tales como libros, revistas o periódicos.
Incluye la realización de la gráfica interior y exterior de
los textos, siempre teniendo en cuenta un eje estético
ligado al concepto que define a cada publicación y
teniendo en cuenta las condiciones de impresión y de
recepción.
Los profesionales dedicados al diseño editorial buscan por
sobre todas las cosas lograr una unidad armónica entre el
texto, la imagen y diagramación.
Historia del diseño editorial
Para comprender la evolución del diseño de publicaciones
hasta el desarrollo actual es necesario considerar en
primer lugar el concepto de grilla o retícula editorial. Se
trata del esquema que se utiliza para componer una pieza
editorial, que consiste en la organización del pliego
teniendo en cuenta distintos elementos, como los márgenes,
l a zo na a imprimir (manc ha) y l as c ol umnas. La gril l a permit e
ubicar la información y las imágenes para darles una forma
coherente. A partir de este orden el diseñador puede
desarrollar el diseño específico de cada publicación con
plena libertad. La grilla, entonces, es una guía útil para
el diseñador y también para el lector, ya que facilita la
legibilidad.
El diseño editorial se desarrolló a partir del Renacimiento
-mediados del siglo XV- con la invención de la imprenta de
tipos móviles, que produjo una revolución cultural. Sin
embargo, podemos afirmar que ya desde tiempos antiguos el
hombre recurrió a formas de diseño para conservar la
información por escrito. A la hora de escribir se utilizaron
primero placas regulares de arcilla o piedra. Luego, se
11. emplearon rectángulos de papiro para los manuscritos, y ya
para entonces se estableció escribir siguiendo líneas
rectas y márgenes.
En la Edad Media los copistas, encargados de la realización
de manuscritos únicos, establecieron normas referentes a
márgenes, columnas y espaciados que continúan vigentes en
Occidente desde entonces. Los copistas fueron, de alguna
manera, los primeros expertos en diseño editorial. Tenían
poder de decisión directo sobre la forma de cada ejemplar
copiado, poder que recién en el siglo XX recuperarían
los diseñadores gráficos.
Importancia del diseño editorial
Dado que el mundo actual presenta una cantidad enorme de
estímulos visuales, el diseño editorial es fundamental para
que el lector potencial de una publicación se convierta en
un comprador real.
Hay que prestar especial atención sobre todo al diseño
exterior de la publicación, así se trate de un libro, una
revista o un periódico, ya que la tapa, contratapa, solapas,
faja, sobrecubierta, lomo y título son determinantes para
que una persona se decida o no por una publicación. Si bien
el contenido es fundamental, el éxito en el mercado
editorial depende en gran medida del diseño externo de una
publicación, ya que éste puede hacerla sobresalir por sobre
otros textos.
Está comprobado que las personas deciden la compra de un
libro u otra publicación gracias a lo que leen en él para
texto (t apa, c ont rat apa y sol apas), especial ment e c uando
no conocen al autor ni el título de una obra.
El diseño exterior es la llave de acceso al contenido, por
ello es de gran importancia obtener una gráfica que
responda al mensaje que se transmite en el texto. Si esto no
es así se corre el riesgo de malograr la ardua tarea que
supone escribir un libro, o llevar a cabo una revista o
periódico.
12. Del mismo modo, un diseño de tapa y contratapa no acorde
al texto puede generar confusión en los lectores.
Legibilidad tipográfica
Es necesario no perder de vista que ante toda una
publicación debe ser legible, ya que sólo de esta manera se
podrá transmitir el mensaje correctamente. Para lograr una
lectura placentera no sólo es importante la organización
general del texto y la imagen, sino que la elección
tipográfica también es decisiva. Una mala decisión en
cuanto a la tipografía -su tamaño, interletraje,
interlineado y color- puede producir textos ilegibles. Por
el contrario, la decisión correcta dará por resultado un
texto de fácil lectura para los receptores. Hay que tener en
cuenta:
Tipografía:
La tipografía es el vehículo del contenido. Además, es parte
de la información visual del diseño general y debe ser
acorde al tema y al tipo de publicación. No es recomendable
elegir muchas tipografías, ya que esto suele producir
desorden y dificultar la lectura. Hay que seleccionar una o
dos teniendo en cuenta el mayor grado de legibilidad
t ipo gráfica, y t rabajar c on sus variant es (c uerpo, c ol or,
inc l inación, et c .). La el ec c ión también variará según la
extensión del texto. Si se trata de un texto largo, los
caracteres deberán ser abiertos, proporcionados y
regulares.
En caso de querer emplear una tipografía decorativa, ésta
deberá usarse en poca cantidad de texto como títulos por
ejemplo-, ya que posee menos legibilidad; también habrá que
considerar que sea coherente con el estilo de la
publicación.
Color:
El mayor nivel de legibilidad se logra si hay un contraste
máximo entre tipografía y fondo -negro sobre blanco o
13. viceversa-. Se pueden buscar variaciones de color, siempre
que se tenga en cuenta este principio de contraste.
Cuerpo:
La elección del cuerpo tipográfico depende de varios
factores, tales como el interlineado, el ancho de las
columnas y la cantidad de texto. En cuanto a esto último,
si se trata de un bloque de texto, el tamaño tipográfico
debe oscilar entre 8 y 11-12 puntos, de acuerdo con el tipo de
letra seleccionado y el público al que se dirigen la
publicación.
Interlineado:
El espacio existente entre las líneas se debe determinar
según el cuerpo tipográfico elegido. El interlineado tiene
que facilitar el pasaje de una línea a otra, y para eso el
criterio convencional es que sea un veinte por ciento
mayor q ue el cuerpo ut il izado (por ejempl o: 10/12, es decir,
c uerpo 10, int erl ineado 12). Las l íneas demasiado junt as
dificultan la lectura porque al leer se mezclan, y las líneas
demasiado separadas también lo hacen, ya que se dificulta
la unión entre ellas. Por otra parte, la medida del
interlineado depende también de la anchura de las columnas,
ya que, cuanto más anchas sean, más interlineado se
necesitará para mantener la legibilidad.
Interletrado:
La medida de interletrado -el espacio entre las letras-
determinará la densidad visual del texto. Los distintos
interletrados permiten, por una parte, adaptar el texto a las
formas elegidas. Por otra, permiten generar una textura
diferente.
Así, si se aumenta el interletrado se puede obtener un texto
más ligero y elegante. Si se reduce manteniendo la
legibilidad- se puede crear un texto con mayor continuidad.
Imagen
14. Otro de los elementos básicos en el diseño editorial es la
imagen, cuya elección deberá realizarse teniendo en cuenta
estos aspectos:
Funciones:
La inclusión de imágenes es fundamental, ya que es un modo
de reforzar, explicar y ampliar mediante el lenguaje visual el
contenido del libro, revista o periódico para el que se está
diseñando. La elección de las imágenes es, entonces,
significativa, y es importante que las seleccionadas sean
coherentes con el texto. La coherencia es clave para evitar
dar información extra innecesaria que pueda confundir a
los lectores. La selección de imágenes depende también de
los destinatarios de la publicación.
Los elementos visuales son sumamente importantes porque
atrapan la atención de los receptores y también porque
funcionan como formas de descanso en la lectura,
facilitando así la legibilidad.
Caja tipográfica
La caja tipográfica es un límite virtual que define el sector
que se imprimirá en cada una de las páginas. Se generan así
c uat ro márgenes (superior, inferior, l at eral izq uierdo y
derec ho), c uya dimensión se debe det erminar en c ada caso
particular. El margen próximo al lomo -en el caso de libros
y revistas- debe medirse de modo que no perjudique la
lectura, y para ello es necesario tener en cuenta el tipo de
encuadernación ya que éste determina el grado de apertura
de las páginas. En los márgenes superior e inferior debe ser
posible ubicar el cabezal, pie de página y folio.
Grilla o retícula editorial
La retícula es un esquema que permite subdividir el campo
visual dentro de la caja tipográfica en campos o espacios
más reducidos a modo de reja. Los campos o espacios
pueden tener o no las mismas dimensiones. La altura de los
campos se mide por el número de líneas de texto y su ancho
15. depende del cuerpo de la tipografía. Las medidas de altura y
ancho se indican con una misma medida tipográfica.
Los campos están separados entre sí por un espacio para
que las imágenes no se toquen y para que se conserve la
legibilidad. La distancia entre los campos es de una, dos o
más l íneas (dist anc ia vert ic al ); l a dist anc ia horizont al est á
en función del tamaño de los tipos de letra y de las
ilustraciones.
Tal como se planteó anteriormente, la grilla permite la
organización coherente de la información y de las
imágenes, teniendo en cuenta el objetivo principal de una
publicación: la legibilidad. Es una guía que le permite al
diseñador realizar luego el diseño editorial con libertad,
asegurando la legibilidad.
Material o soporte
Para las publicaciones impresas existe actualmente una
amplia gama de papeles que varían en gramaje, textura y
color. La elección del papel varía según el tipo de edición
y su presupuesto. A la hora de pensar el diseño editorial de
una publicación es necesario tener en cuenta la calidad del
papel a utilizar, ya que ésta es clave, por ejemplo, para la
elección de las imágenes y para el uso de los colores.
Además, el diseñador debe elegir el formato de pliego más
conveniente para evitar el desperdicio de papel, de acuerdo
con el tamaño de la página del libro, revista o periódico a
diseñar. Se deberán dejar márgenes de seguridad teniendo en
cuenta el corte final, como también los posibles defectos
en la medida original del pliego. Además se deben considerar
algunos centímetros más en el lado del pliego en el que las
pinzas de las máquinas impresoras toman el papel al
momento de imprimir.
Formato
16. El formato es el área total de la que se dispone para
realizar un diseño. Incluye los márgenes y la caja
tipográfica. A veces el diseñador puede elegir el formato,
con lo cual tiene amplias posibilidades de composición.
Pero en general está predeterminado y el diseñador debe
adaptar su diseño a medidas estándar.
Los márgenes -espacios blancos que rodean la
composición- tienen una función estética y una función
práctica. Por un lado, permiten que la lectura sea más
agradable. Por otro, facilitan la encuadernación de la
publicación.
Hay diferentes tipos de formatos según la cantidad de
columnas que se incluyan:
Formato de una columna: se utiliza para los libros; en
general se muestra sólo texto o sólo imagen.
Formato de dos columnas: facilita la combinación de
textos e imágenes.
Formato de tres columnas: ofrece muchas posibilidades para
combinar imágenes y textos de diferentes tamaños.
Formato de cuatro columnas: generalmente se utiliza en
periódicos y revistas dado que facilita la composición
cuando hay mucho texto.
En todos los casos hay que tener en cuenta el tamaño de
las columnas, ya que según éste se determinará el tamaño de
la tipografía.
Factores a considerar en el diseño editorial
Hay tres factores fundamentales en
el diseño editorial
Publicación
Es necesario saber ante todo qué tipo de contenido
presenta la publicación para la que se realizará el diseño,
17. así como también hay que tener en cuenta el medio. Cada
tipo de medio -revista, periódico o libro, y sus géneros
específicos- tienen sus características en cuanto a
formato, composición, información y jerarquía de los
elementos. Así, el diseño busca expresar el mensaje de la
publicación estableciendo una unidad coherente entre texto
y gráfica.
Lectores
También hay que considerar a qué público está dirigida una
publicación. La composición depende del perfil de los
lectores destinatarios. Debe adecuarse a las variables de
pertenencia social y cultural, nivel de educación, nivel
económico, edad y género, ya que, por ejemplo, hay grandes
diferencias entre una publicación orientada a adolescentes
y otra dirigida a amas de casa.
Competencia
A la hora de realizar el diseño no hay que dejar de tener en
cuenta las publicaciones de la competencia, sus principales
rasgos -positivos y negativos-. Este análisis permitirá
desarrollar un diseño original que distinguirá a la
publicación en cuestión por sobre las demás.
18. Elementos del diseño
editorial
Los elementos de la composición y la forma en que
estos se disponen, es «todo» en nuestra maquetación.
Cada uno de estos elementos tiene su función dentro
del diseño y por tanto su grado de importancia, que
cumplan su misión será su cometido.
El titular:
Es el elemento lingüístico más importante de la
composición, ya que tiene la misión de llamar la
atención e introducir al resto del contenido.
El titular puede ser largo, corto, más o menos grande, no
hay leyes sobre este tema, pero si algunas
recomendaciones que parten de estudios realizados.
Algunos autores recomiendan las frases y las palabras
cortas, que los titulares estén compuestos de
mayúsculas y minúsculas, que sea tipografía con serifa
para su mejor legibilidad, que el texto no esté en
negativo, o que no se utilicen elementos de puntuación en
los titulares cortos...
Pues bien, es cierto que todos estos puntos facilitan la
lectura, la atención, y mejoran el diseño en general, pero
todo depende de cómo se traten los elementos y su
composición.
Lo importante es que consiga llamar la atención,
transmitir un mensaje rápido, y si es capaz de
conseguirlo con una frase larga, será igualmente
bueno que un anuncio con un titular corto.. Lo
lógico es que el tamaño del titular sea mayor que
el resto de texto que exista en la composición, sin
olvidar que aún teniendo diferentes tamaños deben estar
19. equilibrados.
El cuerpo de texto:
Es normalmente el elemento al que menos s e le
presta atención, bien porque resulta pesado,
aburrido, o por la sencilla razón de que en
algunas ocasiones, con la imagen (infografía,
il ust rac ión...) y el titular ya parece que se han
desarrollado los elementos fundamentales, además el
texto "nadie lo lee". La cuestión es tener siempre presente
que cuando hablamos de un anuncio, por ejemplo, aunque
el tanto por ciento de personas que lean el texto sea
bajo, para el que lo lea el cuerpo de texto puede ser
nuestro mejor vendedor, por lo que deberemos cuidarlo.
Es quizás por este motivo, por el que debemos prestarle
una atención especial al bloque de texto (si lo hay),
hacerlo lo más legible y claro posible, procurar
que no sea pesado o denso, debemos hacer cruzar
la barrera del desinterés. Visualmente ese bloque de
texto debe invitar al receptor.
Pie de foto:
Este elemento tiene como misión dar información sobre la
fotografía, y normalmente es preciso y no muy denso.
Aunque pueda parecer de poca importancia, es uno de los
elementos que más se leen, por lo que debemos
aportar una información suplementaria a la imagen
y que pueda despertar más interés en otros elementos de
la composición.
Normalmente al pie de foto se le aplica un
cuerpo pequeño ( 6, 7 u 8 punt os), no debemos pensar
que eso evita su poder de atracción o visibilidad, ya que
normalmente el receptor se siente atraído tanto por
tipografía grande como por cuerpos pequeños en los
que hay que esforzarse para saber que dicen..
Al contrario que en la prensa, en publicidad no se
suele utilizar mucho. Aunque autores como Ogilvy
20. abogan por su utilización dentro de la publicidad, por el
poder de atracción que ejerce sobre el receptor.
Fotografía e ilustración:
Son por lo general los elementos que más llaman la
atención y es la parte de la composición que
seguro que miramos.
La presencia de una imagen abre al diseñador un abanico
de posibilidades mucho más amplio, ya que son
elementos que:
Proporcionan información.
Enseñan el producto tal como es.
Hacen la comunicación más real y creíble.
Sugieren, expresan sensaciones, estimulan...
La fotografía, aporta realismo y constituye en la mayoría
de los casos un modelo de la realidad, por tanto, debe
tener fuerza y un sentido específico y claro.
Debemos procurar que las fotografías utilizadas no
contengan información innecesaria, ya que esto puede
provocar confusión y desinterés.
Hay que tener una idea clara de lo que queremos
comunicar por medio de la fotografía para que el
contenido de esta sea exactamente lo que buscamos.
Un anuncio de revista de una empresa determinada, puede
utilizar una imagen que represente las características
de esta, su identidad, y todo lo que la empresa quiera dar
a conocer al público. De la misma manera, en la
composición de una revista o periódico, nos explica o
aclara de forma visual, una situación o noticia. A su
vez, las fotografías pueden ser clasificadas por su
impacto o llamada de atención.
Por ejemplo, si se quiere representar la seguridad de
un coche familiar con la imagen de una o varias
personas, puede que la presencia de un niño pequeño sea
21. más eficaz e impactante que la de un adulto.
La ilustración, es otra forma de transmitir una idea, un
concepto. El dibujo publicitario se ha desarrollado
notablemente en los diferentes medios publicitarios.
Puede ser tan eficaz como la fotografía y de
igual manera representar sensaciones. Dependiendo de
la composición o estructura que tenga la ilustración,
reflejará sensaciones diferentes. Por ejemplo:
- Las rectas pueden expresan fuerza, definición,
direccionalidad...
Por otro lado las líneas horizontales reflejan calma y
serenidad, y las líneas verticales
majestuosidad, superioridad...
- Las curvas pueden expresar movimiento, belleza,
flexibilidad...
En muchos casos muestra una gran dosis de originalidad.
Hay que tener en cuenta que la ilustración dentro de un
diseño, no es una parte independiente, sino un elemento
que forma parte de una composición, es decir de un todo.
El objetivo de una ilustración es, llamar la
atención, comunicar un mensaje o ambas cosas.
1. Las figuras, los fondos y todos los elementos que
compongan la ilustración han de tener un aspecto
agradable y atractivo.
2. Además debemos conseguir, no solo el aspecto
estético o de atracción, sino que exprese las
cualidades o características de lo que estamos
representando, es decir de lo que queremos comunicar.
El logotipo:
(ut il izado en ciertos casos, como anuncios,
catálogos, t rípt ic os...), es el elemento del diseño que
22. representa a la empresa, el producto, servicio del
anunciante, en definitiva, la imagen de la empresa.
Puede estar compuesto de texto e imagen o solo de texto.
El logotipo debe presentarse de una forma clara y
visible, y aunque normalmente se ubica al final, en el caso
de los anuncios, su posición puede ser perfectamente
otra, siempre que sea coherente y equilibrada con la
composición.
Espacios en blanco:
Tienen más importancia de lo que parece, aunque
algunos anuncios casi prescindan de ellos.
Los espacios es blanco transmiten claridad, libertad,
espacio, y ayudan en muchos casos a equilibrar la
composición.
23. Infografías
Infografía es un término periodístico que deriva del
ac rónimo de información + grafía y q ue t iene c omo
objetivo informar de diferente manera, por medio de
dibujos, gráficos, esquemas, estadísticas y
represent ac io nes.<
Nacieron en su día para explicar acontecimientos, hechos
históricos… y se mostraban por medio de una ilustración.
Tipos de infografías
1. Gráfico separado: Es cuando el gráfico está separado del
texto y el texto situado inmediatamente después del
titular.
2. Gráfico integrado: cuando el texto y el gráfico se leen
en conjunto.
3. Gráficos radiales: es una infografía que consta de un
centro y periferia. En el centro siempre se incluye
la imagen predominante y en la periferia: listados, cuadros
con anotaciones, secuencias de imágenes y destacados
que ayudan a explicar la imagen central.
24. 4. Gráfico en serie: al contrario del gráfico radial, esta
tiene un punto de entrada y uno de salida. Siempre es de
manera lineal, donde el texto junto con el gráfico
trabajan conjuntamente y de una manera coherente, para
que el mensaje llegue correctamente al receptor.
Hay otros tipos de gráficos que se utilizan y son menos
complejos como: mapas, ilustraciones, fotografías y
gráficos estadísticos. Estos en la actualidad son los
más utilizados. Aunque según que periódicos disponen
hasta de una guía de estilos donde especifican que tipo
de infografía a utilizar según la noticia.
1. Gráfico de barras funciona preferentemente con unidades
y lo que hace es establecer una comparación entre ellas.
Las barras presentan el mismo ancho y el alto depende de
la cantidad información que represente.
2. Gráfico de tarta indica la división de las partes de un
todo y sus proporciones, especialmente en porcentajes.
Está representado por un círculo que supone un todo y se
encuentra dividido en partes. Es importante recalcar que,
este tipo de gráfico se vuelve confuso, cuando se lo
divide en muchas partes porque la información se vuelve
desordenada.
3. El mapa es necesario para mostrar la ubicación de un
acontecimiento. El público lector está siempre interesado
en conocer dónde ha ocurrido un determinado hecho...
25. La semiótica
La semio l o gía o semiót ic a (véase l a rel ac ión y diferencia
ent re est os más abajo) es l a disc ipl ina q ue est udia el
signo y aborda la interpretación y producción del
sent ido, pero no t rat a el significado (q ue es abordado
po r l a semánt ica), ni las denominaciones, incluyendo en
est as l as verbal es (est udiadas por l a l exic ol ogía, l a
l exicografía y l a onomást ic a) y l as no verbal es (q ue
est udian l a simbol ogía, l a ic onografía y l a ic onol ogía).
Esto es, analiza los fenómenos, objetos y sistemas de la
significación, de los lenguajes y de los discursos y los
proc esos a el l o s asoc iados (produc c ión e
int erpret ación). Toda produc ción e int erpret ac ión del
sentido constituye una
práctica significante, un
proceso de semiosis que se
vehiculiza mediante signos y
se materializa en textos.
Se suele apreciar una
distinción entre semiótica
propiamente dicha, que
estudia el signo en general, y
semiología, que estudia los
signos en la vida social. Cabe
separarlas también de la llamada teoría de la información
y de la comunicología o ciencia que estudia los sistemas
de comunicación dentro de las sociedades humanas y la
hermenéutica o disciplina que se encarga de la
interpretación de los textos.
La semiótica es la ciencia o disciplina que se interesa por
el estudio de los diferentes tipos de símbolos creados
por el ser humano en diferentes y específicas situaciones.
26. Este estudio se basa en el análisis de los significados que
cada tipo de símbolo puede tener y cómo ese significado
puede ir variando a lo largo del tiempo o del espacio. Se
puede c onsiderar a l a semiót ic a (o t ambién c onoc ida
c omo semiol ogía) c omo una secc ión import ant ísima de l a
antropología ya que su trabajo versa sobre la cultura
del ser humano actual y de otras épocas. El término
semiótica proviene del griego semióticos, que significa
‘intérprete de signos’.
Uno de los elementos más complejos e interesantes de la
cultura es el conjunto de símbolos y formas que el ser
humano crea para diferentes situaciones o
circunstancias. Cada conjunto de símbolos se aplica a un
tipo de eventos o fenómenos y por eso su significado o
su interpretación es completamente particular y
específica. Los símbolos son representaciones más o
menos arbitrarias o subjetivas de esos fenómenos y el
nacimiento de los mismos tiene que ver con la necesidad
del ser humano de integrar tales fenómenos al lenguaje.
La semiótica entonces
se interesará por
analizar por qué esos
símbolos pueden tener
un significado en un
momento o espacio y
cambiar, o mantenerse a
lo largo del tiempo si
tal fuera el caso. Esta
tarea es la de los
antropólogos,
especialistas en el
lenguaje, arqueólogos y otros científicos que trabajan
con cuestiones relativas a la cultura. Se considera que
27. la semiótica nace a partir de las observaciones de
diferentes antropólogos y especialistas del lenguaje que
not aron q ue diferent es símbol os (no sól o gráfic os si no
también del lenguaje, del pensamiento o de las formas
emot ivas) se repet ían en diferent es espac ios y poseían
iguales o diferentes significados de acuerdo a cada
comunidad.
28. Proceso de
construcción de
páginas web
Etapa 1: recopilación y aprendizaje
La primera etapa en la creación de un sitio web consiste
en recopilar la mayor cantidad de información posible
para conoc er l o q ue q uiere (y l o q ue no q uiere) para su
sitio. Puede recopilar esta información observando los
sitios que usa actualmente, los sitios de sus
competidores y los comentarios de sus amigos y colegas.
Como muchas empresas, puede optar por contratar los
servicios de un diseñador web experto para crear su sitio.
Esté preparado para responder a las preguntas del caso,
ya que estas son necesarias para el armado de un "informe
creativo". El "informe creativo" funcionará como guía o
29. referencia para la creación del sitio. Independientemente
de si contrata o no a una empresa de Etapa 2:
planificación
La información recopilada en la etapa 1 lo ayudará
enormemente a la hora de planificar su sitio. Ahora se
deben llevar a cabo las siguientes tareas:
Creación del mapa del sitio. Haga una lista de todas las
áreas temáticas del sitio, así como los subtemas, para
desarrollar un sistema de navegación homogéneo y fácil
de entender.
• Decisión sobre las tecnologías requeridas. Determine
lo que necesitará para sus formularios interactivos,
aplicaciones flash o sistemas de gestión de contenidos
(CMS).
• Determinación de las resoluciones
compatibles. Teniendo en cuenta el aumento de la tasa de
adaptación móvil de los sitios web, conviene considerar
la implementación de undiseño web adaptable. Este enfoque
permite que los sitios se ajusten perfectamente a
cualquier pantalla, como la de un equipo de escritorio,
tableta o teléfono inteligente.
• Creación de bocetos. Disponga las páginas de su
sit io en un esq uema de páginas ("wireframe"). Est o permit irá
visualizar el diseño y brindar la estructura de su sitio
web.
30. • Planifique el contenido. Saber qué quiere comunicar,
y cuánto contenido tiene, proporciona una guía para el
proceso de diseño.
Etapa 3: diseño
Si ya definió todos los temas vistos en las etapas 1 y 2, el
diseño de la página de inicio y de las subpáginas
posteriores será sencillo. Por ejemplo, establecer si su
público objetivo son las mujeres solteras, de clase media,
de entre 18 y 24 años y con estudios universitarios o los
hombres casados, de clase alta, de entre 65 a 80 años y
jubilados influye enormemente en los elementos de diseño
y las aplicaciones que se usarán.
Ver el diseño de las páginas con contenidos y
fotografías reales, su logotipo y el esquema de colores
elegido, le darán vida a su visión para el sitio. ¡Aproveche
31. esta etapa para hacer los cambios necesarios! Si está
trabajando con diseñadores expertos, ellos le darán
bocetos o prototipos en distintas etapas del proceso
para que pueda hacer comentarios. Hacer cambios más
adelante resulta costoso y difícil de implementar, por lo
que debe aprovechar con inteligencia esta etapa.
Etapa 4: desarrollo
Una vez que el diseño está finalizado y aprobado es
posibl e c rear el sit io web. Su diseñador/desarrol l ado r
tomará todos los elementos gráficos del prototipo y
los utilizará para crear un sitio funcional. También se
implementarán en esta etapa los elementos interactivos,
como por ejemplo los formularios de contacto, las
animaciones flash y los carritos de compras.
En este momento es posible hacer cambios y arreglos
menores.
32. Etapa 5: pruebas, entrega y
lanzamiento
Su desarrollador web pondrá a prueba el sitio web,
verificando desde su correcta operación hasta posibles
problemas de compatibilidad. Además, el desarrollador
verificará que todo el código de su sitio web sea válido,
cumpliendo con los estándares web actuales.
Una vez aprobado definitivamente, se cargarán los
archivos del sitio web a sus servidores y se inaugurará el
sitio.
Etapa 6: mantenimiento
Ahora que finalmente está construido el sitio, es igual de
importante mantenerlo. En la etapa de planificación de
este proceso, decidió si quería encargarse del
33. mantenimiento del sitio o prefería contratar a un tercero
(c omo su diseñado r web) para q ue l o haga. Si prefirió q ue
todo quedara bajo su control, el diseñador generalmente
opta por un diseño con CMS para permitirle editar el
contenido de su sitio y agregar páginas nuevas.
El desarrollo de su sitio web no termina el día del
lanzamiento. Al igual que en un edificio, es necesario
tomar ciertas medidas para garantizar que el sitio opere
en forma segura de la mejor manera posible. Para ayudarlo
a empezar, obtenga información sobre cómo lograr
visitas repetidas y cómo optimizar el sitio web de su
pequeña empresa para lograr un mejor posicionamiento en
las páginas de resultados de los motores de búsqueda.
34. Proceso del
diseño editorial
1. Lectura de original
1. Corrección de estilo. En esta lectura se cuida la
sintaxis del documento; sin alterar el sentido del autor,
se "limpia" el texto para que la lectura sea fácil para el
público a quien va dirigido.
2. Marcaje. Se definen l as cat egorías del t ext o (t ít ul os,
subt ít ul os, c it as, not as, et c .) q ue indic arán al formador
las diferencias tipográficas que tendrá que aplicar
para facilitar la lectura.
2. Diseño de interiores
1. En esta etapa se establece el tamaño del libro, de la caja
tipográfica, tipo de fuente, tamaños de caracteres,
interlínea, columnas, etcétera.
3. Formación
1. Se incorporan las correcciones señaladas en la lectura
de original.
2. El texto se traslada a un programa de edición, en el que
se asignarán las categorías indicadas en el marcaje,
siguiendo las especificaciones del diseño
4. Lectura de galeras
1. Se verifica que las correcciones indicadas en la
lectura de original se hayan aplicado y que los estilos
correspondan al marcaje. Se señalan problemas de
formación (viudas, huérfanas, c al l ejones) y posibl es
problemas sintácticos y ortográficos que no se hayan
subsanado
5. Primera lectura de planas
35. 1. Se incorporan las correcciones señaladas y se
verifican.
6. Lectura de finas
1. Se hace la revisión final
7. Diseño de portada
36. Usos y
características de las
páginas web
La estructura del sitio web debe ser visualmente intuitiva
y fácil de utilizar
Es importante que, de un simple vistazo, se puedan
identificar los siguientes elementos de una forma clara y
consistente a lo largo del sitio:
Encabezado
Logot ipo (no borroso, no mal rec ort ado, no pixel eado)
Bajo el logotipo, una frase corta que indique
exactamente a qué se dedica tu empresa. Por ejemplo bajo
nuestro logotipo dice “Diseño y desarrollo de páginas y
aplicaciones web”.
Barra de navegación.
Debe permanecer en el mismo lugar en todas las páginas
interiores, aunque puede estar en otro lugar en la
portada si hay una buena justificación. Al estar siempre en
el mismo lugar el visitante sabe en todo momento donde
buscar las demás opciones. Los diferentes niveles de
opciones deben indicarse visualmente con tipos de letra,
negritas, colores o menús desplegables. Los textos de
cada opción deben ser claros y concisos. Si tu sitio web
tiene muchas secciones y tienes que crear dos o tres
niveles de menú, no dudes en hacerlo, siempre y cuando
crees un camino fácil de intuir.
Área de contenido principal.
Es el área donde la vista del visitante va después de ojear
rápidamente el encabezado. Aquí debes poner tu
información.
Barra lateral de c ont enido (opc ional ).
En algunos casos es muy útil tener una barra lateral, en
la cual se puede colocar información de fácil acceso,
37. como números telefónicos o una liga a nuestro
formulario de cotizaciones.
Pie de página.
Debe contener un menú alterno en puro texto, con las
opciones de primer nivel. También úsalo para colocar
información de contacto u otra información importante.
El contenido del pie debe aparecer en todas las páginas.
Características que hacen placentera y útil la visita a un
sitio web
Deben utilizarse de forma correcta las diferentes
herramient as (HTML, CSS, ASP.NET o al gún ot ro l enguaje de
servidor, AJAX, et c .) para l ograr una navegación q ue
cuente con las siguientes características:
Páginas ligeras que descarguen rápidamente.
El formato y estilo de los diferentes elementos están
centralizados en un solo archivo, de tal forma que el
navegador solamente lo tiene que leer una vez.
Elementos técnicos que facilitan la indexación en
buscadores de Internet:
Inclusión de Metatags “Description” y “Keywords”.
Información bien redactada sin intentos de engañar a los
buscadores de Internet.
Uso de etiquetas H1 a H6 para títulos.
Imágenes optimizadas para que pesen menos.
No ut il izar marc os (frames). Est o evit a al gunos posibl es
errores de visualización en el navegador y facilita la
impresión.
No utilizar Flash cuando no agregue valor. Los
buscadores de Internet y algunos smartphones y tabletas
no pueden leer el texto en Flash.
En la mayoría de los casos es recomendable utilizar un
ancho fijo (no expandibl e a t odo l o anc ho de l a pant al l a)
porque facilita la lectura.
Utilización de tipos de letra fácilmente legibles y una
herramienta para permitir crecer el texto. Existe una
est imac ió n de q ue el 75%de l os adul t os ut il iza al gún t ipo
de anteojos para corregir la visión.
Todas las páginas contarán con un URL absoluto. Esto es,
cada página tendrá una dirección distinta y única en la
barra de direcc iones de t u navegador (puede parecer
38. obvio, pero hay sit ios web q ue no func ionan así).
Haciéndolo correctamente, es posible para el visitante
añadir tu página a favoritos o enviar una liga a un
producto determinado por e-mail.
De manera opcional se puede utilizar la migaja
(breadc rumb) en t odas l as páginas. Ejempl o: “Usted está en:
Inicio –>Servicios –>Consultoría”.
Apegarse a estándares de desarrollo para garantizar que
el sitio web pueda ser visualizado en todos los
navegadores, como Internet Explorer, Firefox, Safari,
Chrome y Opera tanto en computadoras Windows como
Mac.
Establecer contacto con el visitante mediante
formularios y una herramienta de chat en línea.
Para romper la monotonía de grandes cantidades de
texto, utilizar fotografías propias o de stock.
Utilización de Google Analytics o alguna otra
herramienta para medir los ingresos al sitio web.
El copy del sitio web, es decir, la información que
contiene, debe tener estas características:
Textos bien redactados, que contengan información
relevante a lo que queremos destacar.
No tratar de engañar a los buscadores de Internet
mediante repeticiones exageradas de palabras, utilización
del mismo color de texto y fondo, o alguna otra táctica
indeseable.
No utilizar un lenguaje muy técnico ya que nuestros
posibles clientes no son necesariamente expertos en el
tema.
Mantener los textos breves y concisos.
Inc l uir al guna sec c ió n (o bl og) en l a q ue se publ iq uen
artículos generados por tu empresa sobre el tema que
domina. Esto ayuda a que tu página sea más relevante para
los buscadores, además de que te conviertes en una fuente
de información confiable para tus clientes y posibles
clientes.
Estas características son las básicas que un sitio web
debe tener, pero se debe hacer una evaluación de acuerdo
al proyecto y los requerimientos del cliente para ofrecer
herramientas adicionales como Flipping Books, campañas
39. de AdWords, ut il ización de redes soc ial es (Fac ebook,
Twit t er, Fl ic kr o Yout ube), desarrol l o de apl ic ac iones,
paneles de control para administrar bases de datos,
administradores de contenido para modificar la
información de la página web automáticamente,
desarrollo de herramientas Intranet, acceso optimizado
para dispositivos móviles, blogs, o alguna otra.