¿Qué tipología debemos usar?

¿Qué tipología debemos usar?

Esta tarde nos hacía un cliente esta gran pregunta… sin una respuesta única.

Compartimos aquí nuestra respuesta por si pudiera serviros de ayuda.

Las tipografías han sido siempre importantísimas para los departamentos de marketing y publicidad de las empresas… pero olvidadísimas por los programadores.

Por suerte hoy en día se está llegando a un equilibrio y podemos usar fuentes que se ven bien en cualquier tipo de pantalla y resolución… o sea, legibles igual de bien en una pantalla de 24″, en un iPad o en una birria de Blackberry.

Nota del autor: sí, aparentemente todavía hay gente que los usa… flipante, verdad?

Google Fonts... nuestras favoritas!

Google Fonts… nuestras favoritas!

Volviendo al tema, lo fetén hoy en día es tirar de Google Fonts ya que disponemos de una gran variedad de tipologías expresamente diseñadas para su uso en webs, además nos aseguraremos que no nos echaremos en falta a nuestra querida Ñ ni otros caracteres como la Ç o el €, pero además podremos usarlas directamente desde su nube con lo que evitamos (o por lo menos minimizamos) el impacto que supone la carga de tipologías “pesadas”. Ojito por que ese ha sido siempre uno de los puntos negros en el uso de tipologías externas. De hecho, Google Fonts te calcula al instante el peso total de las fuentes que vas eligiendo, lo que supone una gran ayuda para los diseñadores.

Al final el equilibrio lo encontramos restringiendo el uso de fuentes “pijas” a títulos y subtítulos… y usando para las fuentes restantes (las de los textos de nuestros artículso en general) alguna de las “fuentes básicas”.
Por “básicas” me refiero a las que todos tenemos en nuestro ordenador y por tanto no darán error de carga ni ralentizan la web (ya que el navegador las pilla de tu ordenador).
O sea, dentro de las “sans serif” (sin “colitas”): Arial, helvetica, tahoma, verdana…
Y entre las “serif“: Times New Roman, Georgia, Garamond…

Para ir acabando, el resultado será un CSS (Cascade Style Sheet, hoja de estilo en cascada) que hará una llamada a Google para pillar una fuente “molona” para los titulares junto con llamadas a fuentes “normalitas” para el resto de la web.

Ejemplo, esta web que hemos lanzado recientemente: http://defensacooperativa.com/
en la que importamos la tipología Bree Serif en los títulos y en el resto Helvetica.

¿Cuál es tu método?
¿Y tu fuente favorita?

Proceso creativo: cual es el tuyo?

Proceso creativo: cual es el tuyo?

Walt DisneyHace unos años me entrevisté para un trabajo en una empresa internacional afincada temporalmente en Valencia.
En realidad fueron 3 entrevistas: primero con un finlandés que era el responsable del área de internet y que iba a ser mi jefe directo, después con una holandesa que era la directora de Marketing y por último con un suizo-alemán de casi 2 metros, cabeza afeitada al cero y más de cien kilos en canal, que por entonces era el “general manager” de la empresa. (más…)

Colores … hay tantos como opiniones

… O era al revés?

El caso es que los colores y sobre todo la correcta combinación de estos en un sitio web contribuyen a facilitar la navegación y la lectura de nuestro contenido.

Su importancia es considerable en un medio como la Web, que es fundamentalmente gráfico.

Por ello proponemos a continuación algunos enlaces a webs que nos facilitarán la tarea de escoger una completa y correcta paleta de colores.

Color Combos

El concepto es bastante sencillo.

A tavés de su Colors Library, Color Scheme y Colors Tester puedes elegir entre una gran variedad de sencillas paletas de colores y hacer los cambios que quieras probando diferentes tonalidades.

Colour Lovers

Es bastante más completo que el anterior ya que te permite elegir entre los centenares de paletas generadas por sus usuarios registrados así como una infinidad de “patterns“.

En ambos casos es necesario registrarse para descargarlos y disponer de un programa de diseño gráfico profesional para usarlos como Adobe Photoshop o el gratuito GIMP.

Color Palette Generator

Supongamos que tienes una fotografía que quieres que sea el motivo central del diseño de tu web.

Dich ode otra manera: quieres usar los colores principales de dicha foto para crear el “look” de tu sitio.

No tienes más que subirla a tu servidor, introducir la URL (o dirección web donde esté alojada) aquí y esta web se encarga de facilitarte una completa paleta de colores sacados de tu imagen.

De hecho ofrecen 2 versiones, una con colores más pálidos y otra con los tonos más saturados.

Color Hunter

La idea es prácticamente idéntica a la anterior pero en este caso permiten subir la imagen directamente a su web (lo que puede ser muy útil si todavía no disponemos de hospedaje web).

Color Blender

Aquí puedes indicar uno o varios colores concretos y el sistema te recomienda una paleta completa basada en tu elección.

Puedes descargarte tu selección en formato ACT para Photoshop o EPS para Illustrator.

Algunos referentes de diseño web fundamentales

Inspiración artística y consejos técnicos.

Posiblemente son las dos cosas que más buscamos los diseñadores de webs cuando navegamos por la red.

Estos son algunos de los lugares preferidos por nosotros.

Sitios web de donde obtenemos información técnica, inspiración gráfica y consejos de usabilidad para utlizar después en los proyectos de nuestros clientes. (más…)