como hacer una tipografia

40
1

Upload: annygabrielle

Post on 24-Oct-2015

28 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Como Hacer Una Tipografia

1

Page 2: Como Hacer Una Tipografia

2

Terminologia

Durante el proceso de diseño de una tipografía la comunicación es mucho más sencilla si utilizamos los mismos término para definir las distintas partes del tipo.Aquí se muestran los básicos para conse-guir que la conversación sea un poco más profunda que, por ejemplo, “si… esto es, esta pequeña cosa negra”. Estos términos son comúnmente aceptados por los diseñadores de tipos, aunque dependiendo del país o de sus tradiciones en el campo de la im-prenta algunos pueden variar o tener más de una denominación.medio (altura x), o las que nos fijan los límites superior e inferior. Fig 1

Cuidado con el tamaño

Para alinear ópticamente todos los caracteres de una línea, estos no deben de tener la misma altura matemática. Por ejemplo, el triángulo de este dibujo debe de ser más alto que el rectángulo ya que si este no es el caso e igualamos sus tamaños, al alinearlos el triángulo se verá más pequeño. Fig 2

BRAZO

ASCENDENTE

HOMBRO

ASTA

PANZA

DESCENDENTEREMATE

ALTURA X

LINEA BASE

GANCHO

CONTRAPUNZON

Fig. 2 El tamaño en el diseño de tipos es esencial tenerlo en cuenta ya que se aplica a todos los caracteres de la fuente que contengan trazos curvos (panzas u hombros) o vértices que limiten con las líneas que forman el ojo medio (altura x), o las que nos fijan los límites superior e inferior.

Fig. 1

Page 3: Como Hacer Una Tipografia

3

Fluidez de las formas

Diseñar tipos es como conducir un automóvil. Al conducir tomas las curvas de manera natural; si dibujas la curva de un carácter sobre el papel, esto debe de ser exactamente lo mismo. La curva comienza a fluir suavemente, nunca de una forma brusca; piensa que cuando conduces no tuerces las ruedas justo cuando llegas al comienzo de la cur-va sino que un poco antes de llegar a la misma te anticipas orientando suavemente el coche en la dirección correcta. Piensa que estás conduciendo cuando dibujes tu tipo. Fig 3

Espaciado

Mucho más importante que las formas de los caracteres, es el ritmo que muestran cuando se componen en palabras y en líneas. Una fuente con unos caracteres hermosamente dibujados, si están mal espaciados se hará difícil de leer; sin embargo una fuente con unas formas no tan bien diseñadas, si el espaciado es bueno su lec-tura será más cómoda. Definir el ritmo es más importante que definir las formas. Los espacios en blanco, situados dentro y alrededor de las le-tras, son los que definen el ritmo mucho más

que las propias formas negras de los caracteres; es un balance entre la forma y la contraforma. Así a la hora de dar forma al carácter debemos tener en cuenta estos espacios en blanco y en-tender su relación con la figura negra de las letras: ambas están relacionadas, por lo que si cambiamos la forma blanca este cambio afecta-rá también a la forma negra; o sea, si por ejem-plo aumentamos el espacio blanco habrá menos espacio negro y viceversa. Fig 4

INCORRECTO

¡MEJOR!

EQUILIBRA LOS ESPACIOS INTERNOS Y EXTERNOS

IGUALARLOSOPTICAMENTE

DEMASIADO ESTRECHO

DEMASIADO CERCA

Fi

ESPACIADO BÁSICO

Un comienzo

suave

es la forma natu

ral

y mas rapida

90°

Natural

Geométrico

Fig. 4 espacio contenido dentro de la letra “n” y el espacio existente entre la “i” y la “n”. En la figura superior podemos ver como el espacio contenido dentro de la letra “n”, es mucho más grande que el existente entre la “i” y la “n”. Al contrario en la figura inferior éste espacio está más igualado, y esta es la forma de que las palabras tengan un buen ritmo y una mejor armonía en las líneas de texto.

Fig. 3

Page 4: Como Hacer Una Tipografia

4

¿Qué altura-x dar a un carácter? Y ¿qué profundi-dad a sus descendentes? Definir estas proporcio-nes es esencial y están fuertemente conectadas con el propósito de la fuente. El uso que se le de a dicha fuente marcará las proporciones de sus caracteres. Por ejemplo, es imposible crear una fuente para un periódico que nos economice el espacio disponible si la misma está formada con unos caracteres excesivamente anchos.

Unos descendentes extremadamente cortos da-rán un aspecto extraño a una fuente de texto, pero para una fuente de titulares puede ser una decisión acertada. Para una fuente de texto la al-tura de los ascendentes debe de ser tan grande, o incluso mejor más grande, que la altura de las mayúsculas al objeto de proporcionar un adecua-do ajuste óptico, como se muestra en el dibujo. Fig 5

Fig. 5 Todo es posible, por supuesto. Lo importante es que todas tus decisiones sobre el dise-ño de un tipo tengan un porqué, y que sepas bien lo que haces… y también lo que no haces.

TOTALMENTE MAL!

PERFECTO!

Proporciones

Page 5: Como Hacer Una Tipografia

5

Los conceptos expresados en el punto anterior sobre el balance de las formas negras y blancas, aquí los puedes ver un poco más claros. El diseño de tipos no es nada más y nada menos que armonizar las formas negras y las blancas. El negro no puede existir sin el blanco y el blanco no puede existir sin el negro.

Negro, la forma de las letras; blanco el espacio dentro y alrededor de las mismas. La cantidad de espacio blanco dentro de un carácter define la can-tidad de blanco que existirá entre dos caracteres.Siguiendo esta idea, vemos que es imposible crear un carácter con gruesos trazos negros que tenga a la vez unos contrapunzones grandes; un tipo de estas características siempre tendrá unos contrapunzo-nes más pequeños que un tipo dibujado con unos trazos más finos.

Por consiguiente, como vemos en la ilustración, el espacio entre las letras será menor. Al contrario un tipo más fino tendrá unos contrapunzones más grandes y como el espacio que existe entre las letras debe estar en proporción, éste será mayor. Fig 6

ECHA UN VISTAZO A LOS ESPACIOS BLANCOSINTERNOS Y EXTERNOS

Fig. 6 Este punto es clave para enten-der las sutiles relaciones y los factores fundamentales que debes de tener en cuenta en el diseño de tipos; a partir del momento en que lo percibas te darás cuenta de que ves los tipos con “distin-tos ojos”. Con ojos de tipógrafo.

Negroblancoversus

Page 6: Como Hacer Una Tipografia

6

Cuando realizamos una familia tipográfica e incluimos en la misma una fuente romana y una itálica, ésta puede construirse de diferentes maneras. Posiblemente la tercera n del dibujo podría funcionar perfectamente como itálica en tú familia, pero recuerda que no siempre se tratará de una cursiva verdadera.

Una fuente romana puede estar inclinada (con un ángulo determinado) y una cursiva puede estar derecha (totalmente vertical como una romana). ¿Suena raro?

El ángulo no es el que decide si un carácter es romano o cursivo; esto depende de su cons-trucción. Para verlo un poco más claro, vamos a fijarnos en las cuatro n del dibujo. Efectiva-mente el primer carácter empezando por la iz-quierda es romano… pero el segundo también; aunque no es totalmente vertical la construc-ción es la misma que la del primer carácter y a estos tipos se les conoce como romanos inclinados. La tercera n ya nos puede parecer cursiva pero aún no estamos ante una cursiva verdadera. Básicamente no existen diferencias entre la segunda y la tercera n a excepción de la ausencia de remates en ésta última.

Ahora compara las tres primeras letras con la última. Ésta si que es una auténtica cursiva; la gran diferencia con respecto a las anteriores reside en su construcción. Las tres primeras están construidas a partir de diferentes trazos

separados y la última está construida a partir de un solo trazo. Esta es la diferencia básica entre los tipos romanos y cursivos su cons-trucción y no su ángulo de inclinación.

Respecto a la diferencia entre cursiva e itáli-ca, desde el punto de vista histórico se pue-den buscar argumentos que incidan en una probable diferencia entre ambas, aunque, de

2 TRAZOS 2 TRAZOS 2 TRAZOS 1 TRAZO

ROMANA ROMANA INCLINADA ITALICA CURSIVA

TRAZOS SEPARADOS

UN SOLOTRAZO

acuerdo con la mayoría de investigadores ti-pográficos, son términos similares. Donde si podemos establecer una gran diferencia es en el hecho de que itálica es un término que tiene que ver con su función, mientras que cursiva tiene que ver con su construcción.

RomanasItalicas

Cursivas

Page 7: Como Hacer Una Tipografia

7

¿Qué es lo que define que un carácter encaje bien con otro? Y cuando tomas una decisión sobre el diseño ¿cómo afecta al resto de los ca-racteres de la fuente?

Punto de partida: la letra e del centro del dibujo. Imagínate que has dibujado esta letra y quieres diseñar el resto de los caracteres de la fuente de

Lecturabilidad

¿El único aspecto importante de una fuente de texto es su lecturabilidad. Muchas decisiones de diseño pueden afectar a este aspecto entre las que se encuentran el contraste, la longitud de los ascendentes y descendentes, el ritmo, el color ti-pográfico que proporciona el tipo, la robustez de sus arcos y sus panzas, etc.

La mayoría de estas decisiones se aplican a todos los caracteres de la fuente, y por esto el primer paso es definirlas. Por ejemplo el contraste; los caracteres de la línea superior tienen un con-traste más acusado que los de la línea inferior. Así, los caracteres de la línea superior son más apropiados para usarse en titulares y los infe-riores para ser utilizados en texto continuo, y no solamente por la diferencia de contraste sino porque los caracteres de la línea superior son mucho más condensados. Esta característica los hace menos legibles en cuerpos pequeños, pero mucho más destacados y flexibles para titulares o rotulación. Definir el contraste y la anchura son decisiones a tener en cuenta en todos los ca-racteres individuales de la fuente, pero, además, mientras diseñas cada carácter puedes añadir de-talles que mejoren la lecturabilidad de la fuente. Por ejemplo, la oreja de la g puede ayudar a que el lector siga la línea horizontal de lectura de ma-nera más fluida. La g de la línea inferior trabaja mucho mejor en una fuente de texto en cuerpos pequeños que la de la línea superior.

forma que encajen bien con la misma. ¿Por donde empezamos? Por ejemplo ¿debe ser una fuente con remates o sin ellos?

La panza de la e no solamente es gruesa sino que muestra un gran contraste. La i de la izquierda no tienen ningún contraste; estos dos caracteres no tienen nada que ver uno con el otro. Por otro lado, la i de la izquierda tiene el mismo estilo de contras-te que la e debido a sus remates. Estos pequeños trazos son los que aseguran que el carácter tendrá partes finas y partes gruesas, como las que tiene la e. Esto da como resultado que el punto de partida que hemos creado para nuestra fuente (la letra e), ya nos ha definido que el resto de los caracteres de la fuente no pueden carecer de remate.

Primer intento: la letra “i” de la izquier-da. Una letra sin remates y cuyo asta es tan gruesa como el asta de la “e” y con el mismo ojo medio.

Segundo intento: la letra “i” de la de-recha. La letra tiene el mismo grosor y el mismo ojo medio que la “e”, y además presenta remates.

PUNTO DE PARTIDA

¿CON REMATE

O SIN REMATE?

todosUno

para

Una palabra compuesta en un cuer-po 24 es más legible que si estuviera compuesta en un cuerpo 9 pero esto no la hace más lecturable.

Page 8: Como Hacer Una Tipografia

8

Como podrás deducir por su nombre, las versali-tas son letras versales pequeñas, esto es, mayús-culas con la misma altura que las minúsculas.¿Por qué se necesitan las versalitas?

Por varias razones de índole tipográfica. La pri-mera es que, en un bloque de texto, una palabra compuesta enteramente en mayúsculas resaltará desagradablemente del resto y la segunda por-que las letras capitales de muchas fuentes no han sido diseñadas y espaciadas para trabajar juntas, sino para componerse junto con las minúsculas. Al contrario las versalitas si han sido diseñadas para trabajar juntas por lo que el resultado, den-

Cuidado con el grosor

Desde la introducción del ordenador, la posibi-lidad de diseñar tipos se ha abierto a práctica-mente todo aquel que lo desee. A su vez los pro-gramas de creación de tipografías nos permiten

ALTURA X

ALTURA X

ALTURA DE LAS MAYÚSCULAS

ALTURA DE LAS VERSALITAS

NO ESTÁN ESPACIADAS PARA TRABAJAR JUNTAS

un control total sobre todas las variaciones que queramos hacer. Pero esta abrumadora disponi-bilidad debemos manejarla con cuidado.

Por ejemplo, muchos de estos programas tienen una opción, entre otras muchas, para cambiar el peso de una tipografía normal en negra. Las lí-neas de un diseño perfecto, se expanden como por arte de magia, pero cuidado, el ordenador in-tenta engañarte. El resultado no es una autentica negra. Seguramente el cambio automático origi-nará la destrucción del contraste (la segunda a del dibujo).

PESO REGULARPESO NEGRITA

AUTOMÁTICO

PESO NEGRITA

MANUAL

SIN TENSIÓN EN LA FORMA

UNA BUENA TENCIÓNY UN MEJOR CONTRASTE

Al final lo que cuenta es tu ojo crí-tico, y si este está bien entrenado seguro que verás, en estos casos, multitud de incongruencias.

tro de un bloque de texto, proporciona un color tipográfico más homogéneo.

Aunque se ha dicho que las versalitas son mayús-culas cuya altura es la de la altura-x de la fuente, esto no es del todo cierto ya que, al objeto de que ópticamente se vean de la misma altura, las versalitas deben de ser un poco más altas que los caracteres de caja baja, como se muestra en el dibujo.

VERSALITAS

Page 9: Como Hacer Una Tipografia

9

Si haces los contrapunzones de la B exactamente iguales, el superior parecerá ópticamente mayor. Tu carácter dará la sensación de que pesa y que aplasta la parte inferior. Si haces el contrapun-zón superior un poco más pequeño que el infe-rior, tu carácter se verá mucho mas equilibrado.

El contrapunzón de la B no es exactamente igual al de la P, por ejemplo. Si quieres hacer los dos del mismo tamaño, la prosa derecha (sidebea-ring en Fontographer) de la P te quedará mu-cho más grande. Esto nos dice que, aunque deba existir una relación cercana entre los tamaños de los contrapunzones de la B y de la P, debemos ajustar la forma negra del carácter y el espacio en blanco de manera individual en cada uno de ellos. Por ejemplo, una r de caja baja: este carácter no es una n a la que hemos privado de una de sus astas (una r realizada de esta manera presentaría un aspecto marcadamente débil) por lo que de-bemos hacer una r mucho más fuerte al objeto de que su brazo acompañe a la dirección de lectura horizontal. De esta forma el espacio en blanco situado a la derecha de la r y definido por la línea base y el brazo sea más abierto y equilibrado. El hecho de que la prosa derecha sea mucho más pequeña no afectará en nada al ritmo del tipo. Como consecuencia de esto, el carácter puede estrecharse en su totalidad por lo que debere-mos actuar sobre el espacio en blanco superior

Sam aliqui blaborum rem id qui rerum faccus doloribeaque rernam, tendit aut fuga. Udae cor assinus as ex est, officiis eictistias eaque

EQUILIBRALAS FORMAS

INCORRECTO

ESPACIO EN BLANCO

Equlibriode la forma

Page 10: Como Hacer Una Tipografia

10

Olvídate del interletraje, y pasa tu tiempo ocu-pado en otras cosas. El interletraje no es algo primordial, es mucho más importante espaciar correctamente tus caracteres. En cualquier caso, el conocimiento del interletraje te proporcionará una mayor comprensión de la tipografía y algunas veces es inevitable.

Los pares de interletraje existen por razones óp-ticas. Dicho de una forma sencilla: cuando un ca-rácter está seguido por otro tú puedes definir un espacio diferente entre ellos. Este espacio puede variar a partir de un espaciado normal (la prosa derecha del primer carácter más la prosa izquier-

Ligaduras

Las ligaduras en pocos casos son algo esencial. Al-gunas de ellas, bien conocidas, son fi o fl. El hecho de que sean inevitable o no, depende del diseño general de la fuente. No todas necesitarán una li-gadura para la composición fi, ésta será necesaria solamente en los casos en los que el punto de la i interfiera con la f. Existen también razones estéti-cas para la creación de ligaduras como st. Aunque el tema de las ligaduras no sea lo más urgente que debas afrontar a la hora de diseñar una tipografía, es otro obstáculo en el camino a la perfección!

1

2

SIN INTERLETRAJE

CON INTERLETRAJE

¡MUY MAL!

¡MUCHO MEJOR!

da del segundo). La diferencia puede ser positiva o negativa; puedes añadir espacio a ciertas combi-naciones de letras y reducirlo en otras. Estos pa-res de interletraje se implementarán en la fuente como un fichero.

En algunos casos, el interletraje es inevitable y necesario. Cuando una capital A está seguida por una v de caja baja, el gran espacio en blanco que aparece entre las mismas no puede ser arreglado adaptando el espaciado de los caracteres, ya que cuando realicemos otras combinaciones con otros caracteres no funcionaría. Para esta ocasión es ne-cesario definir un par de interletraje. En este caso se trata de un par negativo ya que reducimos el espacio entre ambos caracteres, pero hay otros

Kerning

1 2 3

casos en el que será positivo y deberemos añadir espacio como por ejemplo una f de caja baja segui-da por un paréntesis f).

Page 11: Como Hacer Una Tipografia

11

Es et adissimaio. Quiat antur alis utectia de et hitias dolentia voluptatibus de volut labore nemporersped eictatqui doluptat.Est, ipsum laboriore et liquia volore sin nobisqui utem vitat ommo molo exceperio. Riasi ut laces dit, opti simpori ulpa accus, sam licium veles-sus eosam sunt moluptas acient quo omnihici ommo omnis etum a doluptinci coreris doluptus earchici audaecabore nobissimos simi, ent.Xernam autem aspella dolorepro mi, etur? Qui omniatur? Erum ad quam quation nosapiet quo vel iunt ratatem as velestrum et et pratecus.Bernatur aut et et ute sus, ipienderum ra necto-res ate sequatquae eium vendel exerit

Page 12: Como Hacer Una Tipografia

12

Page 13: Como Hacer Una Tipografia

13

Page 14: Como Hacer Una Tipografia

14

Page 15: Como Hacer Una Tipografia

15

Page 16: Como Hacer Una Tipografia

16

Page 17: Como Hacer Una Tipografia

17

Page 18: Como Hacer Una Tipografia

18

Page 19: Como Hacer Una Tipografia

19

Page 20: Como Hacer Una Tipografia

20

Page 21: Como Hacer Una Tipografia

21

Page 22: Como Hacer Una Tipografia

22

Page 23: Como Hacer Una Tipografia

23

Page 24: Como Hacer Una Tipografia

24

Page 25: Como Hacer Una Tipografia

25

Page 26: Como Hacer Una Tipografia

26

Page 27: Como Hacer Una Tipografia

27

Page 28: Como Hacer Una Tipografia

28

Page 29: Como Hacer Una Tipografia

29

Page 30: Como Hacer Una Tipografia

30

Page 31: Como Hacer Una Tipografia

31

Page 32: Como Hacer Una Tipografia

32

Page 33: Como Hacer Una Tipografia

33

Page 34: Como Hacer Una Tipografia

34

Page 35: Como Hacer Una Tipografia

35

Page 36: Como Hacer Una Tipografia

36

Page 37: Como Hacer Una Tipografia

37

Page 38: Como Hacer Una Tipografia

38

Page 39: Como Hacer Una Tipografia

39

Page 40: Como Hacer Una Tipografia

40