internet, desarrollo, diseño web, sysadmin

Ayer monté en metro y vi la nueva versión, la de 2008, del plano del metro de Madrid. Por fin aparece el tiempo que se tarda en los trasbordos largos. A mí me gusta mucho el diseño. Existen por ahí planos con el diseño antiguo y las nuevas ampliaciones, pero me parecen más complicados de leer.

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.

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

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.

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.

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