Tipografía

Sé que este trabajo lleva dando vueltas un buen tiempo pero se me había olvidado colgarlo. De hecho tenía pensado traducirlo pero se me pasa el arroz y no avanzo en absoluto. Menos mal que lo he vuelto a ver en Quintatinta y lo he recordado.

¿Que todavía no sabes de qué va? Clic aquí abajo ya!

So you need a typeface? [en]

La pregunta más común que tengo acerca de ser un diseñador de tipos es esta: “¿qué no ya hay suficientes tipografías?” La mejor respuesta que he escuchado es: “Sabes, ¡es lo mismo con la gente!” Es bastante divertida, pero probablemente viene con un poquito de rudeza, especialmente con la gente que acabas de conocer. Por mucho tiempo, la mejor respuesta que se me ocurría era más diplomática, aunque menos explícita “Oh bueno, tú sabes jaja” y entonces intentaría cambiar el tema “¿qué no ya hay suficientes tipografías?” no es una mala pregunta, hay muchas tipografías. Hasta para un diseñador, pudiera parecerle que todo ya se ha hecho.

Merece mucho la pena leerlo entero. Buscad un hueco :)

¿Necesitamos más fuentes?

A estas alturas nos sonará a muchos (al menos un poco) Typekit, ese sistema que nos permite usar fuentes “no estándar” en nuestros proyectos web.

Hoy me he encontrado por pura casualidad con Web fonts que parece ser si no me equivoco un sistema similar. No se usa Flash como sIFR ni canvas como Cufon sino que emplea @font-face. Si os interesa este tiempo de opción, siempre es bueno saber que hay más alternativas.

Aprovechad la visita para trastear con cositas como Dancewriter o History Mixer dentro de la sección Utilities.

:: Typotheque web fonts [en] ::

De Test tipográficos tenemos algunos ejemplos: Shoot the font es el primero que recuerdo. Todo sea por ver cómo andamos de conocimientos y ojo con las letritas.

The Font Game es lo mismo, pero adaptado para usuarios de iPhone/iTouch. Y no es que tenga muchos conocidos con iPhone pero en todos se cumple lo mismo: tienen jueguitos a montones. Éste no debería faltar :D

:: The Font Game for Iphone [en] ::

Hay que tener paciencia para hacer esto! Ya sabéis, a Oriol Fernández, Urikane, le sobra :)

:: iPhone Font ::

PD: De regalo un “remember”: 22 of the World’s Most Creative Alphabets

Creo que nunca ha estado tan revuelto el tema tipografíco en la web. Y es normal. Si avanzamos tanto en otros aspectos no es posible que dejemos olvidado el tratamiento tipográfico del navegador. No podemos seguir limitándonos a esas fuentes estándar por siempre.

Para ello se han ido creando diferentes técnicas que han ido evolucionando en capacidad y uso en mayor o menor medida. Tenemos sIFR, Cufon y Typekit, se empezó a integrar el soporte correcto de @font-face y el uso de fuentes en formato Open Type…

El otro día hablaba Andreu Balius en su recientemente estrenado blog sobre este tema precisamente. Y me descubrió el formato WOFF, algo en lo que se está trabajando y parece tener detrás el apoyo de Mozilla.

No tiene pinta de ser nada revolucionario, “simplemente” un encapsulado tipográfico que permite incrustar metadatos y de esta manera poder “rastrear” mejor el uso de la misma o servir de información para el usuario. No sé en qué acabará la cosa pero o empezamos a ponernos de acuerdo o el circo va a ser cada vez más divertido.

:: Tipografía en pantalla: hacia una solución definitiva ::

Si ya estás ducho en la materia del diseño web, esto te va a sonar mucho. Pero si eres nuevo uno de los mejores consejos que te pueden dar a la hora de establecer un diseño correcto es que le prestes atención al texto. Y no me refiero sólo a una buena selección de fuentes.

Por ejemplo tenemos Baseline para juguetear un poco. Incluso puedes recurrir a Typetester para comprobar cómo se ven esas fuentes “estándar” del sistema.

Pero este artículo que enlazo a continuación es bastante completito y desarrolla una serie de puntos importantes a tener en cuenta para una correcta maquetación de texto en web. Incluso me ha descubierto lo del Hyphenator.js que no conocía y tendré que probar en algún momento :)

Lo dicho, lectura recomendada.

:: Type Tips, consejos para la tipografía en web :: (Vía Nudonation)

Me gustaría hacer de este post algo más introspectivo. No alzar la vista fuera sino quedarme con “lo de dentro”. ¿Por qué sugeriros the 30 most awesome typos you can use to be a perfect designer and a handsome boy cuando en realidad no existe algo como tal? Prefiero contaros cuáles son las que yo vengo usando porque el tiempo me ha demostrado que funcionan bien. Son sólo una pequeña muestra pero creo que es la más representativa. Sobra decir que porque las use yo, no quiere decir que sean mejores o peores, además siempre habrá proyectos que requieran usar otro estilo totalmente diferente. Pero siempre agradezco cuando me cuentan este tipo de cosas y he pensado en hacer lo mismo.

Por tanto quiero dar paso a las protagonistas que aparecen listadas bajo un criterio totalmente aleatorio (según me voy acordando). No sé cuantás serán pero seguro que no pasan de 10-12. Por cierto, en un principio iba a separarlas en dos categorías: web e impresión. Pero con cositas que ya conocemos no creo que haga falta discernir entre fuentes seguras y las que no lo son.

(more…)

El test chorra del día para despedir la semana. Si sigo así esto va a parecer Facebook xD. Me ha salido la Bifur [en] aunque realmente yo me siento mucho más identificado con ésta [en]. Y tú, qué tipografía eres?

:: What type are you? [en] ::

PD: La contraseña es character

¿Qué relación puede existir entre la tipografía y el graffiti? Jeky anota:

Hay una gran relación entre ambos, por lo menos en el proceso de creación y en el interés por elementos afines como puede ser la coherencia compositiva para que todo quede homogéneo.

Quizá tenga razón, yo al menos comparto su punto de vista. El caso es que muchos graffiteros se meten a este mundillo y terminan como diseñadores todoterreno. ¿Hay alguno en la sala? Mientras tanto habrá que permanecer atentos a los descubrimientos typograffiteros del compañero arriba mencionado.

Leo en la Iguana Ilustrada que el Ministerio de Industria, Turismo y Comercio creó en su momento un Flash para presentar el proyecto de Ibarra Real. Esta tipografía, que pretende ser la tipografía de referencia española, ha sido desarrollada a partir de la que diseñó Francisco Javier de Santiago Palomares, obtenida “según muestras de punzones de Gerónimo Gil fundidos para el Quijote de la Academia que fue impreso por Joaquín Ibarra en 1780.”

Además de la tipografía, según Wikipedia, las viñetas fueron diseñadas por: Manuel Álvarez Junco, Andreu Balius Planelles, Dídac Ballester, Paco Bascuñán, José María Cerezo, Alberto Corazón, Oyer Corazón, Pablo Cosgaya, Rubén Fontana, Javier García del Olmo, José Gil-Nogués Villén, Pepe Gimeno, Fernando Guitérrez, Juan Martínez, Laura Meseguer, Juan Antonio Moreno, Juan Nava, Miguel Ochando, Josep Patau Bellart, Alejandro Paul, Marc Salinas, Emilio Torné, Alex Trochut y Roberto Turégano Moratalla.

Al parecer hay incluso un convenio para que Microsoft la incluya en sus productos. Aunque aún no está disponible la versión oficial si hay algunas referencias anteriores

::Proyecto Ibarra Real:: Via Iguana Ilustrada

La curiosidad del día. No sé si recordaréis el Spell with Flickr [en]. Ponías una palabra, le dabas a buscar y ale…te aparecía tu conjunto de letras en un bonito combinado de fotografías alojadas en Flickr.

Pues ahora lo mismo…pero con GoogleMaps. Pon tu palabra y luego haz clic sobre el PHP generado. Et voilá!

Me traigo de g:lou este curioso link que muchos verán como algo similar a las batallas que se montaban en Layer Tennis [en] o cualquier evento similar. En este caso todo gira en torno a la tipografía. Se da un tema y listo! A ver qué sale de los participantes.

Para pasar un rato entretenido.

:: Type Battles [en] ::

Si hay una campaña online que realmente me pareció simpaticona fue la de Extensis [en] y su Max Kerning.

Amanda me ha escrito para comentarme que han colgado algunos nuevos spots [youtube] en los que Max hace acto de presencia para anunciar que Suitecase Fusion 2 [en] ya está disponible para plataformas Windows.

Los anuncios no es que sean la repanocha pero me alegro de enterarme que Windows cuenta con una opción más a la hora de gestionar fuentes. Y es que yo sigo anclado al AMP todavía :S

No negaré que me ha llegado más de un correo lo largo de todo este tiempo indicándome que se hacía un poco incómodo el uso de Flash en los titulares. Siempre respondía que era algo que sabía y que esperaba solucionar antes o después. Pues ale, manos a la obra.

Hasta la fecha yo venía usando sIFR [en] en el blog para dicha tarea y también para el portfolio (pero implementado con jQuery en este caso) Me parecía un punto importante mantener unos titulares y encabezados decentes aunque presentara ciertos problemas de uso como la escalabilidad del tamaño de letra (no era del todo correcto), la imposibilidad de hacer un efecto hover en condiciones (en las últimas versiones creo que ha mejorado) y, la más importante, que era una lata para copiar la url a la que se enlazaba o incluso a hacer clic sobre los titulares. Pero bueno, en este caso me tragué lo de “la forma sigue a la función” y dí preferencia a lo visual. Hasta ahora.

(more…)

Quizá uno de los elementos web a nivel de diseño en los que más se está pretendiendo avanzar es la fuente tipográfica. Actualmente nos vemos cuasi-limitados al uso de un puñado de ellas (Typetester [en] es un buen punto de partida para verlo) si queremos evitar problemas a menos que empleemos técnicas de reemplazo como sIFR [en] o Cufón [en] por citar un par. Esto amplia el abanico tipográfico enormemente y con ello también el debate de hacia dónde va la tipografía en la web [en].

Typekit pretende ofrecer una solución alternativa que deje agusto a todos: diseñadores, usuarios y creadores de tipografías mediante la gestión (alquiler mejor dicho) de fuentes para su uso en Internet. Una especie de licencia de uso only for web. Y funciona bastante bien [en].

De momento Typekit no está abierta al público y es cuestión de probar suerte para ver si mandan invitación y si termina por convertirse en una opción viable.

:: Typekit [en] ::

Como el otro día hablaba de una ayuda para buscar tipografías quizá te haya picado el gusanillo por saber más sobre las mismas.

Puedes pasarte por Typedia que pretender servirnos de ayuda para conocer todo lo que hay detrás de la creación de estas letritas. Año de creación, autores, un poco de historia… Actualmente rondan las 300 tipografías y más de 1000 usuarios registrados por lo que no empiezan nada mal.

Os dejo además un post del gran Jason Santa María [en] en el que comenta un poco el proceso de creación de la web.

:: Typedia [en] + Introducing Typedia [en] ::

Lo he visto en Swissmiss [en] y me lo he tenido que traer. Porque aunque tampoco he probado muchos frameworks CSS sí que me da a mí en la nariz que no se tiene especial atención en el aspecto tipográfico. Y no me refiero sólo a los tamaños sino más bien a los espaciados e interespaciados.

Porque un párrafo de texto puede pasar de ser un ladrillo infumable a algo comprensible y agradable con tan sólo modificar el line-height. Y parece que Baseline está preparado para lidiar con ello.

:: Baseline [en] ::

Mientras trasteaba un poco por la web de Adobe, me he encontrado con una nueva herramienta que no me suena pero que seguro lleva disponible mucho tiempo. Se trata de Font Finder, un asistente online que te ayuda a seleccionar el mejor estilo de tipografía en función de las opciones que marques.

Ya sea para un packaging o logotipo, si el estilo va a ser más estricto o liviano… hay un montón de opciones para configurar. Lo suyo es echarle un vistazo un par de veces y ver si os merece la pena usarlo. Eso sí, siempre muestra resultados de tipografías comerciales. Para los que busquéis otro tipo de soluciones, siempre estará a mano la gran Font Squirrel [en] o el más modernuqui Fontplore :D

:: Adobe Font Finder [en] ::

font-face es una propiedad CSS que permite definir una tipografía alojada en una URL de nuestra elección y así conseguir que nuestras webs se vean tal y como queremos, independientemente de si en nuestro sistema tuviéramos instalada la fuente o no. Aunque actualmente no está soportada por el amplio espectro de navegadores disponibles, se va avanzando en el asunto.

Debido a ello empiezan a surgir preguntas relativas al “libre albedrío” con el que empezarán a moverse fuentes de un lado para otro sin saber realmente si su licencia de uso lo permite. Por ello, The League of Movable Type nace con la idea de servir de nexo de unión para todos aquellos interesados en el desarrollo y distribución de tipografías open source. Ya tienen un par de ejemplos que podemos usar y con los que no tendremos que preocuparnos de estos temas.

:: The League of Moveable Type [en] :: (Vía Ventilate [en])