Conceptes bàsics de disseny gràfic

  • Jordi Alberich

  • David Gómez Fontanills

    Nascut a Premià de Mar el 1968. Llicenciat en Belles Arts per la UB (1991). Màster en Societat de la informació i el coneixement i DEA en Antropologia Social per la UOC (2006). Combina l'activitat docent, la pràctica artística i la consultoria wiki. Col·laborador docent i autor de material didàctic per als Estudis del Graduat Multimèdia de la UOC des de l'any 2000. Membre del col·lectiu artístic TAG Taller d'Intangibles (enlloc.net). Forma part de la consultora de projectes de base wiki WikiWorks.com.

  • Alba Ferrer Franquesa

    Nascuda a Manresa el 1970. Llicenciada en Belles Arts per la Universitat de Barcelona (UB, 1989-1994). Cursa l'especialització de Disseny i imatge (Imaging and Design Studies) a la Universitat Central de Lancashire (1994). Obté un postgrau de Multimedia Studies del Pratt Institute de Nova York (1996). Fa el màster interuniversitari de Desenvolupament i disseny d'aplicacions interactives multimèdia de la UPC i la UB de Barcelona (UPC-UB, 1998-1999). Com a dissenyadora freelance, treballa en projectes gràfics i multimèdia i col·labora amb diversos estudis de disseny. Combina l'activitat professional amb la docència i la creació artística. Membre de l'associació artisticocultural Gènere i Gèneres (www.genereigeneres.org). Consultora de la Universitat Oberta de Catalunya (UOC) des de 1999, on també col·labora com a autora de material docent per als Estudis del Graduat Multimèdia i del grau Multimèdia Fonaments de fotografia i imatge digital (2001), Disseny gràfic (2009) i Imatge i llenguatge visual (2010).

PID_00216998

Els textos i imatges publicats en aquesta obra estan subjectes –llevat que s'indiqui el contrari– a una llicència de Reconeixement-NoComercial-SenseObraDerivada (BY-NC-ND) v.3.0 Espanya de Creative Commons. Podeu copiar-los, distribuir-los i transmetre'ls públicament sempre que en citeu l'autor i la font (FUOC. Fundació per a la Universitat Oberta de Catalunya), no en feu un ús comercial i no en feu obra derivada. La llicència completa es pot consultar a http://creativecommons.org/licenses/by-nc-nd/3.0/es/legalcode.ca

Índex

1.Forma i composició gràfica

1.1.La composició visual

El compositor musical combina i ordena els sons per crear una composició. El seu treball respon a allò que vol expressar o comunicar, a l'adequació o no als cànons marcats per la tradició, i al gust i els interessos propis de la seva època.
Vassili Kandinsky. Composició VIII (1923)Oli sobre tela. 140 x 201 cmPropietat: Solomon R. Guggenheim Museum, Nova York© V. Kandinsky (1923). VEGAP. Aquesta imatge es reprodueix acollint-se al dret de citació o ressenya (art. 32 de l'LPI), i està exclosa de la llicència per defecte d'aquests materials.
Vassili Kandinsky. Composició VIII (1923)
Oli sobre tela. 140 x 201 cm
Propietat: Solomon R. Guggenheim Museum, Nova York
© V. Kandinsky (1923). VEGAP. Aquesta imatge es reprodueix acollint-se al dret de citació o ressenya (art. 32 de l'LPI), i està exclosa de la llicència per defecte d'aquests materials.

"Desde el principio, esa única palabra composición, resonó en mi cerebro como una plegaria."

Vassili Kandinsky. Miradas al pasado (ed. original 1918).

"Las expresiones de sentimientos que se han ido formando en mi interior de forma similar [...] que, después de los primeros bocetos preliminares, he estudiado y trabajado lentamente, de una forma casi pedante: es el tipo de obra que yo llamo composición. [...] al final yo me inclino por los sentimientos más que por los cálculos."

Vassili Kandinsky (1998). De lo espiritual en el arte: contribución al análisis de los elementos pictóricos. Barcelona: Ediciones Paidós Ibérica.

Es pot fer un paral·lelisme entre la música i les arts visuals, i dir que la combinació d'elements gràfics forma una composició visual de manera anàloga a com la combinació de notes i estructures musicals formen una composició sonora. De fet, l'ús habitual del terme en el grafisme té l'origen en l'interès mostrat per músics i pintors (com Kandinsky) en les analogies entre llenguatge musical i visual en les primeres dècades del segle xx.
El creador gràfic disposa d'un ampli repertori d'elements visuals i d'una infinitat de combinacions per a compondre imatges.
Els criteris de composició varien segons les intencions de l'autor i el període històric. En l'ús del color, la forma o la disposició i ubicació en l'espai, intervenen factors culturals i troballes artístiques.

"En la pintura, las épocas dominadas por criterios de representación simbólica y no naturalistas, como la Edad Media, favorecen el establecimiento de jerarquías entre las figuras por medio de su ubicación en el conjunto (las más importantes se colocan en el centro de la composición) o de su tamaño (las figuras serán más grandes o más pequeñas según su importancia simbólica, con independencia de su tamaño real)."

José María Faerna García-Bermejo; Adolfo Gómez Cedillo (2000). Conceptos fundamentales de arte. Madrid: Alianza Editorial.

El llenguatge visual és un llenguatge obert, no tan codificat i estructurat com el llenguatge verbal. Per tant, la gramàtica visual és un àmbit per a l'experimentació.

1.2.El marc de la imatge

1.2.1.Per què un marc per a la imatge?
El marc d'una imatge
Quan es parla de composició visual, se sobreentén que s'organitza una sèrie d'elements gràfics dins d'un marc. Això no hauria de ser necessàriament així i, de fet, el marc de la imatge és una invenció cultural relativament recent, com han assenyalat alguns autors. Citant Romà Gubern:

"El marco rectangular de la pintura occidental, que heredarán luego la fotografía y el cine, vulnera [...] de un modo flagrante el formato y las características de la visión natural, a pesar de lo cual no nos extraña ni perturba, porque es una convención cultural sólidamente arraigada en nuestro contexto y con la que nos familiarizamos desde nuestra infancia. Esta convención se consolidó a partir del siglo XIV, en conexión con la linealidad de la perspectiva geométrica, en armonía con el formato rectangular de las paredes (soportes pictóricos) y de las ventanas de las casas, del formato de las páginas de los libros que se ilustraban y del formato del escenario teatral."

Romà Gubern (1987). La Mirada Opulenta. Barcelona: Editorial Gustavo Gili.

El marc, rectangular o no, és una forma que conté la imatge, i com a tal té el seu esquelet estructural que interfereix en les relacions entre els elements gràfics. Aquesta relació, inevitable, sovint passa desapercebuda a l'observador, que es capbussa dins de la imatge i l'aïlla de la resta mitjançant el marc.
Kandinsky: entrar en la composició

Sobre l'actitud d'observació externa o interna d'una composició, Kandinsky comenta:

"La calle puede ser observada a través del cristal de una ventana, de modo que sus ruidos nos lleguen amortiguados, los movimientos se vuelvan fantasmales y toda ella, pese a la transparencia del vidrio rígido y frío, aparece como un ser latente, del otro lado. O se puede abrir la puerta: se sale del aislamiento, se profundiza en el ser-de-afuera, se toma parte y sus pulsaciones son vividas con sentido pleno. [...] Del mismo modo la obra de arte se refleja en la superficie de la conciencia. [...] También aquí hay un cierto cristal transparente. [...] También aquí existe la posibilidad de penetrar en la obra, participar en ella y vivir sus pulsaciones con sentido pleno."

Vassili Kandinsky (1984). Punto y línea sobre el plano (ed. original 1926). Barcelona: Editorial Labor.

Fixeu-vos com canvia una composició amb els mateixos colors i elements gràfics en funció del marc. La primera usa una proporció de marc de 3 x 4, la segona de 4 x 3, i la tercera un marc rodó.
Fixeu-vos com canvia una composició amb els mateixos colors i elements gràfics en funció del marc. La primera usa una proporció de marc de 3 x 4, la segona de 4 x 3, i la tercera un marc rodó.
1.2.2.Marcs i finestres en els ordinadors
Icones, finestres i menús en el sistema operatiu MS-Windows
Icones, finestres i menús en el sistema operatiu MS-Windows
La interfície habitual per al sistema operatiu i les aplicacions en la majoria d'ordinadors és la coneguda com a WIMP (1) (windows, icons, menus, pointer).
Aquest tipus d'interfície, que utilitza metàfores del món físic extern a l'ordinador, és hereu de les investigacions realitzades al començament de la dècada dels setanta del segle xx en el centre d'investigacions de Palo Alto de Xerox (Xerox-PARC). El símil escollit va ser el de la feina a l'oficina (escriptori, carpetes, documents, paperera, etc.). Al final de la mateixa dècada s'incorpora en els ordinadors d'Apple Computer com a primers ordinadors personals comercials amb interfície gràfica, i el 1984 es defineix i consolida en el sistema operatiu dels Apple Macintosh. El 1989 els mateixos codis gràfics s'apliquen en la interfície del sistema operatiu Windows de Microsoft, que durant molt temps serà el més estès entre els ordinadors personals. Entre 1996 i 1997 arrenquen dos projectes d'escriptori per a sistemes UNIX (KDE i GNOME) basats en els mateixos principis que amb el temps es convertiran en els més usats entre les distribucions del Linux.
Una de les característiques d'aquest model és la possibilitat d'obrir finestres que ens mostren fragments d'informació: des de l'estructura de directoris, els arxius i les aplicacions fins a les imatges, textos o qualsevol tipus de document amb què podem treballar dins de la finestra. D'aquesta manera, al marc rectangular del monitor s'incorporen els marcs rectangulars de les finestres del sistema operatiu.
Alguns productes interactius, concretament aplicacions sobre CD-ROM dels anys noranta, van voler trencar aquest marc rectangular i substituir-lo per marcs de formes variades sobre un fons negre. Els navegadors d'Internet tornen a fer important el marc com a finestra d'exploració que incorpora els propis botons de control.
L'anomenada realitat virtual també ha volgut esborrar els marcs de la imatge oferint a l'usuari-participant una experiència immersiva per mitjà de sistemes que modifiquen el punt de vista a partir del moviment del cap.
1.2.3.Les proporcions del marc
Els intents de superar el marc de la imatge són legítims i interessants. Però l'existència del marc suposa també un repte per a la composició de la imatge, el qual ha donat solucions valuoses.
La seva forma i proporcions són un element determinant de la composició.

"En algunos periodos de la historia [...], en particular en el Renacimiento y en el siglo XVII, se usaron sistemas geométricos para [...] determinar las proporciones del área de la pintura."

Maurice de Sausmarez (1983). Diseño Básico; dinámica de la forma visual en las artes plásticas (ed. original 1964). Barcelona: Gustavo Gili.

Rectangles estàtics. Proporcions basades en nombres simples que produeixen rectangles estàtics. Es poden canviar els valors per a canviar la proporció.
Rectangles dinàmics. Proporcions basades en nombres irracionals que produeixen rectangles dinàmics. Es pot canviar el valor per a canviar la proporció.
Els formats convencionals per a la interfície gràfica de l'ordinador (640 × 480, 800 × 600, 1.024 × 768, 1.280 × 1.024, etc.) deriven de la proporció 4 : 3 del monitor clàssic de televisió. Per tant, és un marc basat en un rectangle estàtic.
1.2.4.Secció àuria, la proporció harmònica
L'anomenada secció àuria és un tipus de proporció usada pels grecs i després pels renaixentistes que es troba moltes vegades en les formes naturals. Es considera una proporció harmònica i s'ha utilitzat tant en les arts gràfiques com en l'arquitectura i l'escultura.
A continuació es mostren pas a pas els procediments per a obtenir la divisió d'una recta segons aquesta proporció i per a crear un rectangle basat en ella.
La secció àurea
Divisió d'una recta A-B utilitzant la proporció àurea
1) Es traça una recta perpendicular a un dels extrems (B) que mesuri la meitat de la recta original (AB/2).
2) S'uneix l'extrem oposat (P) de la nova recta amb l'altre extrem (A) de la recta original i es forma un triangle.
3) Amb el compàs en el punt P i passant per B, es traça un arc que talli la hipotenusa del rectangle.
4) Amb el compàs en el punt A i passant per la intersecció entre l'arc anterior i la hipotenusa, es traça un arc que divideix la recta original (AB) en dos segments que guarden la proporció àuria entre ells.
Secció àurea a partir d'un quadrat (ABCD)
Producció d'un rectangle de secció àurea a partir d'un quadrat (ABCD)
1) Es divideix el quadrat verticalment per la meitat.
2) Punxant el compàs en la meitat de la base i passant pel vèrtex superior dret (B), es traça un arc cap a baix.
3) Es prolonguen els dos segments horitzontals del quadrat (AB i DC) fins que la base s'intersecti amb l'arc. En aquest punt es traça una línia perpendicular que completa el rectangle.

1.3.Retícules

1.3.1.Retícules per repetició de mòduls
Com s'organitza la composició dins d'un marc?
Es pot utilitzar simplement la intuïció, però també hi ha recursos metodològics. El dissenyador gràfic sol usar retícules que ajuden a crear una composició coherent.
Les retícules són estructures que s'usen en el procés de treball però són invisibles en el resultat final. Els elements gràfics s'ajusten en aquestes. Les retícules es poden basar en la repetició de mòduls gràfics o estar formades per línies que diagramen l'espai sense formar elements iguals. En la taula següent es mostren les retícules derivades de la repetició de mòduls a partir de la classificació que Wucius Wong (2) n'ha fet:
Ús de l'enreixat bàsic en el disseny web
Vegem l'aplicació de retícules en el disseny per a web amb un cas pràctic.
El lloc web del Museu de la Vida Rural, un projecte desenvolupat per l'estudi de disseny Lamosca amb la Fundació Lluís Carulla (abans, Fundació Jaume I) com a client.
En aquest web s'ha fet servir una retícula quadriculada que respondria a l'"enreixat bàsic" definit per Wucius Wong.
La retícula serveix per a organitzar la composició global de la interfície i s'utilitza com a pauta per a les franges horitzontal i vertical que sempre són presents.
També es fa servir la retícula per a posicionar la resta d'elements, com les seccions bàsiques del lloc web (informació, el museu, escoles, novetats), els textos, les fotos, i els botons Entrar i Tornar. En la secció "El Museu" serveixen per a situar el menú per plantes i per zones, i per a organitzar l'índex de peces.
En alguns casos la retícula invisible es fa visible mitjançant línies blanques discontínues.
Lloc web: MVR. Disseny: lamosca
a) Retícula d'enreixat bàsic. Retícula sobre l'estructura bàsica que usen totes les pàgines web del lloc. Les bandes vertical i horitzontal, les àrees de color i l'espai per a imatges s'ajusten a la retícula.
b) Pàgina d'inici. A part de l'estructura bàsica, els textos i els botons de navegació també s'han disposat a partir de la retícula. Aquesta "es fa visible" parcialment en les línies blanques discontínues.
c) Pàgina interna: planta 1 del museu. En la banda vertical apareixen les diferents plantes del museu i en l'horitzontal els espais de la banda seleccionada. Tot s'ajusta a la retícula. Al costat del dibuix de la planta, la retícula es fa visible com a menú per a visualitzar les peces exposades en cada espai.
Retícules a l'Alhambra
L'Alhambra de Granada és un catàleg arquitectònic d'estructures de repetició múltiple en les ornamentacions i paviments.
A continuació es mostra, pas a pas, la construcció d'una malla aparentment complexa a partir d'una estructura relativament simple de rectangles. Solament és un dels múltiples exemples de retícules geomètriques que la cultura islàmica ha donat a la humanitat i que podem trobar a les parets de l'Alhambra i en altres edificis i elements decorats.
Pas 1. Partim d'una retícula de rectangles disposats en alineacions verticals.
Pas 2. S'ha duplicat la retícula i s'hi ha aplicat una rotació de 60° cap a la dreta.
Pas 3. S'ha duplicat de nou la retícula vertical i s'hi ha aplicat una rotació de 60° cap a l'esquerra. Ja tenim l'estructura de la malla.
Pas 4. Quan s'unifica el color de les línies, la percepció de les retícules de rectangles es dissimula i passa a un segon pla. Destaquen les estructures enllaçades de línies que formen estrelles de sis puntes en les seves interseccions i hexàgons creuats per tres carrers.
Pas 5. S'ha aconseguit un espai tessel·lat. Acolorint les peces resultants es poden obtenir dissenys de repetició molt variats.
1.3.2.Retícules basades en les proporcions del marc
Una altra opció és optar per divisions del pla de la composició derivades de les proporcions i estructura del marc. Es tracen divisions del marc que van creant una malla o diagramació de l'espai de la composició. Aquestes línies serveixen com a estructura per situar els elements gràfics.
Aquesta tècnica és utilitzada àmpliament pels pintors renaixentistes i també en les arts del llibre. Posteriorment serà recuperada pels grafistes moderns. A continuació es mostren algunes divisions possibles.
Algunes divisions possibles en funció del marc
1.3.3.Diagramació basada en columnes de text
El disseny editorial orientat a premsa diària i a la maquetació de revistes periòdiques requereix un sistema de diagramació de pàgina àgil, que accepti canvis en la quantitat de text i en la mida de les fotografies i titulars. Alhora, l'ajust de tots aquests elements s'ha de fer de manera ràpida i eficaç.
Per a respondre a aquesta situació, la majoria de diaris utilitzen un sistema de diagramació basada en columnes verticals de text. La pàgina es divideix en sis columnes, cinc columnes, quatre columnes o tres columnes. A dins es posa el text i les imatges i titulars també encaixen en aquesta estructura.
Exemple de diferents diagramacions i combinacions. Per exemple, en una diagramació de sis columnes, el text pot ocupar quatre columnes primes més una columna més gruixuda resultat de la unió de dues columnes de la diagramació. Un titular pot ocupar l'espai de quatre columnes, i una foto es pot inserir entre dues columnes de text. També es poden usar dues diagramacions en una mateixa pàgina; per exemple, una part de la pàgina es basa en una diagramació de cinc columnes i una altra en una de tres.

1.4.Efectes compositius

1.4.1.Contrastos compositius
El contrast té una gran importància en la composició. Una composició ambigua, per exemple, quant a equilibri, produeix una sensació visual confusa. La nostra percepció intenta corregir-la mitjançant l'anivellament i l'agusament de les lleis de la Gestalt.
Llevat que ens interessi provocar aquest efecte en l'observador, en la comunicació visual haurem de contrastar la composició desplaçant-nos cap a un dels dos pols (equilibrat o inestable, per exemple).
Donis Dondis ha definit dinou tipus de contrast compositiu basats en parells de conceptes que es configuren com a pols contraposats. Cada pol és un extrem quant a efecte compositiu. Entre un pol i un altre hi hauria les composicions l'efecte de les quals és intermedi o ambigu.
© Dondis. Aquestes imatges es reprodueixen acollint-se al dret de citació o ressenya (art. 32 de l'LPI), i estan excloses de la llicència per defecte d'aquests materials.
© Dondis. Aquestes imatges es reprodueixen acollint-se al dret de citació o ressenya (art. 32 de l'LPI), i estan excloses de la llicència per defecte d'aquests materials.
El realment interessant és controlar la combinació de diferents tipus de contrast compositiu (per exemple, una imatge equilibrada i amb subtilesa, o bé subtil i desequilibrada o equilibrada, subtil i predicible.
1.4.2.Espai i elements compositius
Els vertaders protagonistes de la composició (condicionats pel marc, organitzats, si és possible, mitjançant retícules) són els elements visuals. La seva disposició és la que ens permet generar els contrastos vistos en l'apartat anterior.
A continuació es mostren algunes de les seves característiques i els efectes que provoquen. Per a això ens basem en la classificació de Maurice de Sausmarez.
Classificació de les forces espacials segons Maurice De Sausmarez

1.5.Transformacions de la forma

Les transformacions gràfiques que apliquem als elements visuals de la composició també tenen un paper en la interpretació de l'espectador. Diferenciem entre transformacions rígides i deformacions.
Les transformacions rígides són les que ens permeten escollir dos punts qualssevol de la forma i que, una vegada transformada la distància entre ells, continua essent la mateixa. En les deformacions qualsevol parell de punts no ens garanteix aquest resultat. Són rígides les transformacions següents:
  • Les reflexions

  • Les translacions en l'espai

  • Les rotacions

  • Qualsevol combinació entre elles

Totes aquestes transformacions es poden entendre com a simetries.
Tot és simetria (o simetria trencada)
Tota transformació rígida d'una forma es pot entendre com un tipus de simetria. De fet, els matemàtics ho consideren així (encara que en l'expressió vulgar simetria se sol referir a una reflexió).
En el llibre És Déu un geòmetra? Ian Stewart i Martin Golubitsky sostenen que totes les formes del món es poden entendre com a formes simètriques o formes on s'ha trencat la simetria, aquesta ruptura d'una simetria original explicaria les regularitats sorprenents que de vegades es troben. Per exemple, un ou esfèric de tortuga és simètric en tots els eixos, i un ou de gallina ha trencat en part la simetria i només conserva una simetria bilateral.
Ou de tortuga i ou de gallina
Ou de tortuga i ou de gallina
Qualsevol transformació que no puguem considerar rígida es pot entendre com una deformació. Són deformacions habituals:
  • Esbiaixar.

  • Distorsionar.

  • Projectar.

  • Metamorfosis que els efectes especials permeten en els mitjans audiovisuals.

Deformacions habituals

2.Color i disseny gràfic

2.1.Models de classificació del color

2.1.1.Lluminositat, saturació i matís
A través del temps i les cultures s'han concebut teories i explicacions per a la visió dels colors estretament vinculades a les concepcions sobre la visió. A partir de les primeres aproximacions científiques (Newton i Huygens, segle xvii) les teories se centren en la física i l'òptica, i entre el final del segle xix i l'inici del xx s'introdueix el factor psicològic.
Les concepcions actuals del color arrenquen de 1931 i són el resultat de la confluència de la fisiologia, la física, la química i la psicologia de la percepció. Els models que fem servir actualment es basen en tres paràmetres fonamentals: lluminositat, saturació i matís. Vegem quina propietat defineix cada un d'aquests conceptes:
  • La lluminositat, luminància o brillantor defineix les diferències de quantitat de llum d'un color. Un vermell fosc té menys lluminositat que un vermell clar.

  • La saturació defineix el nivell mínim i màxim de puresa d'un color. Els grisos representen l'absència total de saturació. Un vermell intens pot tenir el mateix nivell de lluminositat que un gris, però té un nivell màxim de saturació.

  • El matís o to defineix la diferència entre un color i un altre. Un verd pàl·lid i un verd fosc tenen el mateix matís. Un verd i un blau tenen diferent matís.

2.1.2.Models tridimensionals del color
La classificació dels colors no encaixa en un esquema bidimensional. Per això els diferents autors que han fet aquesta tasca s'han valgut de models tridimensionals per representar els colors a tall d'esquema i oferir models comprensibles de representació. A continuació es mostren els models principals:
Classificació del color

2.2.Barreges: additiva, substractiva, partitiva

Diferenciem tres tipus de barreja de color en funció de si és el resultat de la suma (o addició) de llums amb diferents longituds d'ona (barreja additiva), si és la combinació de pigments que sostreuen diferents longituds d'ona (barreja substractiva) o si són el resultat de disposar petites àrees contigües de diferents colors, de manera que l'ull percebi un color que no és en la imatge (barreja partitiva).
En la demostració següent podeu experimentar la diferència de resultats en la combinació de colors per barreja additiva i barreja substractiva.
Barreja additiva: simulació de la superposició de diferents focus de llum. Barreja substractiva: simulació de la barreja de diferents pigments.
Desplaceu els quadrats i superposeu-los els uns amb els altres.
2.2.1.Barreja additiva
És la barreja que es produeix en combinar focus de llum (per exemple, al teatre) i en la qual es basa la generació del color en els monitors de televisió i d'ordinador.
A la barreja additiva la suma de colors augmenta la intensitat de llum i ens apropa al blanc.
Com a conseqüència del fet que el nostre aprenentatge en la barreja de colors es produeix habitualment amb l'ús de pigments, la barreja additiva produeix resultats que poden semblar antiintuïtius. No és així per a alguns professionals com els tècnics d'il·luminació que treballen en les arts escèniques o els fotògrafs d'estudi que han interioritzat aquest tipus de combinació.
En el camp de la imatge sintètica és important controlar la barreja additiva quan es treballa en la construcció d'entorns 3D que s'han d'il·luminar.
A continuació es mostra en un esquema el resultat de la combinació de focus amb diferents longituds d'ona. Per simplificar utilitzarem els termes llum vermella (per a l'ona llarga), llum verda (per a l'ona mitjana) i llum blava (per a l'ona curta).
Barreja additiva
Barreja additiva
2.2.2.Barreja sostractiva
És la barreja resultant de la combinació de pigments. Es produeix en la barreja de pintures de tota mena i també en la barreja de tintes d'impremta i de tints tèxtils. Els pigments tenen la capacitat de sostreure part de la llum.
Per tant, en la barreja substractiva, la suma de pigments de color diferent dóna com a resultat un color més fosc.
Si sumem diversos colors oposats, el color resultant serà pròxim al negre. És el tipus de barreja que resulta més intuïtiva per a la majoria de persones.
A continuació es mostra en un esquema el resultat de la combinació de pigments que sostreuen diferents longituds d'ona. Concretament es combinen tres pigments: el blau cian, el magenta (o fúcsia) i el groc.
Barreja sostractiva
Barreja sostractiva
2.2.3.Barreja partitiva
Mosaic romà. La combinació de tessel·les forma la il·lusió d'altres colors. Màscara teatral, Itàlica (Sevilla) segle III dC.Foto en quadricromia. La combinació de trames de punts de només 4 colors amb inclinacions diferents crea la il·lusió d'altres colors.Foto indexada. La trama estocàstica de punts de només 216 colores crea la il·lusió d'altres colors que no són a la imatge.© del mosaic: Grup Òliba (UOC). http://oliba.uoc.edu/mosaic/es/exp_13_tm.html. Creative Commons Reconeixement Compartir-Igual 3.0-es© de les fotos: David Gómez Fontanills 2011. Creative Commons Reconeixement Compartir-Igual 3.0-es
Mosaic romà. La combinació de tessel·les forma la il·lusió d'altres colors. Màscara teatral, Itàlica (Sevilla) segle III dC.
Foto en quadricromia. La combinació de trames de punts de només 4 colors amb inclinacions diferents crea la il·lusió d'altres colors.
Foto indexada. La trama estocàstica de punts de només 216 colores crea la il·lusió d'altres colors que no són a la imatge.
© del mosaic: Grup Òliba (UOC). http://oliba.uoc.edu/mosaic/es/exp_13_tm.html. Creative Commons Reconeixement Compartir-Igual 3.0-es
© de les fotos: David Gómez Fontanills 2011. Creative Commons Reconeixement Compartir-Igual 3.0-es
La barreja partitiva és el resultat d'una combinació d'estímuls simultanis. En aquesta barreja es podria dir que la física no intervé: la barreja que dóna lloc al color no es produeix ni en la font lluminosa ni en els pigments que cobreixen l'objecte percebut, la barreja es produeix en el nostre cervell.
Parlem de barreja partitiva quan percebem un color on hi ha petites àrees d'altres colors. Es produeix perquè el nostre cervell actua de manera contextual i modifica els colors d'un objecte en funció dels colors contigus.
En aquest cas tenim petits punts de diversos colors i el resultat és la percepció d'un nou color que no hi és. Aquest fenomen és molt útil perquè permet representar una gran varietat de colors a partir d'uns quants.
Això es fa des d'antic, el millor exemple són els mosaics romans. Però sobretot té gran importància en la representació dels colors per quadricromia en les arts gràfiques. Les imatges se separen en els tres colors bàsics –cian, magenta i groc– més el negre, que al costat del blanc del paper actua sobre el nivell de lluminositat percebuda. Després es tramen de manera que en imprimir-los els punts d'un color no trepitgin els d'un altre. Perquè això no passi, els punts de cada color es disposen en un angle d'inclinació diferent. En imprimir-los tots conformen l'anomenada roseta. En funció de la quantitat de cada color (mida del punt) percebrem un color o un altre.
Barreja partitiva
Redueix la imatge clicant al botó amb el signe negatiu, amplia-la clicant al signe positiu.
© de la foto: David Gómez Fontanills 2002 - Creative Commons Reconeixement Compartir-Igual 3.0-es.
La barreja partitiva o mixta es basa en els canvis en la percepció de colors contigus. En la seqüència anterior es pot veure una imatge ampliada d'una quadricromia d'impremta; es distingeixen punts de quatre colors: cian, magenta, groc i negre.
A més de la impressió en quadricromia, la barreja partitiva es fa servir per a obtenir matisos de lluminositat en impressió a una sola tinta i s'ha fet servir des de temps immemorials per a la confecció de mosaics i catifes.
La barreja partitiva es basa en la sostracció que produeixen els punts de color i en la gran diversitat de petits estímuls que arriben a l'ull d'una petita àrea de l'espai. Robert Silvers, del Media-Lab del MIT, usa aquest efecte creant imatges que estan compostes per milers d'altres imatges. Com a exemple, consulteu a Internet la cara de Lady Di creada a partir de fotos de flors per a la revista Newsweek.
A mesura que els punts es fan petits, els colors originals es perden i es barregen amb els contigus. Si entretanqueu els ulls ja podeu veure nous colors. Els pintors puntillistes, com Seurat, usaven aquest efecte, i amb pinzellades de colors purs (distingibles en una observació a prop de la tela) aconseguien una gran varietat de matisos a mesura que l'observador s'allunyava del quadre.
En l'última imatge de la seqüència ja gairebé no es distingeixen els punts, només hi continuen havent cian, magenta, groc i negre, però percebem una gran varietat de matisos encara que no hi siguin.
Comproveu l'ús d'aquesta tècnica en una revista en color usant una lupa per a distingir els punts (que poden arribar a ser molt petits, depenent de la qualitat d'impressió).
Un sistema similar, però no exactament igual, a la quadricromia de les arts gràfiques s'utilitza en les trames aleatòries que es generen quan es passa una imatge a mode indexat usant el paràmetre de trama de difusió en un programa de tractament de gràfics, i també en les trames aleatòries (o estocàstiques) que generen les impressores en color.
Trama estocàstica
El terme estocàstic es refereix a un fenomen determinat per l'atzar. Els algoritmes informàtics que busquen aproximar-se a resultats determinats per l'atzar s'anomenen estocàstics i basen els seus resultats en probabilitats canviants. La distribució estocàstica de punts s'usa en alguns sistemes de representació per barreja partitiva de quatre tintes més el blanc del paper com a alternativa a la disposició per punts amb trames regulars de la quadricromia convencional. A diferència d'aquesta, les quadricromies estocàstiques no produeixen l'efecte moaré que de vegades apareix usant trames regulars quan hi ha petits desplaçaments entre colors en la impremta.
En tots dos casos també utilitza la barreja partitiva, però la disposició dels punts no depèn d'angles d'inclinació sinó que es basa en algoritmes estocàstics que els distribueixen aleatòriament.
No obstant això, a diferència de la barreja substractiva i especialment de la barreja additiva, amb la barreja partitiva no es poden representar tots els colors.
Donada la seva naturalesa que parteix de la interacció entre colors, és impossible representar colors molt lluminosos i brillants. Recordem que la barreja partitiva es produeix en el cervell com a resultat de l'estímul amb diferents longituds d'ona d'àrees molt petites de la retina. Hi ha colors que es poden obtenir modulant la longitud d'ona d'una font lluminosa o barrejant pigments que mitjançant la disposició de petits punts de color uns al costat d'uns altres no podem obtenir.
Codificació CMYK
Els programes de tractament de gràfics que treballen amb la codificació CMYK solen advertir quan un to escollit en el seu selector de color no és reproduïble en quadricromia, i ens ofereixen l'alternativa més pròxima.
El selector de color d'Adobe Photoshop CS3 mostra una advertiment quan l'usuari tria un color que no té correspondència en quadricromia. També ofereix un color alternatiu que sí es pugui reproduir.
El selector de color d'Adobe Photoshop CS3 mostra una advertiment quan l'usuari tria un color que no té correspondència en quadricromia. També ofereix un color alternatiu que sí es pugui reproduir.
En l'exemple següent podem veure, a l'esquerra, una imatge fotogràfica amb codificació RGB. A la dreta es mostra la mateixa imatge tal com es veu codificada en CMYK, preparada per a ser impresa. La quadricromia no permet reproduir alguns dels colors que mostra la imatge original.
© Dungodung, DarkEvi 2006 - Imatge en el domini públic. Publicada originàriament a Wikimedia Commons
© Dungodung, DarkEvi 2006 - Imatge en el domini públic. Publicada originàriament a Wikimedia Commons

2.3.Colors primaris, secundaris i complementaris

L'estímul de les cèl·lules de la retina per tres longituds d'ona diferents que dóna lloc a la percepció dels colors ens permet parlar de tres colors primaris (vermell, verd i blau). A partir de la combinació de dos d'ells obtindríem els colors secundaris, i de la combinació en diferents intensitats dels tres, els colors terciaris.
Colors primaris, secundaris i terciaris
50018_m4_29.gif
Però la combinació de pigments ens permet parlar d'altres colors primaris: els pigments (cian, magenta i groc) de la combinació dels quals podem obtenir la resta de colors. Alguns autors prefereixen anomenar aquests colors bàsics en comptes de primaris, que es reserva per a la llum.
No és per casualitat que els colors bàsics de pigment siguin els secundaris de llum ni que els primaris de llum siguin els secundaris en la barreja de pigments bàsics. Els colors que no comparteixen components, com el verd (primari) i el magenta (format pels primaris vermell i blau), s'anomenen complementaris. La combinació de colors complementaris crea un contrast fort.
Roda de color
La idea que hi ha uns colors "complementaris" d'uns altres no deixa de ser una convenció que s'ha anat construint culturalment. Sobre la base que un color és complementari d'un altre quan no comparteixen components, actualment considerem complementaris els colors en funció dels tres colors primaris i basant-nos en tres longituds d'ones electromagnètiques.
Però les diverses teories del color han manejat, sobretot en els dos últims segles, diverses formes de classificació del color. Per tant, tant en la pràctica artística com en el disseny o les indústries relacionades no sempre els colors considerats complementaris han estat els mateixos. No és estrany trobar altres polaritats en diversos autors o en els escrits d'artistes i dissenyadors. Potser la més habitual és la de considerar el verd (en comptes del cian) com a complementari del vermell.

2.4.Codificació digital del color

Com en el seu moment la indústria tèxtil, les arts gràfiques, la indústria cervesera i tants altres sectors productius, la tecnologia digital de tractament i edició de gràfics ha necessitat models numèrics de color. Ja s'ha vist com aquests models tenen una representació gràfica (sovint tridimensional) que ens ajuda a comprendre'ls. Però sobretot ens donen uns paràmetres numèrics que ens permeten treballar-hi.
Per a definir un color es poden utilitzar diferents sistemes.
Per a definir un color es poden utilitzar diferents sistemes.
El més comú és l'RGB, en què es basa el sistema de color dels ordinadors i televisors. El CMYK s'usa per a impressió en quadricromia, i l'HLS ens permet controlar separadament to, lluminositat i saturació. Obrint el selector de color d'un programa de gràfics es pot veure que almenys estan disponibles aquests tres sistemes de selecció. A més podem trobar el sistema Lab de la CIE i sistemes de color estàndard o normativitzats usats en altres indústries com Pantone, ANPA, DIC, Toyo, etc.
Selector de color d'Adobe Photoshop CS3
Selector de color d'Adobe Photoshop CS3
També tindrem la possibilitat d'escollir el color RGB per codificació hexadecimal. Això és molt útil perquè el llenguatge HTML usa aquesta codificació i ens servirà per a sincronitzar els colors dels gràfics amb les taules i fons de la pàgina web. El codi hexadecimal en el programari de gràfics sol ser en un camp de text que ens permet seleccionar-lo i copiar-lo.
2.4.1.Modes de color
Els programes de gràfics que treballen en mapa de bits (com GIMP o Photoshop) usen canals de 8 bits, que permeten representar fins a 256 valors, per a codificar el color. En funció del tipus de codificació seran necessaris més o menys canals.
Els diferents sistemes de codificació del color que es poden aplicar al document en què treballem són coneguts com a modes de color. Els modes de color són independents del sistema de codificació escollit en el Selector de color per a buscar un to concret; després aquest color quedarà representat per la codificació corresponent al mode escollit.
L'elecció d'un mode de color o un altre depèn de la finalitat del gràfic. Hi ha modes adequats per a treballar amb un gràfic que haurà d'acabar imprès, i altres d'adequats per a gràfics que s'hauran de visualitzar en pantalla. També la quantitat de memòria que finalment ocuparà el gràfic depèn en part del tipus de codificació de cada mode.
a) Indexat. 8 bits. 14 Kb. b) Escala de grisos. 8 bits. 23 Kb. c) RGB. 24 bits. 45 Kb. d) B/N. 1 bit. 12 Kb. e) CMYK. 32 bits. 63 Kb
a) Indexat. 8 bits. 14 Kb. b) Escala de grisos. 8 bits. 23 Kb. c) RGB. 24 bits. 45 Kb. d) B/N. 1 bit. 12 Kb. e) CMYK. 32 bits. 63 Kb
2.4.2.Mode ploma
Correspon a les imatges d'1 bit. Són imatges de només dos tons (per exemple, blanc i negre).
Depenent de la densitat de trama podem aconseguir efectes de zones ombrejades o il·luminades. Els programes solen disposar de diversos algoritmes opcionals i parametritzables amb què s'obtenen diferents tramats.
Ocupen poc espai de memòria però no es poden utilitzar mitjos tons. S'usen tant per a gràfics per al web (que siguin molt simples) com per a impressió. De fet, el terme ploma és el que s'empra en les arts gràfiques per a referir-se a aquest tipus d'imatges.
En el programa Photoshop es coneix amb el nom mode mapa de bits, que pot resultar una mica equívoc. En altres programes (com el GIMP) s'aconsegueix definint una profunditat de només 1bit en passar a mode indexada.
a) La imatge original en mode RGB d'aquest exemple s'ha passat a mode ploma (codificada amb un sol bit) escollint l'opció sense tramat. b) La imatge original en mode RGB en aquest altre cas s'ha passat a mode ploma aplicant un tramat. Concretament s'ha aplicat una trama Floyd-Steinberg des de GIMP.
a) La imatge original en mode RGB d'aquest exemple s'ha passat a mode ploma (codificada amb un sol bit) escollint l'opció sense tramat. b) La imatge original en mode RGB en aquest altre cas s'ha passat a mode ploma aplicant un tramat. Concretament s'ha aplicat una trama Floyd-Steinberg des de GIMP.
2.4.3.Mode de color indexat
És un mode de color que treballa amb un sol canal de 8 bits. Per tant, pot representar un màxim de 256 valors que corresponen a una paleta d'altres colors.
S'usa per a gràfics destinats al web o a produccions multimèdia que s'hauran de veure en pantalla. El fet de reduir el nombre de bits en la codificació de la imatge en redueix el pes (memòria que ocuparà l'arxiu). Es poden fer servir paletes amb menys de 256 colors de manera que encara pesi menys. Una paleta de dos colors només necessitarà 1 bit per a desar la informació de color i ocuparà poca memòria.
La majoria de programes de gràfics permeten escollir el nombre de colors de la paleta (o el nombre de bits per a codificar-lo). Això es pot fer en escollir el mode de color en el qual es treballarà o bé al final, per a generar el gràfic que haurà d'anar al web (és el cas del Fireworks o del mòdul Image Ready per a Photoshop). També permeten escollir tipus de tramats que ajuden a obtenir colors que no són en el gràfic per mitjà de la barreja partitiva.
a) Imatge indexada amb paleta Web216 sense tramat. Els colors originals han estat substituïts pels colors més pròxims que eren a la paleta. b) Imatge indexada amb paleta Web216 des de GIMP usant un tramat Floyd Steinberg. Els colors originals se simulen per barreja partitiva usant una trama de punts distribuïts de manera estocàstica.
a) Imatge indexada amb paleta Web216 sense tramat. Els colors originals han estat substituïts pels colors més pròxims que eren a la paleta. b) Imatge indexada amb paleta Web216 des de GIMP usant un tramat Floyd Steinberg. Els colors originals se simulen per barreja partitiva usant una trama de punts distribuïts de manera estocàstica.
2.4.4.Mode de color escala de grisos
Una variant del mode de color indexat seria el mode d'escala de tons grisos o mitjos. També fa servir un canal de 8 bits que dóna 256 valors de gris.
És l'adequat per a fotografies en blanc i negre i imatges similars. És una manera vàlida tant per a impressió com per a pantalla. En comparació amb la imatge en color indexada, la qualitat d'una imatge en escala de grisos és alta, ja que amb 256 grisos es té un bon escalat de valors de lluminositat.
Imatge en escala de grisos
Imatge en escala de grisos
2.4.5.Catàlegs de color
Hi ha diferents catàlegs de tintes d'impressió que són molt útils per a triar un color determinat. Per una incorrecta traducció literal de l'anglès, les colour libraries se solen anomenar llibreries de color. Són diversos els fabricants que els fan. Cada indústria (arts gràfiques, tèxtil, automobilística, etc.) té els seus estàndards.
El catàleg més conegut per a les arts gràfiques és Pantone, però també n'hi ha d'altres com Trumatch, Foltone, Toyo o Anpa-Color.
Quan ens referim a l'ús de catàlegs de color per a gràfics digitals significa que aquests gràfics s'hauran d'imprimir o estampar usant tintes. Com que les tintes estan codificades usarem la mateixa codificació en l'ordinador. Si, per exemple, la destinació final és una impressió en òfset o serigrafia, cada tinta escollida correspondrà a un fotolit i a una planxa o pantalla. Per això és necessari valorar si usem tintes específiques escollides d'un catàleg, com Pantone, o bé usarem quadricromia, codificació CMYK, per a imprimir.
És recomanable escollir tintes de catàleg quan vulguem imprimir menys de quatre colors o quan vulguem afegir un color molt específic difícil de representar per quadricromia.
Els programes de dibuix vectorial reconeixen cada color escollit i generen un fotolit per a cada un. Alguns programes de mapa de bits tenen modes monotò, bitò, tritò o quadritò per a treballar només amb una tinta o amb una combinació de elles.
Una cosa que ens pot confondre és que el selector de color dels programes de gràfics permeti escollir colors de determinats catàlegs encara que treballem en mode RGB o CMYK. Ho permeten perquè alguns dissenyadors hi estan molt familiaritzats i estan acostumats a escollir el color a partir dels seus catàlegs. Però no ens enganyem, el color escollit es codifica segons el mode de color que tinguem escollit, independentment de com s'obtingui en el selector de color.
Alguns d'aquests programes (com el Photoshop) avisen quan es treballa en mode CMYK i es tria un color que no es podrà representar per quadricromia.
2.4.6.Codificació RGB
La codificació RGB (red, green, blue) o RVA (vermell, verd, blau) parteix dels tres colors primaris de llum i dóna, a cada un, un valor entre 0 i 255. Combinant aquests colors aconsegueix una àmplia gamma de tons.
En els sistemes digitals són necessaris 24 bits per a emmagatzemar un gràfic en RGB. En els programes de dibuix de mapa de bits, el mode RGB fa servir tres canals de 8 bits cada un.
Els monitors de televisió i d'ordinador usen RGB per a representar el color, per tant, treballar en mode RGB és l'opció més adequada per a aconseguir color de qualitat en gràfics que s'han de veure en pantalla (com els d'un web). Els estàndards de color en les pàgines web també usen la codificació RGB per a definir el color del text, línies o fons.
Per a una imatge destinada a imprimir-se en una impressora de sobretaula es pot utilitzar RGB perquè la majoria fa la conversió automàticament. De tota manera cal tenir en compte que aquestes impressores tenen quatre tintes (cian, magenta, groc i negre) que no corresponen als colors vermell, verd i blau.
Per a una imatge destinada a imprimir-se en òfset, el mode RGB és totalment inadequat, ja que sortirien tres fotolits (un per canal) que no correspondrien als colors usats en la impremta.
2.4.7.RGB en decimal i hexadecimal
De quina manera s'escriuen els valors RGB en els sistemes informàtics?
Una manera habitual en els programes de disseny és donar els valors de cada component de l'RGB usant la numeració decimal entre 0 i 255. Cada component té el seu valor numèric, en un rang d'entre 0 (mínim) a 255 (màxim). Un blanc total tindria el valor RGB de (255, 255, 255), un negre seria (0, 0, 0), un vermell de màxima saturació (255, 0, 0), i així totes les altres combinacions.
Però en alguns casos també és habitual escriure'l usant la numeració hexadecimal; va ser el cas de l'HTML en el web fins que van arribar els fulls d'estil. I encara es continua utilitzant perquè és una manera compacta de donar un valor de color amb només sis dígits. És per això que molts selectors de color de programes de gràfics també ens ofereixen els valors RGB d'un color en aquest format.
L'escriptura hexadecimal fa servir setze dígits, ja que als deu nombres convencionals (del 0 al 9) se sumen sis lletres de l'alfabet llatí (de la a a la f).
Taula d'equivalències decimal/hexadecimal entre zero i vint
Decimal
Hexadecimal

0

0

1

1

2

2

3

3

4

4

5

5

6

6

7

7

8

8

9

9

10

A

11

B

12

C

13

D

14

E

15

F

16

10

17

11

18

12

19

13

20

14

Si per a representar el valor d'un component RGB amb el sistema decimal usem un rang entre 0 i 255, amb el sistema hexadecimal usarem un rang entre 00 i FF, essent el 00 el valor mínim i FF el màxim possible per a cada color primari.
Per a representar qualsevol color usarem tres parells de dígits, en què cada parell determina el valor d'un dels tres components. Així, per a representar el negre, que és absència total de llum, de manera hexadecimal escriuríem: 000000. Al contrari, el blanc es codificaria com a FFFFFF. Un vermell saturat seria FF0000, un verd saturat 00FF00 i un blau saturat 0000FF.
Els altres colors es representen mitjançant combinacions de valors en cada component.
2.4.8.Color en el web, RGB en fulls d'estil
Les pàgines web es defineixen tècnicament per mitjà del llenguatge de marcatge HTML, que en defineix l'estructura, i dels fulls d'estil CSS, que en defineixen l'aparença. L'evolució d'aquests estàndards es du a terme mitjançant les especificacions i recomanacions del W3Consortium, unconsorci format per organitzacions, empreses i institucions públiques i privades compromeses amb el desenvolupament del web. El desembre de 1996 el W3Consortium, també conegut com a W3C, va fer la primera recomanació de l'estàndard CSS-1, i el 1998 la va fer per a CSS-2. Progressivament, els navegadors principals van implementar la interpretació d'aquests estàndards.
En els paràmetres de CSS el color es defineix per RGB. Això es pot fer amb dígits hexadecimals o decimals. En l'apartat "RGB en hexadecimal" s'ha explicat que per a establir un color de manera hexadecimal es fan servir tres nombres formats per dígits dobles. En HTML i en els fulls d'estil, aquests sis nombres sempre van precedits del signe #. Per a establir-ho amb valors decimals s'escriu rgb seguit de tres valors decimals entre 0 i 255 continguts entre parèntesis i separats per comes. A continuació es mostren alguns exemples.
50018_m4_85.gif
Colors RGB i notació hexadecimal
Variant els valors en cada component de l'RGB podem representar numèricament milers de colors. Utilitzant el sistema hexadecimal, com més baix és un valor (més pròxim a 00) menys llum tenim d'un component, i com més alt (més pròxim a FF) més en tenim.
En disseny web els colors considerats safe, que es poden reproduir fidelment sense canvis en diferents navegadors i sistemes operatius, són els que contenen els nivells de 00, 33, 66, 99, CC o FF, per a cada color primari.
50018_m4_40.gif
Un vermell fosc es pot representar com un #330000. Aquest vermell seria menys brillant que el vermell total (#FF0000). Un vermell amb més brillantor podria ser #660000. I faríem el mateix amb els altres components, per exemple, un verd total, #00FF00, o un #003300 verd fosc; un blau mig #000099 o un blau fosc #000033.
50018_m4_41.gif
Aplicació en una pàgina web
Si, per exemple, volem que el color dels textos de paràgraf en una pàgina web sigui vermell escriurem, codificat en hexadecimal, en el full d'estil:
p {
   color: #FF0000;
}
p {
   color: rgb(255,0,0);
}
p {
   color: #FF0000;
   background-color: #FFFF0;
}
p {
   color: rgb(255,0,0);
   background-color: rgb(255,255,0);
}
p {
   color: red;
}
O bé amb valors decimals:
Si a més volem un color de fons groc, escriurem en hexadecimal:
O bé amb valors decimals:
El W3C ha establert a més setze noms de color que es poden usar directament per escrit: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white i yellow. Així, per al nostre text vermell, també podíem haver escrit:
A més hi ha uns cent cinquanta noms que són reconeguts pels principals navegadors, encara que no formen part de l'estàndard.
2.4.9.Codificació HSB
La codificació HSB (3) (hue, saturation, brigthness) fa servir els tres paràmetres bàsics del color. És per això –i perquè se sol representar mitjançant un cos geomètric regular, un con o un cilindre– que és un dels sistemes més intuïtius per a manejar la selecció del color.
(3) to, saturació, brillantor
El paràmetre to o matís (4) té els valors en graus, corresponents a la seva posició en la base o a la perifèria del con. Va de 0° a 360°. El paràmetre saturació (5) es mesura en percentatge, des d'un 0% no saturat (blanc, gris o negre) en l'eix central del con fins a un 100% de color pur a la perifèria. La brillantor (6) determina la lluminositat del color i també es mesura en percentatge des del 0% (negre) en el vèrtex del con fins al 100% en la base, que correspon a la lluminositat màxima dels colors purs i les seves combinacions, incloent-hi el blanc en el centre on se sumen tots els components.
Quan s'han de crear gammes de color harmòniques o determinats tipus de contrastos, és útil seleccionar el color fent servir el sistema HSB, ja que ens permet mantenir un paràmetre estable, per exemple, el to, i variar els altres, lluminositat o saturació.
Hi ha altres models que fan servir paràmetres molt similars a l'HSB, encara que en un ordre diferent, de vegades amb valors diferents i representats tridimensionalment d'una altra manera. Alguns són:
  • HLS (7) (hue, lightness, saturation),

  • HSV (8) (hue, saturation, value) o

  • HVC (9) (hue, value, croma),

2.4.10.Codificació CIE L*a*b
El 1931 la CIE (Comission Internationale de l'Éclairage) va crear el sistema de codificació del color CIE xyz, basat en el canvi de paradigma que classifica el color en funció de la percepció subjectiva de l'espectador i no intenta trobar un model bonic, geomètricament regular. El 1976 es va perfeccionar el sistema sota el nom de CIE L*a*b. (coordenades de lluminositat a i b).
El sistema està dissenyat per a garantir la coherència del color amb independència del dispositiu (escàner, monitor, impressora, etc.).
Els tres paràmetres que el determinen són:
  • Grau de lluminositat: un eix del negre (valor 0) al blanc (valor 100).

  • Component cromàtic a: un eix que va del verd (valor mínim –128) al vermell (valor màxim 127).

  • Component cromàtic b: un eix que va del blau (valor mínim –128) al groc (valor màxim 127).

L'ús de CIE L*a*b com a sistema de selecció de color sembla, en principi, menys intuïtiu que, per exemple, el sistema HLS. Però si s'entén a què responen els seus paràmetres serà molt més fàcil d'utilitzar.
Com a mode de color, CIE L*a*b utilitza tres canals en els programes de mapa de bits, un per a cada paràmetre. Per tant, requereix 24 bits.
Alguns programes, com el Photoshop, usen la codificació L*a*b com a mode intermedi en la conversió d'un mode a un altre. Per tant, pot ser una bona opció treballar en mode L*a*b per a crear gràfics que després hauran de tenir una versió per a pantalla en RGB i una versió impresa en CMYK, independentment del sistema que s'usi per a selecció del color.
2.4.11.Espais de color segons el dispositiu en CIE Yxy
Model CIE Yxy en el qual es poden observar els espais en funció de si és per a monitor, Pantone o CMYK.
Model CIE Yxy en el qual es poden observar els espais en funció de si és per a monitor, Pantone o CMYK.
En l'esquema superior es pot veure una representació bidimensional del model CIE Yxy (una evolució de l'inicial CIE zxy) en el qual es mostren els colors que es poden aconseguir en funció del dispositiu i/o del sistema de reproducció.
Fixeu-vos en el desencaix entre el que es pot representar en un monitor, que usa RGB per a generar una barreja additiva, i una impressió en paper. Fixeu-vos també en la diferència entre la reproducció impresa en quadricromia, colors percebuts gràcies a una barreja partitiva, i una reproducció impresa amb tintes Pantone, en què els colors són resultat d'una barreja substractiva de pigments. Hi ha colors impossibles d'aconseguir amb quadricromia que s'obtenen amb una barreja de pigments.
També convé remarcar que cap dels sistemes de reproducció del color no aconsegueix generar tota la gamma de colors que pot percebre l'ull humà. Hi ha una part significativa dels colors que podem percebre que queden fora de l'àrea dels colors que aquests sistemes poden generar.
2.4.12.Codificació CMYK
La codificació CMYK (cyan, magenta, yellow, black) o CMGN (cian, magenta, groc, negre) codifica el color usant com a components els tres colors bàsics de pigment i sumant-los el negre per a obtenir variacions de lluminositat combinat amb el blanc del paper. El color es defineix segons la proporció de cian, magenta, groc o negre, que s'hi apliqui. Com a mode de color, CMYK fa servir quatre canals de 8 bits i, per tant, requereix 32 bits.
Es tracta d'un sistema creat per a la reproducció del color en sistemes d'impressió i estampació. L'aplicació tradicional i més coneguda és l'anomenada quadricromia, que fa servir una trama regular de punts amb un angle d'inclinació determinat diferent per a cada un dels quatre colors. El resultat és que els punts no se superposen, tret que s'apliqui el 100% de cada color, formant una "roseta". La impressió per quadricromia permet, doncs, imprimir imatges en color usant només quatre tintes i obtenir una àmplia gamma de tons. La quadricromia s'usa principalment en la impressió òfset i, en determinats casos, en serigrafia.
La percepció d'aquests colors es produeix gràcies a una barreja partitiva. Per tant, hi ha determinats colors (especialment lluminosos o molt purs) que no es poden obtenir per quadricromia. Alguns programes de gràfics ens avisen quan, usant el mode CMYK, escollim un color que no és possible reproduir per quadricromia. A més de l'advertiment, ens assenyalen el color més pròxim que és possible imprimir.
Quan s'està creant un gràfic amb la finalitat d'imprimir-lo és millor treballar en mode CMYK, ja que el que veiem en pantalla s'aproximarà més al resultat final que si treballem en mode RGB. De tota manera, és important tenir en compte que, fins i tot treballant en mode CMYK, el que veiem en pantalla és una simulació en RGB que el programa genera intentant aproximar-se al que serà el resultat en CMYK. Un catàleg imprès de colors en quadricromia pot ser molt útil per a prendre decisions de color sense haver de basar-nos només en la visualització en pantalla.
La densitat de trama, quantitat de punts en una àrea determinada, és la que determina la qualitat de la imatge sobre el paper. Si la trama és molt fina, és possible que l'espectador no percebi els punts.
Les impressores de raig de tinta (de sobretaula o de gran format) també utilitzen el sistema CMYK, encara que el sistema de tramat és diferent. En comptes de la quadricromia tradicional usen un sistema que distribueix els punts de manera aleatòria i es crea una trama estocàstica.

2.5.Interacció del color

El quadrat més petit sembla canviar de color en funció del color de fons.
El sistema perceptiu humà no està basat en sensors inflexibles que mesuren amb exactitud la longitud d'ona que reflecteix cada objecte. Al contrari, la percepció dels colors depèn del context.
D'una banda, el color d'un objecte es pot percebre diferent en funció del color de fons que tingui. D'altra banda, el color d'un objecte es manté perceptivament estable canviant la il·luminació si manté la mateixa relació amb el seu context. És per això que és possible considerar que el vermell d'una llauna de Coca-Cola sobre una taula és el mateix, a la llum exterior del migdia, que la mateixa llauna il·luminada per una bombeta de 25 W sobre la mateixa taula.
Aquest efecte és important per al creador gràfic perquè un mateix element gràfic sobre diferents fons pot canviar de color. Per a aquests contextos és important tenir en compte una llei que es dedueix de l'experimentació:
El fons treu a la mostra (la figura) allò que comparteixen.
En la nostra composició d'exemple, des del punt de vista perceptiu, el fons violeta treu blau i una mica de vermell al quadrat magenta i el deixa apagat. El negre només hi treu foscor de manera que el fa lluminós. El verd clar li treu groc i lluminositat de manera que l'enfosqueix i l'empeny cap al vermell.
Josef Albers (1888-1976) és qui més va fer per cridar l'atenció sobre aquests fenòmens per mitjà de la docència a la Bauhaus i al Black Mountain Collage, en la seva creació pictòrica i en el llibre La interacció del color (Albers, 1996).
Les seves concepcions van tenir una gran influència en els artistes del corrent colour field dins dels expressionistes abstractes.
En els exemples adjunts, basats en les propostes de Josef Albers, diferents colors de fons interactuen amb el color dels elements gràfics que s'han disposat a sobre. El que passa és que el nostre cervell modifica el color en funció del contrast amb el fons.
Aquesta mena d'efectes funciona especialment bé amb colors terciaris, per si mateixos ja indefinits, sobre els quals poden actuar diferents colors.

2.6.Contrastos de color

2.6.1.La classificació d'Itten
Johannes Itten (1888-1967), professor dels cursos preparatoris de la Bauhaus, va definir set tipus de contrast entre colors. Es parla de contrast quan hi ha intervals sensibles entre dues àrees de color. La nostra percepció del color s'estimula amb el contrast, que aguditza o llima diferències.
Contrast i harmonia no són conceptes oposats, són en el mateix nivell; l'harmonia és una bona mesura del contrast.
A continuació es mostra la proposta d'Itten amb els seus propis exemples.
2.6.2.Contrastos de color en la creació visual
La classificació d'Itten continua essent una guia útil per a abordar la combinació pràctica de colors. Però la seva terminologia no encaixa exactament amb la terminologia actual, resultat del desenvolupament de les ciències del color.
A més hi ha dos contrastos que no són en el mateix nivell que la resta. El contrast de quantitat, com ja s'ha dit, se suma sempre a un altre tipus de contrast i el potencia. El que Itten anomena contrast simultani és un fenomen que es dóna en determinades situacions com a efecte de la interacció entre colors, però no representa un contrast en el mateix sentit que la resta.
Partint de la classificació d'Itten però adaptant-la a la terminologia basada en els paràmetres de to, saturació i lluminositat, a continuació s'ofereix una classificació pròpia que es farà servir per a mostrar una sèrie d'exemples aplicats.

3.Introducció a la tipografia

3.1.Tipografia: un mitjà gràfic per a un missatge verbal

Alguns signes d'escriptura tenen l'origen en un pictograma que ha evolucionat esquematitzant-se fins a un signe sense un sentit figuratiu.Signe xinès per al gerro triangular li. Originàriament és la representació d'un gerro i s'estilitza fins a convertir-se en el signe li.Pictograma semític bou (àlef). Originàriament era la representació d'un bou en els jeroglífics egipcis i passa a l'escriptura protosinaítica com a signe consonàntic. Després s'adapta i s'estilitza fins a convertir-se en el signe consonàntic àlef, i en passar de l'alfabet fenici al grec es canvia al signe vocàlic A.Font: Rastros del alfabeto: escritura y arte (1998). Barcelona: Fundació "la Caixa".
Alguns signes d'escriptura tenen l'origen en un pictograma que ha evolucionat esquematitzant-se fins a un signe sense un sentit figuratiu.
Signe xinès per al gerro triangular li. Originàriament és la representació d'un gerro i s'estilitza fins a convertir-se en el signe li.
Pictograma semític bou (àlef). Originàriament era la representació d'un bou en els jeroglífics egipcis i passa a l'escriptura protosinaítica com a signe consonàntic. Després s'adapta i s'estilitza fins a convertir-se en el signe consonàntic àlef, i en passar de l'alfabet fenici al grec es canvia al signe vocàlic A.
Font: Rastros del alfabeto: escritura y arte (1998). Barcelona: Fundació "la Caixa".
Malgrat que originàriament algunes deriven de pictogrames, les nostres lletres actuals són signes arbitraris que representen per convenció un so determinat.
El text és la plasmació gràfica del llenguatge verbal. La seva naturalesa visual influeix en la transmissió del missatge. En la cal·ligrafia i en la tipografia, la llegibilitat en funció del suport i el tipus d'aplicació, l'amenitat de lectura i el seu caràcter gràfic influeixen el lector.
En els treballs de disseny la tipografia té un doble paper: és text i és imatge. S'estableix un compromís entre la seva presència gràfica amb relació a altres elements visuals i les seves necessitats de llegibilitat. També hi ha en joc la sintonia entre forma i contingut.

3.2.Evolució històrica de l'escriptura

L'origen de l'alfabet llatí (i també de l'àrab, l'hebreu i el grec) cal buscar-lo en l'alfabet fenici, derivat al seu torn dels jeroglífics egipcis a través del protosinaític (Vita, 2005).
Les lletres capitals de les làpides romanes, equivalents a les nostres majúscules, es transformen, per escriptura manual en la baixa edat mitjana, en les minúscules. Serà Carlemany qui s'encarregarà de posar ordre a aquesta nova manera d'escriure i es crearà l'anomenada cal·ligrafia carolíngia, la base de les nostres minúscules.
Al segle xiii es consolida la cal·ligrafia anomenada gòtica, basada en el traç de ploma.
El 1455 Gutenberg fa les primeres impressions amb impremta de tipus mòbils. Entre el segle xv i xvi els tipògrafs venecians renoven la tipografia fent-la més clara i llegible. Al segle xvii tipògrafs com Baskerville, Didot o Bodoni introdueixen variants i matisos. Al començament del segle xviii apareixen les lletres de pal sec, destinades a la retolació, i a continuació les conegudes com a egípcies, lletres també gruixudes però amb serif.
Al començament del segle xx hi ha una recuperació de les lletres de pal sec, que es refinen gràcies a l'aplicació de la coherència geomètrica. D'altra banda, es dissenyen noves tipografies "romanes" amb gràcies (com la Times) que desenvolupen i actualitzen el treball dels tipògrafs humanistes del Renaixement. A la meitat del segle es presenta l'Helvetica, una de les tipografies de pal sec més difosa. A la segona meitat del segle, les tendències a aconseguir una tipografia clara i llegible per a tot tipus d'usos i aplicacions conviuen amb l'aparició de tipografies pensades per a la baixa definició de les pantalles dels ordinadors i una gran profusió de tipografies decoratives, per a retolació i experimentals.

3.3.El llenguatge tipogràfic

El conjunt de caràcters disponibles es diu font tipogràfica. La gamma de pesos, cursives i amples és coneguda com a família.
El llenguatge tipogràfic
Passeu el cursor sobre el text per veure els diferents elements de la font.
A més, la llarga tradició tipogràfica ha anat creant un vocabulari específic per a descriure l'aspecte i les parts dels caràcters tipogràfics. Aquest llenguatge ens permet parlar de tipografia i comparar una font amb una altra.

3.4.Anatomia del tipus

Moltes vegades els tipògrafs usen termes anatòmics per a descriure les parts i característiques dels caràcters tipogràfics. La terminologia pot variar segons la tradició tipogràfica i les variants culturals o geogràfiques. Tot i així, considerem útil recollir aquest vocabulari que ens convida també a fer una observació minuciosa dels detalls tipogràfics.
El llenguatge tipogràfic
El llenguatge tipogràfic
pixel.gif
La caixa alta i la caixa baixa
Parlem de caixa alta o caixa baixa per referir-nos a les majúscules (derivades de les capitals romanes) i les minúscules (originàries de la cal·ligrafia medieval). Usem aquests termes més genèrics perquè, per exemple, unes versaletes serien unes lletres de caixa baixa però amb estructura i aparença de majúscules.
Però, de quina caixa parlem i per què de vegades és alta i d'altres baixa?
L'origen d'aquesta denominació procedeix de la composició de textos en tipus mòbils. Cada font tipogràfica es recollia en una caixa amb una casella (o caixetí) per a cada lletra. Les que anomenem lletres de caixa alta se situaven en la part superior de la caixa i les de caixa baixa en la inferior.
Fixeu-vos que algunes lletres (com la c, la d, la i, etc.) tenen el caixetí més gran perquè, en ser més freqüents, la font inclou més tipus d'aquestes lletres.
50018_m4_59.jpg

3.5.Traços i terminals

En una anàlisi del tipus podem diferenciar entre traços i terminals. Els traços principals poden ser uniformes si mantenen el gruix constant, i modulats si el varien. En el cas que hi hagi modulació, aquesta suggereix un eix que pot ser vertical o inclinar-se en diferents graus depenent de la tipografia.
En l'extremitat dels traços es poden trobar els traços terminals –també anomenats gràcia o serif. En funció de la família tipogràfica, els terminals són d'una forma o d'una altra. Hi ha famílies (les lineals o de pal sec) els traços terminals de les quals no inclouen gràcies i són conegudes com a sense gràcia o sans serif.
Traços i terminals

3.6.Estructura geomètrica del caràcter tipogràfic

Si ens centrem en els elements constitutius bàsics de les lletres, aquestes es poden caracteritzar segons quatre tipus de línies:
  • Rectes ortogonals: usa línies rectes verticals i/o horitzontals.

  • Rectes fragmentades: usa línies rectes combinant verticals i horitzontals amb obliqües.

  • Corbes: usa línies corbes.

  • Mixtes: combina línies corbes amb línies rectes.

Reconeixement automàtic de caràcters
El fet que totes les famílies tipogràfiques comparteixin una estructura comuna ha permès crear sistemes informàtics que a partir de la imatge d'un text són capaços de reconèixer cada caràcter com a tal i convertir-lo en text editable. Són els programes anomenats OCR (de l'anglès optical character recognition, reconeixement òptic de caràcters), que permeten convertir un text en paper escannejat en text apte per a qualsevol programa de tractament de textos.
Els primers programes OCR eren molt bàsics i es van crear alfabets expressos per a ells que eliminaven qualsevol tipus d'ambigüitat entre una lletra i una altra; actualment, són capaços de reconèixer un text de qualsevol tipografia mentre la imatge original no estigui feta malbé. Per exemple, una n mal impresa de manera que la segona asta es perdi es podria reconèixer com una r.
Com ho fan? Com pot reconèixer un sistema informàtic una forma, interpretar-la i assignar-hi un caràcter?
A continuació es mostren esquemàticament dues possibles maneres de fer-ho. En la primera, el sistema té una sèrie de plantilles i comprova si la imatge d'entrada coincideix amb alguna. En la segona, coneguda com a pandemònium (Selfridge, Lindsay i Norman), s'utilitzen les diferències d'estructura geomètrica dels tipus per a seleccionar les característiques coincidents.
Identificació d'un caràcter partint de la comparació amb plantillesFont: Johannes M. Zanker [consulta 7-2009]. Visual Perception II: Objecte recognition. http://www.pc.rhul.ac.uk/staff/J.Zanker/
Identificació d'un caràcter partint de la comparació amb plantilles
Font: Johannes M. Zanker [consulta 7-2009]. Visual Perception II: Objecte recognition. http://www.pc.rhul.ac.uk/staff/J.Zanker/
Identificació d'un caràcter partint del pandemòniumFont: Peter H. Lindsay; Donald A. Norman (1983). Introducción a la Psicología Cognitiva (ed. original 1977). Madrid: Tecnos.
Identificació d'un caràcter partint del pandemònium
Font: Peter H. Lindsay; Donald A. Norman (1983). Introducción a la Psicología Cognitiva (ed. original 1977). Madrid: Tecnos.

3.7.Classificació de les famílies tipogràfiques

És evident que hi ha famílies tipogràfiques que tenen aspectes i característiques similars. Però l'intent de classificar-les en grans grups no ha trobat un sistema definitiu, entre altres coses perquè es continuen dissenyant nous tipus, alguns difícils de classificar.
Els esforços per a ordenar les fonts en categories té com a propòsit entendre-les millor i poder-les combinar amb èxit. La classificació pot adoptar un o diversos criteris combinats: per dates, per l'evolució, per les formes intrínseques dels tipus, pels elements clau, etc.
Una distinció molt clara i comprensible és la que s'estableix entre famílies tipogràfiques amb gràcia o sense gràcia:
  • Amb gràcia o serifs. Els caràcters amb gràcia o serif presenten petits traços en les astes verticals i horitzontals; això en facilita la lectura, ja que ens ajuda a reconèixer els caràcters, sobretot en material imprès (els llibres). El seu origen és més antic que les sense gràcia i es remunten a la recuperació de les formes romanes en el Renaixement, encara que en l'actualitat es continuen creant noves tipografies amb gràcies.

  • Lineals, sans serif o de pal sec. Es caracteritzen perquè no tenen gràcia o serifs en els traços terminals. Els seus traços solen tenir menys variacions, una x més alta i, en general, uns traços menys inclinats. Són fonts d'origen més modern, els primers tipus comencen a crear-se en els últims anys del segle xix.

Però, fins i tot atenent només les gràcies, aquesta distinció bàsica resulta insuficient. Observant les fonts amb gràcies podem formar alguns grans grups en funció de la forma i la mida. Una classificació bàsica basada en els traços terminals segons tinguin gràcia o no i segons la forma de les gràcies pot ser el següent:
  • romanes antigues,

  • de bloc serif o egípcies,

  • romanes modernes o Didones,

  • lineals o de pal sec,

  • d'escriptura.

La classificació que acabem de presentar es basa en la que Francis Thibaudeau (1860-1925) va desenvolupar entre 1921 i 1924 per a l'elaboració de catàlegs tipogràfics. És una de les primeres classificacions que atén les característiques formals del tipus sense supeditar-les als factors històrics. La seva classificació, que marcarà les propostes posteriors, es basa en quatre famílies bàsiques que completa amb dues categories menys definides per donar cabuda a les fonts d'escriptura i les de fantasia, aquestes últimes per als caràcters dels cartells publicitaris. Les seves quatre categories bàsiques són les següents:
  • Elzeviriana (romanes antigues): gràcies triangulars

  • Didot (romanes modernes): gràcies filiformes

  • Egípcia (de bloc): gràcies quadrangulars

  • Antiga (de pal sec): absència de gràcies

El 1959 el tipògraf italià Aldo Novarese (1920-1995) desenvolupa una classificació una mica més extensa també molt centrada en les diferències entre terminals. La seva classificació té deu grans famílies, entre les quals també s'inclouen les de fantasia, que en certa manera serveixen de calaix de sastre per a les fonts que no concorden amb la resta de categories:
1) Lapidari (lapidàries)
2) Medievali (medievals)
3) Veneziani (venecianes)
4) Transizionali (transicionals)
5) Bodoniani (bodonianes)
6) Scritti (escriptura o d'inspiració cal·ligràfica)
7) Ornati (ornades)
8) Egiziani (egípcies)
9) Lineari (lineals)
10) Fantasie (fantasia)
Ja hem vist en l'apartat anterior que no només són les gràcies el que defineix una font, sinó que hi ha altres característiques dels traços i les proporcions que la defineixen i hi confereixen identitat. Analitzant tots aquests aspectes i tenint en compte la seva evolució històrica, diversos autors han proposat sistemes de classificació tipogràfica més complets. Una de les classificacions més assentades és la coneguda com a Vox-ATypI. Altres intents de classificació s'hi basen per a corregir-la o completar-la.
3.7.1.Classificació tipogràfica Vox-ATypI
En 1954 el dissenyador i historiador tipogràfic Maximilen Vox (1894-1974) va proposar un sistema de classificació de les fonts tipogràfiques basat en nou categories:
1) Humanístiques
2) Garaldes
3) Reals
4) Didones
5) Mecàniques
6) Lineals
7) Incises
8) D'escriptura
9) Manuals
La classificació de Maximilien Vox és adoptada i completada el 1962 per l'ATypl (Association Typographique Internationale), que la tradueix a l'anglès i a l'alemany buscant una terminologia per a les categories que es pugui reconèixer tant en les llengües llatines com en les anglogermàniques. S'incorporen dues categories més, arribant fins onze: les frakturs (per a les fonts inspirades en l'escriptura medieval o gòtica) i les no llatines (un calaix de sastre que engloba les tipografies en caràcters no llatins).
ATypl (Association Typographique Internationale)
L'ATypl és l'associació internacional tipogràfica (l'acrònim s'obté del nom oficial en francès, Association Typographique Internationale). Es va crear el 1957, inicialment com un grup de creadors i distribuïdors de fonts tipogràfiques. Entre els anys vuitanta i noranta del segle xx es van incorporar a l'organització creadors independents de fonts i dissenyadors usuaris de fonts tipogràfiques.
Anualment convoca una conferència internacional que en cada edició té una ciutat diferent com a seu.
El lloc web oficial de l'ATypl és el següent: http://www.atypi.org/
La classificació Vox-ATypl té en compte l'evolució històrica de les tipografies però, sobretot, les característiques formals: forma de les terminals; modulació i amplària del traç; eix d'inclinació; relació entre l'alçària de la caixa alta, les terminals i l'alçària de x; etc.
Les onze categories es van agrupar en quatre grans grups i la classificació va quedar de la manera següent:
1) Clàssiques
  • Humanístiques

  • Garaldes

  • Reals

2) Modernes
  • Didones

  • Mecàniques

  • Lineals

3) Cal·ligràfiques
  • Incises

  • D'escriptura o scripts

  • Manuals

  • Fractures

4) No llatines
  • No llatines

El 1964, prenent com a base la classificació definida per l'ATypI, l'Institut Alemany de Normalització (DIN, per les sigles de Deutschen Instituts für Normung), va definir el seu propi estàndard de classificació, la norma DIN 16518. Hi prenia les onze categories de l'ATypI i, responent a una rica tradició pròpia, dividia les fractures en cinc subcategories: Gotisch (gòtica), Rundgotisch (gòtica rotunda), Schwabacher (Schwabachiana o a l'estil de Schwabach), Fraktur (fractura), Fraktur-Varianten (variants de fractura).
El 1967, l'organisme britànic d'estandardització (British Standard Body) adopta també la classificació de l'ATypI i crea l'especificació British Standards 2961 o BS 2961. Aquesta classificació va prendre les nou categories inicials de Vox però dividint les lineals en quatre subcategories segons les seves característiques: grotesque (grotesques), neo-grotesque (neogrotesques), geometric (geomètriques) i humanistic (humanistes o lineals neohumanistes).
A continuació es presenten les onze categories amb les seves característiques, context històric i exemples que les il·lustren. S'ha expandit la categoria de lineals en tres subcategories segons les seves característiques seguint la classificació de Lewis Blackwell (10) basada en BS 2961. També hem agrupat l'explicació de la categoria d'escriptura amb la manual. Hem afegit, a més, el nostre propi calaix de sastre d'inclassificables.
Equivalències entre taxonomies tipogràfiques relacionades amb Vox/ATypI
Vox (1954)
Vox/ATypI (1962)
DIN 19518 (1964)
BS 2961 (1967)

 

1. Clàssiques

 

 

1. Humanístiques

1.1. Humanístiques

I. Humanístiques

I. Humanístiques

2. Garaldes

1.2. Garaldes

II. Garaldes

II. Garaldes

3. Reials

1.3. Reials

III. Reials

III. Reials

 

2. Modernes

 

 

4. Didones

2.1. Didones

IV. Didones

IV. Didones

5. Mecàniques

2.2. Mecàniques

V. Mecàniques

V. Mecàniques

6. Lineals

2.3. Lineals

VI. Lineals

VI. Lineals

 

2.3.1. Grotesques

 

VI.a. Grotesques

 

2.3.2. Neogrotesques

 

VI.b. Neogrotesques

 

2.3.3. Geomètriques

 

VI.c. Geomètriques

 

2.3.4. Humanístiques

 

VI.d. Humanístiques

 

3. Cal·ligràfiques

 

 

7. Incises

3.1. Incises

VII. Incises

VII. Incises

8. D'escriptura

3.2. D'escriptura

VIII. D'escriptura

VIII. D'escriptura

9. Manuals

3.3. Manuals

IX. Manuals

IX. Manuals

 

3.4. Fractures

X. Fractures

 

 

 

X.a. Gòtiques

 

 

 

X.b. Gòtiques arrodonides

 

 

 

X.c. Schwabacher

 

 

 

X.d. Fractures

 

 

 

X.e. Fractures variants

 

 

3.5. Gaèliques

 

 

 

4. No llatines

XI. No llatines

 

Font: Wikipedia. Viquiprojecte Tipografia (UOC, 2010)

pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
pixel.gif
3.7.2.Bringhurst, una classificació historicista
Els sistemes de classificació que hem vist fins aquí tenen criteris que poden ser discutibles o problemàtics. El sistema de Vox/ATypI barreja criteris historicistes i formals per establir les categories que, a més, tenen denominacions una mica capritxoses.
Robert Bringhurst (nascut el 1964), poeta, escriptor i tipògraf canadenc, va proposar el 1992 un sistema de classificació centrat en els criteris historicistes, amb categories equivalents a les que s'usen en la història de l'art:
  • Renaixentistes. Desenvolupades a partir de la cal·ligrafia per escribes i erudits humanistes del nord de la península Itàlica entre els segles XIV i XV.

    Tenen traç modulat però sense molt contrast, un eix oblic, gràcies fines, alçària baixa de x, grans obertures, anells gairebé circulars.

    Famílies en aquesta categoria: Centaur, Bembo, Garamond.

  • Barroques. Desenvolupades durant els segles XVII i XVIII. S'aparten de l'escriptura cal·ligràfica.

    Modulades amb més contrast que les renaixentistes, obertures més moderades, eix variable, inclouen cursiva com a complement de la rodona.

    Famílies en aquesta categoria: Janson, Caslon, Garamond.

  • Neoclàssiques. Desenvolupades a partir del segle XVIII a França.

    Eixe vertical, modulades amb contrast moderat, gràcies en forma de llàgrima.

    Família en aquesta categoria: Baskerville.

  • Romàntiques. Desenvolupades entre els segles XVIII i XIX, abandonen la inspiració cal·ligràfica i passen a ser lletres "dibuixades".

    Modulades amb contrast extrem, gràcies fines i terminals arrodonits, obertures petites, eix principal vertical i secundari oblicu en algunes lletres.

    Famílies en aquesta categoria: Bodoni, Didot, Bulmer.

  • Realistes. Desenvolupades entre els segles XIX i XX a partir de les formes bàsiques de les "romanes" però sense modulació.

    Sense gràcies o amb gràcies en bloc, no modulades, amb traç uniforme, amb eix vertical, obertures petites.

    Famílies en aquesta categoria: Franklin Gothic, Helvetica.

  • Modernistes geomètriques. Desenvolupades al segle XX buscant l'estructura de les formes geomètriques bàsiques com el cercle i la línia.

    Sense gràcia o amb gràcia igual en pes al traç, sense modulació, sense eix, anells circulars.

    Famílies en aquesta categoria: Futura, Memphis.

  • Modernistes líriques. Són fruit del redescobriment, al segle XX, de les formes renaixentistes.

    Traç modulat, gràcies fines.

    Famílies en aquesta categoria: Palatino, Dante, Pontifex.

  • Postmodernistes. Desenvolupades a final del segle XX a partir de la revisió, l'hibridació o la paròdia de formes neoclàssiques i romàntiques.

    Eix vertical, gràcies bruscament modelades.

    Famílies en aquesta categoria: Espirit, Nofret.

3.7.3.Panose, una classificació formalista
Al contrari que la proposta de Bringhurst, el sistema Panose busca classificar les famílies tipogràfiques estrictament sobre la base de les característiques formals, sense atendre el moment en el qual van ser creades o el context històric.
Per a això s'han definit diverses característiques visuals a cadascuna de les quals correspon un dígit que correspon a un valor en una escala.
La primera versió del sistema Panose va ser definida per Benjamin Bauermeister el 1985 (publicada el 1988) i es va anar desenvolupant en anys posteriors millorant-ne la capacitat descriptiva (afegint dígits), alhora que es desenvolupaven aplicacions per a utilitzar-les en metadades o sistemes de classificació automatitzats. L'especificació Panose 2.0 es va presentar el 1993. El 1995 Hewlett Packard, que l'usa com a tecnologia de reconeixement de fonts per a impressora, va adquirir el sistema.
L'especificació Panose 1.0 té deu dígits. El primer dígit defineix la classe de família i els nou següents serveixen per a definir diversos aspectes formals. Així, per a una família tipogràfica de l'alfabet llatí els deu dígits correspondrien a les característiques següents.
pixel.gif
Cadascuna de les classes del primer dígit té les seves pròpies característiques per als nou dígits següents amb les escales de paràmetres corresponents.
En l'exemple següent es mostra com s'aplica el sistema Panose per a classificar la família tipogràfica Times New Roman.

Classe de família

2. Latin text (text llatí)

Tipus de gràcia

2. Cove (connexió amb l'asta suavitzada per traços arrodonits)

Pes

6. Medium (mitjà)

Proporció

3. Modern (modern)

Contrast

5. Medium-low (mitjà-baix)

Variació de traç

4. Gradual/transitional (gradual, de transició entre diagonal i vertical)

Estil de braç

5. Straight arms / single serif (braços rectes, gràcia simple)

Forma de lletra

2. Normal/contact (rodona)

Línia mitjana

3. Standard/pointed (alçària estàndard de línia mitjana, terminal en punta dels traços diagonals)

Alçària x

4. Constant/large (alçària de caixa alta constant, alçària alta de x)

Amb Panose 2.0 es va augmentar el nombre de dígits, desdoblant o dividint cadascuna de les característiques en característiques més específiques.
En la taula següent es mostra la relació entre les característiques definides en els dígits de la versió 2.0 respecte a la versió 1.0.
50018_m4_92.gif
Com es pot veure, el sistema Panose parteix d'una anàlisi formal molt precisa que aconsegueix parametritzar. El seu ús pràctic és incontestable, aquest sistema és la base de tecnologies de reconeixement de caràcters i de classificació per part d'impressores, programari d'edició, programari de web i sistemes de metadades.
Com que no ofereix una llista reduïda de categories i n'expressa la classificació amb codis numèrics, resulta poc útil com una manera de referir-se a les fonts en la comunicació habitual entre creadors gràfics. Sí que pot resultar molt útil, en canvi, per a analitzar i comparar fonts que s'hagin de combinar o modificar.
Per què Panose?
La denominació Panose la va encunyar Benjamin Bauermeister, creador inicial del sistema, a partir de dividir les lletres de l'alfabet llatí en sis grups i després triar una lletra de cada grup de manera que formessin una paraula pronunciable. Els grups són els següents (es destaca en negreta la lletra triada en cada grup:
  • Lletres amb cantonades rectes i parts rodones: (B, D, J, P, R)

  • Lletres amb diagonals: (A, V, W, Z)

  • Lletres quadrades: (H, K, M, N, X)

  • Lletres rodones: (C, G, O, Q)

  • Lletres semirodones: (S, U)

  • Lletres semiquadrades: (E, F, L, T, Y)

3.8.Combinar fonts tipogràfiques

"El tipógrafo novel que tenga que proyectar un libro tendría que empezar por explorar en primer lugar las posibilidades que ofrece la unidad tipográfica [el uso de una sola familia tipográfica], y sólo tendría que pasar a combinar tipos distintos cuando su gusto se haya consolidado y depurado.[...] Un libro donde se utilice un solo tipo será en el peor de los casos solamente mediocre; el error en la combinación de familias produce resultados nauseabundos."

Josep M. Pujol; Joan Solà (1995). Ortotipografia; manual de l'autoeditor i el dissenyador gràfic (11) . Barcelona: Columna.

(11) Citació traduïda de l'original en català.
Aquesta citació pot ser extremadament normativa, però en línies generals és un bon consell per a qualsevol producte gràfic fer servir una o, com a màxim, dues tipografies. Si aquest és el cas, els mateixos autors recomanen:

"Cuando se combinan dos tipografías hay que evitar el peligro de caer en la ambigüedad: tienen que ser familias bien contrastadas."

Josep M. Pujol; Joan Solà (1995). Ortotipografia; manual de l'autoeditor i el dissenyador gràfic (12) . Barcelona: Columna.

(12) Citació traduïda de l'original en català.

3.9.Composició de text: lletres, paraules, línies

3.9.1.La mida
La mida d'una font tipogràfica no depèn ni de l'alçària de la caixa alta, ni de l'alçària d'ascendents ni de l'alçària de x. Depèn de l'alçària del cos. El cos és un requadre amb la mateixa alçària per a totes les lletres que en els tipus metàl·lics corresponia a la mida de la peça. La mida del cos es mesura en punts.
Si usem dues famílies tipogràfiques, la mateixa mida de cos pot no ser equivalent a una mida aparent igual per a les dues. La diferència entre alçària de x, alçària d'ascendents i forma de la lletra pot fer que una tipografia sembli més gran que una altra que està a la mateixa mida. En aquest cas, és millor guiar-nos per la nostra impressió visual.
3.9.2.Unitats físiques per a mesurar tipus

"Durante más de 250 años después de la invención de los tipos móviles que realizara Gutenberg, cada fundición produjo tipos con sus propias especificaciones y tamaños, lo cual significaba que un tipo no era intercambiable entre una fundición y otra. En respuesta a esta situación caótica, el grabador francés Pierre Simon Fournier formuló el sistema de puntos en 1737."

Christopher Perfect (1992). Guía completa de la tipografía. Barcelona: Blume.

El sistema de punts, modificat per Firmin Didot el 1785, que va definir el punt en 0,0148 polzades (0,03759 cm), és l'usat a l'Europa continental. A la Gran Bretanya i als EUA s'empra un sistema creat el 1870 que defineix el punt en 0,0138 polzades (0,03505 cm).
Si el punt és la unitat bàsica, el cícero és la unitat més gran. Dotze punts equivalen a un cícero. Als països anglosaxons, dotze dels seus punts són una pica. Per a fer la correspondència es pot dir que una distància de catorze punts Didot europeus continentals equival a una distància de quinze punts anglosaxons.
El cícero es diu així a Espanya, França i Alemanya; a Itàlia la mateixa mesura l'anomenen riga, i augustijn o aug a Holanda.
3.9.3.La mida del tipus en pantalla
En les pantalles d'ordinador no podem utilitzar mesures físiques per a mesurar els tipus, ja que no podem saber per endavant la mida de la pantalla on es veuran i la seva relació amb la resolució de la imatge.
El que es pot controlar en relació amb els gràfics que s'han de veure en pantalla és el nombre de píxels que ocupa un element determinat. Els píxels són, doncs, la mesura per a treballs que s'han de veure en pantalla. En conseqüència els programes de gràfics de mapa de bits permeten usar els píxels com a mesura per als tipus de text.
Respecte a formats vectorials (SWF, SVG, PDF), normalment, els programes de gràfics permeten triar entre diferents unitats de mesura, tant píxels com mesures físiques. De fet, aquests formats permeten l'ampliació sense pèrdua de qualitat, per la qual cosa la mida del text és més important en relació amb altres textos o elements de la composició que no amb un problema de resolucions.
Quan el text no està integrat en un gràfic sinó que es manté com a tal, tenim un altre tipus de mesures relatives que ofereixen més control de mida a l'usuari-lector i un control acceptable de les jerarquies al dissenyador. Aquest és el cas del text en el web.
3.9.4.La mida del tipus en el web
Les noves especificacions del W3 Consortium a partir de mitjan els anys noranta van configurar una sèrie de característiques noves per al web entre les quals es pot destacar la separació entre estructura i aparença. La pàgina HTML proporciona l'estructura o suport del contingut per a la pàgina. I els fulls d'estil (CSS) ofereixen el control de l'aparença. Amb els fulls d'estil és possible definir tots els aspectes visuals d'un web: des de la mida (absoluta o relativa) i les característiques dels textos fins al color, tipus de línia, posició o mida dels elements gràfics o blocs de contingut.
Si volem usar mesures absolutes en el web podem definir mides de lletres usant píxels (px) com a unitats. Amb px definim que alguna cosa (un text, un paràgraf) té una mida determinada en píxels en pantalla. Però aquesta pantalla, depenent del monitor utilitzat, pot ser de mides diferents i la resolució pot estar definida amb diferents configuracions. Potser l'observador necessita canviar les mides per qüestions del context en què el visualitza (dispositiu de pantalla petita, llum del sol reflectida en pantalla) o de les seves (dis)capacitats visuals. Si fixem les mesures com a absolutes li ho estem dificultant.
L'alternativa és usar mesures relatives. Les tenim com a percentatges (%) i variacions de l'alçària de M (ema) i l'alçària de x (ics). Podem usar mesures relatives als contenidors, a les seves vores, marges i espaiat intern. També com a mida per al text.
3.9.5.La mida relativa en la web
En funció de què donem un percentatge?
Els percentatges queden determinats en funció del contenidor pare. Per a un paràgraf que estigui directament en una pàgina, un valor de 50% (p style="width:50%"><) significa que ocuparà la meitat de la pàgina. El mateix paràgraf dins d'un contenidor div que mesuri 500 píxels mesurarà la meitat del div, és a dir, 250 píxels(<div style="width:500px" style="width:50%">) perquè el div és el seu contenidor pare.
Si definim la mida d'una font a 180% ("font-size:180%") i la font està directament en una pàgina, estarem definint un percentatge en funció del que l'usuari ha escollit com a mida mitjana en les preferències del seu navegador (Firefox, IExplorer, Safari, etc.). Si no ha escollit res, serà un 180% de la mida mitjana per defecte definida pels desenvolupadors del programa.
Si el text és dins d'un paràgraf que, al seu torn, té definida una mida de font, quan modifiquem la mida una altra vegada ho fem en funció d'aquest valor.
I això també és vàlid per a les mesures ema i ics:
  • L'alçària de M és en la tradició tipogràfica la mida d'una M majúscula en caixa alta. El seu equivalent en CSS és ema i es refereix a la mida del tipus. No podem prendre'l estrictament com la mida de la M, però sí que és una mesura molt útil que podem usar tant horitzontalment com verticalment.

  • L'alçària de x és en la tradició tipogràfica la mida de la x minúscula en caixa baixa. El seu equivalent en CSS és ics. Com s'ha vist, l'alçària de x no és igual i varia segons la font tipogràfica.

3.9.6.Espaiat del tipus
L'espaiat d'un caràcter es defineix pel quadratí, la mida del qual està relacionada amb la del cos.

"En un sistema básico de 18 unidades, una «M» de caja alta (la letra más ancha) tiene 18 unidades, la «o» de caja baja, 10 unidades y la «i» de caja baja, 4 unidades."

Perfect (1992)

Hi ha fonts tipogràfiques que conserven la mateixa mida per a tots els caràcters, són les conegudes com a mono o monoespaiades (en anglès monotype). Aquestes lletres deriven de la necessitat que hi havia en les màquines d'escriure mecàniques convencionals de mantenir la mateixa distància per a cada caràcter. També es van usar en els primers ordinadors. El resultat és una font descompensada proporcionalment entre caràcters. Algunes fonts monoespaiades comunes són la Courier, la Monaco o la Monotxt.
Així doncs, l'amplada de la M definia l'alt del tipus i de la seva divisió s'extreien les unitats per a mesurar la resta de les lletres. A més, aquesta mesura, anomenada quadratí, s'usava per a espais en blanc horitzontals, per a caràcters com el guió llarg (que mesura un quadratí) i per a espais més estrets de mig quadratí o un quart de quadratí. El fet d'usar múltiples i divisors d'una mateixa mesura ajuda a donar coherència tant al disseny com a l'aplicació tipogràfica.
50018_m4_70.gif
3.9.7.Interlletratge i espaiat entre paraules
L'espaiat entre lletres (també anomenat interlletratge, intercaràcter o, en anglès, tracking) determina la regularitat del text i no és igual per a totes les combinacions de lletres. Els sistemes digitals solen permetre modificar-lo. Els sistemes més simples permeten només tres nivells indefinits: compacte, normal i ampli (o estès). Però la major part de sistemes d'autoedició i processadors de textos permeten controlar aquesta distància per valors numèrics. També els fulls d'estil CSS per al web permeten definir aquest paràmetre.
L'espaiat entre paraules ha de permetre una lectura fluida, ni massa ample ni massa estret. Per regla general, correspon a l'amplària d'una lletra d'espaiat mitjà com la a, la r o la n, de caixa baixa.
3.9.8.El cran
Les lletres que deixen molt espai blanc (com la T de caixa alta) creen una separació visual respecte a la lletra anterior o la següent. Això es corregeix superposant una lletra en l'espai horitzontal de l'altra. És el que s'anomena el cran (en anglès kern) i originalment era una osca en el tipus metàl·lic. Actualment, és una correcció que sol estar informàticament programada i que, en cas que no ho estigui, podem modificar amb un interlletratge de valor negatiu.
El cran és la superposició d'una lletra en l'espai horitzontal d'una altra lletra adjunta per evitar els desagradables espais buits.
El cran és la superposició d'una lletra en l'espai horitzontal d'una altra lletra adjunta per evitar els desagradables espais buits.
Què és el kerning?
Els dissenyadors solen parlar de kerning per referir-se a l'ajust del cran o a l'interlletratge negatiu entre dues lletres. El terme kerning és en anglès el participi del verb to kern. Kerning adjustment seria l'ajust d'interlletratge o ajust del kern, i per a abreujar ha quedat només en kerning.
Resumint:
  • Kern. Terme anglès per al cran (el terme en català deriva del que s'usa en francès). Espai d'una lletra que entra en el d'una altra de contigua. originàriament era una osca en el tipus.

  • To kern. Ajustar l'espai horitzontal entre un parell de lletres. El verb no té equivalent en català.

  • Kerning. Abreviació de l'anglès kerning adjustment, ajust del cran entre dues lletres.

Per raons físiques, en la tipografia tradicional ajustar el cran (kerning) o ampliar l'interlletratge (tracking) era una cosa diferent: en el primer cas usar una osca en el tipus, en el segon inserir tipus blancs d'espaiat. En la tipografia digital ja no existeix aquesta distinció, per la qual cosa podem parlar d' interlletratge positiu (ajustar espai entre lletres sense que entrin les unes dins de les altres, tracking) o interlletratge negatiu (estrènyer l'espai entre lletres fins que les unes entrin dins de l'espai de les altres, kerning).
3.9.9.Interlineat
L'interlineat és l'espai entre una línia de text i la següent. Si no s'insereix un espai vertical addicional entre línies de tipus, es diu que la composició és sòlida: a un cos 14, un interlineat 14.
Els valors de l'interlineat es refereixen a la suma de la mida del cos més l'espai intermedi. En la composició manual s'afegia espai entre línies inserint tires de plom. 14/14 significa que els cossos d'una línia es toquen amb els de baix; 14/16, que hi ha dos punts entre els cossos; 14/13, que el cos de les dues línies se superposen.
L'interlineat ha d'evitar que els ascendents i descendents arribin pràcticament a tocar-se i creïn un text d'aparença compacta i de lectura difícil. L'interlineat mínim habitual (depenent de la família) és a partir d'un punt més gran que el cos i un màxim de tres punts. Això depèn de cada font tipogràfica, però s'ha de tenir present que un interlineat massa gran també dificultaria la lectura.

3.10.Composició de text: columnes i pàgines

3.10.1.Amplada de columna
El text se sol dividir en columnes dins d'una mateixa composició. L'amplada d'aquestes depèn de la mida del text i de la família tipogràfica. Entre 60 i 65 caràcters sol ser una opció correcta. L'amplada entre columnes o canal és relativament lliure i afecta en gran manera la composició general de la pàgina.
Amplada de columna
3.10.2.Alineació
En tota composició tipogràfica es forma una reixeta base imaginària on s'assenten els tipus. Partint d'aquesta podem alinear les línies. El text es pot alinear a la dreta, a l'esquerra, al centre de manera simètrica, justificat o compondre'l de manera asimètrica.
L'alineació a l'esquerra és força habitual. En aquest cas es diu que forma bandera cap a la dreta (com si estigués lligat a un pal a esquerra).
L'alineació a la dreta s'usa menys, perquè és més difícil trobar-hi el principi de la línia següent. Se sol usar en peus de foto quan la imatge es troba a la dreta.
El text centrat presenta gran dificultat de lectura contínua, però per la seva simetria produeix un efecte de composició clàssica que pot ser interessant.
Justificat significa que el text està alineat a l'esquerra i a la dreta. El lector no té dificultat a trobar la línia següent i el text es pot tractar compositivament com un bloc regular. Com s'aconsegueix el justificat? Augmentant l'interlletratge i l'espai entre paraules (això està automatitzat en els sistemes informàtics). El resultat pot ser contraproduent si la columna és estreta i es produeixen espaiats que fragmenten el text en ser més amples que l'interlineat.
Compondre el text de manera asimètrica pot tenir un efecte visual interessant. Quant al contingut, és evident que dificulta la lectura, però pot reforçar-lo en un text de tipus poètic si la fragmentació està estudiada i reforça el sentit i ritme del text.
3.10.3.Divisió del text
El text es divideix en paràgrafs. Els paràgrafs es poden distingir afegint una separació més gran a l'interlineat habitual. Aquesta separació no ha d'arribar a ser tan ampla com una línia en blanc, perquè el text quedaria massa fragmentat. La majoria de programes de composició de text permeten afegir un espaiat anterior o posterior al paràgraf amb valors mesurats per punts, percentatges o qualsevol altra unitat de text.
Una altra manera de diferenciar el paràgraf és fer servir les anomenades sagnies: la inserció d'un espai en la primera línia del paràgraf. La tradició editorial diu que aquest ha de ser d'entre un i dos quadratins i que no s'ha d'utilitzar en el primer paràgraf d'un capítol o en el primer després d'un títol.
3.10.4.Composició de pàgina
Tant en els productes impresos com en els de suport digital que es presenten en pantalla, hi ha un espai delimitat que actua com a marc de la composició. Dins d'aquest es compon el text, combinat si és possible amb altres elements visuals.
Un aspecte a tenir en compte és la determinació dels marges entre el límit del marc i l'àrea en què es disposa el text. Per a definir-los s'han de tenir en compte les proporcions generals del marc i les proporcions dels marges entre ells. És habitual deixar un marge més gran a baix que a dalt, i més petit en els costats. Si es tracta d'un llibre, l'espai serà diferent en la part exterior i interior. En llibres i revistes la doble pàgina es percep com una composició integrada, i es considera el marge interior com la suma dels de les dues pàgines contigües. La composició a doble pàgina tendeix a ser simètrica en productes convencionals.
Disposar un element en el límit del marc no és habitual; quan es fa es diu que està a sang perquè és en la línia on la guillotina talla el paper en un producte imprès. En aquests casos l'element s'estén una mica fora del paper (a la zona de sagnia, ajustable en els programes de disseny i autoedició) per si la guillotina tingués un petit desplaçament. Poden estar a sang les imatges i en algun cas els textos si es tracta de titulars. No es fa servir amb els textos continus tret que es vulgui dificultar deliberadament la llegibilitat.
Com a recurs per a la composició coherent de text i la seva combinació amb imatges, se solen usar retícules invisibles. Les imatges s'ajusten de manera que ocupin una o més columnes de text o bé divisions regulars d'aquestes.
3.10.5.Textura i color del text
Independentment del color de les lletres, hi ha un color global dels blocs de text que varia en funció de la família tipogràfica, l'estil, la mida, l'interlineat, l'espaiat i altres factors.
Tradició tipogràfica enfront d'hipertext
El disseny editorial és una disciplina amb una important tradició heretada de les arts del llibre. En ella hi ha una gran quantitat d'usos i convencions que convé tenir en compte per a seguir-los o transformar-los. La introducció de l'hipertext introdueix nous elements per a l'organització gràfica del text.
Val la pena recórrer a la bibliografia per a estudiar a fons aquests temes. Un punt de partida pot ser el llibre següent, un bon compendi de la tradició editorial i ortotipogràfica:
Josep M. Pujol; Joan Solà (1995). Ortotipografia; manual de l'autor, l'autoeditor i el dissenyador gràfic. Barcelona: Columna.
La interacció entre el color de les lletres i el del fons produeix un efecte de barreja partitiva que fa percebre un nou color.
En composicions en blanc i negre es parla de gris de pàgina perquè es refereixi a aquest efecte que produeix el text. Un bloc de text es pot percebre en el seu conjunt com un gris més clar o més fosc.
Autoedició
L'autoedició és el terme amb què, a partir dels anys vuitanta del segle xx, es va començar a anomenar el disseny i producció de material imprès (llibres, revistes, cartells, etc.) mitjançant ordinadors personals corrents. L'autoedició (en anglès DTP o desktop publishing, edició d'escriptori o d'oficina) va substituir els sistemes de fotocomposició (basats en la reprografia i l'ús de fotolits basats en les tècniques fotogràfiques), que al seu torn havien substituït als tipus metàl·lics.
El naixement de l'autoedició va ser possible per la convergència de l'ordinador personal amb ratolí i interfície gràfica que representaven els Macintosh d'Apple, la tecnologia d'impressores d'escriptori de Xerox i el Page Maker de l'Adobe com a primer programa comercial de maquetació.
El concepte té ressonàncies utòpiques, ja que prefigurava una situació en què tothom podria editar els propis llibres a casa seva. Del que no hi ha dubte és que va transformar totalment la indústria de les arts gràfiques i la premsa escrita.
Al final de la mateixa dècada, l'anomenat programari d'autor es presentava amb la mateixa filosofia democratitzadora de l'autoedició, aquesta vegada amb l'objectiu de facilitar la creació de programes interactius i multimèdia.
Amb el fenomen del web 2.0, ja entrat el segle xxi, apareixen serveis de base web (com Lulu.com o bubok.es) que faciliten als autors la possibilitat d'autoeditar els seus llibres i ofereixen al lector potencial la impressió i tramesa del llibre a demanda.
La forma de la lletra també afecta el conjunt generant diferents tipus de textura que suggereixen sensacions tàctils.
Cliqueu sobre les diferents opcions per comprovar com canvia l'aspecte del text.

3.11.Llegibilitat i amenitat

"Por legibilidad entendemos la facilidad con la que las palabras pueden leerse cómodamente, a una velocidad normal de lectura."

Christopher Perfect (1992). Guía completa de la tipografía. Barcelona: Blume.

"La legibilidad se usa generalmente para designar la calidad de la diferenciación entre los caracteres, es decir, la claridad de las letras individuales. La amenidad de estilo es la calidad de lectura proporcionada por una obra tipográfica en la que lo apretado del texto, el interlineado y otros factores tienen una influencia decisiva en la función del tipo."

Lewis Blackwell (1998). Tipografía del siglo XX. Remix. Barcelona: Gustavo Gili.

3.11.1.Llegibilitat
Hi ha diversos aspectes que poden influir en la llegibilitat d'un text. A continuació se n'esmenten i comenten alguns.
El disseny del tipus. Les famílies que aconsegueixen més diferenciació entre caràcters sembla que són més llegibles. Si el disseny de lletres és molt homogeni dificulta la lectura. Els tipus han de ser gràficament coherents però diferenciats.
Serif o sans serif. Actualment hi ha cert consens en el fet que les tipografies amb gràcies aconsegueixen una diferenciació millor entre lletres i, en conseqüència, més llegibilitat, i se solen utilitzar en textos continus. En retolació (cartells, senyals) se solen utilitzar famílies tipogràfiques de pal sec, ja que les condicions de lectura (a distància, amb condicions d'il·luminació de tota mena) requereixen una tipografia amb gruixos que no es perdin i amb un fort contrast. Si es vol fer servir el pal sec en blocs de text, les tipografies lineals humanístiques ofereixen una opció amb un nivell de diferenciació més alt que les altres lineals.
Caixa alta o baixa. La caixa alta té una alineació horitzontal homogènia que uniformitza les lletres. La caixa baixa, amb caràcters més individualitzats, ofereix menys dificultat de lectura.
L'estil o pes. Un pes mitjà és més llegible que una font fina o negreta (encara que la negreta dins d'un text normal cridi l'atenció pel pes). Les fonts cursives perden llegibilitat per la seva inclinació.
Amplada de la font. Una font massa ampla o massa condensada perd en llegibilitat. Se sol usar el mode condensat per a informacions secundàries que han d'ocupar poc espai.
El suport. Les propietats del suport influeixen en la llegibilitat. La baixa resolució de les pantalles de televisió i d'ordinador paradoxalment baixen la llegibilitat de les tipografies amb gràcia. Una qualitat baixa del paper d'impressió pot fer necessaris tipus de traç gruixut i gràcies clares com els que tenen les fonts de la família de les egípcies.
3.11.2.Amenitat
Els aspectes següents influeixen en l'amenitat de la lectura.
Espaiat entre lletres i paraules. Un espaiat reduït es pot percebre com un amuntegament de lletres; si és massa ampli, pot fragmentar el text.
Mida del tipus. És evident que influeix en la lectura, encara que cal valorar-lo conjuntament amb el tipus de suport i la família tipogràfica escollida. Generalitzant, de 9 a 12 punts seria l'òptim; 8 estaria en el límit, i per sota seria difícil de llegir. Menys de 5 és gairebé illegible. 14 és tolerable, i per sobre s'accepta per a titulars, però és molest de llegir en text continu.
Amplada de columna. Ja s'ha dit que una mida estàndard podria ser entre seixanta i seixanta-cinc caràcters per columna. Una columna molt estreta fragmenta el text; en una de massa ampla el lector troba amb dificultat la línia següent.
Interlineat. Si és massa estret obtenim un abarrotament de text amb ascendents i descendents massa pròxims. Si és massa ample, interromp contínuament la lectura, que obliga a travessar contínuament espais blancs.
Alineació. L'alineació a l'esquerra i la justificada són les més llegibles. Per a textos curts es pot usar la centrada o l'alineada a la dreta. La justificada dificulta l'amenitat de lectura si provoca massa espaiat entre paraules o un espaiat molt variable (això sol passar en columnes estretes).
Contrast de color. La utilització de colors massa semblants (de to i sobretot de lluminositat) entre el text i el fons dificulten l'amenitat de la lectura. Cal buscar un contrast fort: colors clars amb foscos, colors molt saturats amb poc saturats. Per als contrastos de to és millor sumar-los a canvis en la lluminositat i la saturació, evitant combinar dos colors molt saturats que competeixen entre ells i, especialment, si creen un límit vibrant entre ells.

3.12.Expressivitat

a) Totes les famílies tipogràfiques són similars, ja que formen part del mateix alfabet. Superposades, mostren la seva estructura compartida, separeu-les per veure els matisos que les diferencien.
b) Totes les famílies tipogràfiques són gràficament diferents i evoquen sensacions diferents. Escolliu una tipografia per a la paraula. Canvieu de paraula amb un clic sobre ella.
El text és la plasmació gràfica d'un llenguatge verbal.
En conseqüència, transmet informació com a signe però també com a gràfic. Tenir en compte les propietats gràfiques de la tipografia i usar-les com a vehicle d'expressió no ha d'estar necessàriament renyit amb la llegibilitat i l'amenitat de lectura. Però fins i tot per a qui vulgui traspassar les fronteres de la llegibilitat, experimentant amb les formes, les tipografies són interessants.
Plensa: tipografia a la pràctica artística
Molts creadors han experimentat amb l'ús dels caràcters tipogràfics amb finalitats artístiques, usant-los com a formes, no com a comunicació verbal. Són gràfics, són contorns, línies, rectes, corbes, buits, farcits..., però a més, pel seu reconeixement cultural, estan dotats d'una gran força expressiva.
L'obra de Jaume Plensa és un exemple interessant de la incorporació dels caràcters tipogràfics en la pràctica artística.
Jaume Plensa (2005). Instal·lació Songs and Shadows. London: Albion Gallery.De wetwebwork, CC Reconeixement-Compartir amb la mateixa llicència 2.0 Genèrica.
Jaume Plensa (2005). Instal·lació Songs and Shadows. London: Albion Gallery.
De wetwebwork, CC Reconeixement-Compartir amb la mateixa llicència 2.0 Genèrica.
Jaume Plensa (2009). Instal·lació Songs and Shadows. Praga: WE, Transparency 2009 project.Foto d'Arenamontanus a Flickr. CC Reconeixement 2.0 Genèrica.
Jaume Plensa (2009). Instal·lació Songs and Shadows. Praga: WE, Transparency 2009 project.
Foto d'Arenamontanus a Flickr. CC Reconeixement 2.0 Genèrica.
En molts casos es poden aconseguir efectes altament expressius prescindint de qualsevol element visual que no sigui tipogràfic.

3.13.Tipografia digital

La tipografia digital ha facilitat una disponibilitat i un control sobre la tipografia sense precedents. Això permet desplegar un gran potencial creatiu, però també ha obert, com diuen els tipògrafs d'ofici, la capsa de Pandora de la disciplina. La possibilitat d'ajustar qualsevol paràmetre permet variar propietats i paràmetres tipogràfics sense tenir en compte les seves relacions i sense fer atenció als efectes que els ajusts puguin produir.
Les fonts digitals són arxius que s'incorporen al sistema operatiu i que contenen informació per a mostrar la tipografia en pantalla i per a la seva impressió.
En productes impresos cal assegurar-se que el servei que filma els fotolits per a la impremta té les fonts que s'han usat en el document.
En productes per a suport digital cal tenir en compte que no tots els ordinadors tenen les mateixes tipografies. Alguns programes d'autor, com el Flash, permeten convertir els textos en imatges (traçats vectorials o imatges de mapa de bits) abans de compilar l'interactiu en un arxiu autoexecutable. Això serà possible mentre no hàgim de fer modificacions en el text durant la seva execució. També hi ha programes que permeten incrustar la font tipogràfica en el document.
En HTML (el llenguatge de descripció de les pàgines web) és possible crear una cascada de possibilitats tipogràfiques del tipus: "si el sistema té aquesta font, mostra el text amb ella, si no, mostra-la amb tal altra, si no...". Els editors de pàgines web, com el Dreamweaver o KompoZer, ja creen aquest procediment automàticament.
En tot cas, convé tenir en compte quines són les tipografies més comunes que ja van incorporades en els sistemes operatius o en les aplicacions més difoses.

Bibliografia

Bibliografia bàsica
Ambroise, G.; Harris, P. (2007). Fundamentos en la tipografía. Barcelona: Parramon.
Blackwell, L. (1998). Tipografía del siglo XX. Barcelona: Gustavo Gili.
Dabner, D. (2008). Diseño Gráfico. Fundamentos y prácticas. Barcelona: Editorial Blume.
Gerritsen, F. (1976). Color. Apariencia óptica, medio de expresión artística y fenómeno físico. Barcelona: Editorial Blume.
Jardí, E. (2007). 22 cosas que nunca debes hacer con las letras / 21 consejos sobre tipografía. Barcelona: Actar.
Bibliografia recomanada
General
Albers, J. (2010). Interacción del color (edició revisada i ampliada). Madrid: Alianza.
Diversos autors (2010). Desarrollo de un proyecto gráfico. Barcelona: Index Book.
Frutiger, A. (2007). Reflexiones sobre signos y caracteres. Barcelona: Gustavo Gili.
Sausmarez, M. de (1998). Diseño básico. Dinámica de la forma visual en las artes plásticas (ed. original 1973). Barcelona: Gustavo Gili.
Simons, J. (2007). Manual del diseñador. Barcelona: Index Books.
Swann, A. (1990). Bases del diseño gráfico. Barcelona: Gustavo Gili.
Wong, W. (1998). Fundamentos del diseño. Barcelona: Gustavo Gili.
Forma i composició
Dabner, D. (2008). Diseño, maquetación y composición. Comprensión y aplicación. Barcelona: Editorial Blume.
Dondis, D. (1998). La sintaxis de la imagen. Introducción al alfabeto visual (ed. original 1973). Barcelona: Gustavo Gili.
Color
Ball, P. (2003). La invención del color (ed. original 2001). Madrid: Turner Publicaciones / Fondo de Cultura Económica.
Gage, J. (1997). Color y cultura. La práctica y el significado del color de la Antigüedad a la abstracción (ed. original 1993). Madrid: Siruela.
Heller, E. (2009). Psicología del color. Cómo actúan los colores sobre los sentimientos y la razón. Barcelona: Gustavo Gili.
Itten, J. (2002). Arte del color. Mèxic: Limusa / Noriega Editores.
Küppers, H. (1973). Color. Origen, metodología, sistematización, aplicación. Caracas: Lectura.
Küppers, H. (1980). Fundamento de la teoría de los colores. Barcelona: Gustavo Gili.
Pastoureau, M.; Simonnet, D. (2006). Breve historia de los colores (ed. original 2006). Barcelona: Ediciones Paidós Ibérica.
Wittgenstein, L. (1996). Al voltant del color. València: Universitat de València.
Tipografia
Elam, K. (2006). Sistemas reticulares. Principios para organizar la tipografía. Barcelona: Gustavo Gili.
Frutiger, A. (2002). En torno a la tipografía. Barcelona: Gustavo Gili.
Jury, D. (2007). ¿Qué es la tipografía? Barcelona: Gustavo Gili.
Kane, J. (2005). Manual de tipografía. Barcelona: Gustavo Gili.
Martin Montesinos, J. L.; Mas, M. (2001). Manual de tipografía del plomo a la era digital. València: Campgrafic.
Perfect, C. (1994). Guía completa de la tipografía. Manual práctico para el diseño tipográfico (ed. original 1992). Barcelona: Editorial Blume.
Pujol, J.; Solà, J. (1995). Ortotipografia. Manual de l'autor, l'autoeditor i el dissenyador gràfic. Barcelona: Columna Editorial.
Referències
Blackwell, L. (1998). Tipografía del siglo XX. Barcelona: Gustavo Gili.
Perfect, C. (1992). Guía completa de la tipografía. Barcelona: Editorial Blume.
Pujol, J.; Solà, J. (1995). Ortotipografia. Manual de l'autor, l'autoeditor i el dissenyador gràfic. Barcelona: Columna Editorial.
Rastros del alfabeto: escritura y arte (1998). Barcelona: Fundació "la Caixa".
Vita, J. P. (2005). "Los primeros sistemas alfabéticos de escritura". A: Gregorio Carrasco Serrano; Juan C. Oliva Monpean (coordinadors). Escrituras y lenguas del Mediterráneo en la antigüedad (pàg. 33-79). Conca: Universidad de Castilla - La Mancha" [disponible en línia]. <http://hdl.handle.net/10261/13218>