Mapas del mundo vectorizados

desarrollo, diseño web 0 comentarios »

En La Cartoteca encuentro una colección del mapas de mundo vectorizados que puede resultar muy útil. Son “free”, aunque no he investigado si libres o gratis.

vector world map


Listado de tipografías más populares

diseño web 2 comentarios »

En Kabytes encuentro la siguiente lista con las tipografías instaladas por defecto en los sistemas operativos más populares. El estudio lo ha realizado Fon Tester. Creo que es bueno tenerla a mano para, en nuestros desarrollos web, no salirnos de ella.

font-family: Arial, Helvetica, sans-serif
font-family: 'Arial Black', Gadget, sans-serif
font-family: 'Bookman Old Style', serif
font-family: 'Comic Sans MS', cursive
font-family: Courier, monospace
font-family: 'Courier New', Courier, monospace
font-family: Garamond, serif
font-family: Georgia, serif
font-family: Impact, Charcoal, sans-serif
font-family: 'Lucida Console', Monaco, monospace
font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif
font-family: 'MS Sans Serif', Geneva, sans-serif
font-family: 'MS Serif', 'New York', sans-serif
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif
font-family: Symbol, sans-serif
font-family: Tahoma, Geneva, sans-serif
font-family: 'Times New Roman', Times, serif
font-family: 'Trebuchet MS', Helvetica, sans-serif
font-family: Verdana, Geneva, sans-serif
font-family: Webdings, sans-serif
font-family: Wingdings, 'Zapf Dingbats', sans-serif

Cajas con esquinas redondeadas

diseño web 0 comentarios »

Esperemos que algún día CSS3 sea implementado por todos los browsers. Mientras llega ese anhelado momento, diseñar una caja con esquinas redondeadas utilizando sólamente XHTML y CSS es muy simple gracias a webs como RoundedCornr.

esquinas redondeadas

En RoundedCornr podemos crear:

  • Cajas con esquinas redondeadas simples.
  • Cajas con esquinas redondeadas con borde.
  • Cajas con esquinas redondeadas con gradiente.
  • Imágenes con esquinas redondeadas (tabs de navegación, botones).

Si rellenamos el formulario con los datos deseados podemos obtener al instante el código XHTML, el código CSS y los PNG necesarios. Así de simple.


Patrones de colores en rectángulos con borde

diseño web 0 comentarios »

He de reconocer que a veces me pongo la gorra de diseñador web sin tener conocimientos formales de teoría del color. Utilizo la intuición para intentar escoger esquemas de color visualmente agradables.

Un elemento que se repite en el diseño web son las cajas rectangulares con borde. Con el tiempo he ido recopilando una lista de combinaciones “color del fondo / color del borde” que me gustan y suelo utilizar. Aquí os la dejo. Es el fruto de numerosas pruebas. No hay nada científico en dichas combinaciones. Simplemente me gustan.

La lectura es #color del fondo / #color del borde.

#f9f9f9 / #c0c0c0

#ededed / #9999cc

#bfcfff / #9191ff

#83b4d8 / #448abd

#e6ff80 / #acbf60

#ccff33 / #8fb300

#ffe5f2 / #ff99cc

#ffe5f2 / #ff3300

#ffbfef / #cc0099

#fff9d8 / #ffe8cd

#ffffbb / #e6ac73

#ffffbb / #ffa500


Fawnt: fuentes gratuitas de calidad

diseño web 0 comentarios »

En internet existen numerosos sitios que recopilan fuentes. Algunos de ellos anuncian literalmente miles de fuentes. Pero, ¿cuánto tiempo tienes que emplear para escoger entre miles de fuentes? Y, ¿cuántas veces, cuando encuentras una fuente que te gusta, resulta que acaba siendo de pago?

fawnt

Fawnt, según la descripción de la propia web, recopila fuentes gratis de gran calidad para diseñadores y desarrolladores. Me encanta Fawnt por las siguientes razones:

  • Actualmente sólo tiene 55 fuentes, pero efectivamente todas ellas son de una gran calidad. Como dice el refrán, las recopilaciones, si breves, dos veces buenas.
  • Las fuentes son gratis.
  • Muchas de ellas tienen una estética muy “web 2.0″.