Archivo etiqueta tipografías
Anonymous Pro, nueva tipografía para programadores
Leo en Barrapunto acerca de una nueva tipografía creada por Mark Simonson, conocido tipógrafo en su mundillo, quien ya había publicado hace años una tipografía monoespaciada para programadores llamada Anonymous. Ahora la ha mejorado y sobre todo ha ajustado el tamaño de letra con respecto al tamaño de cada fuente tipográfica. El nuevo diseño está disponible en un formato TrueType niversal (válido para Windows, Linux y MacOS) bajo el nombre de Anonymous Pro y con Open Font License. La verdad es que me gustó mucho y la voy a usar un tiempo. Es mucho más clara y legible que la Inconsolata, aunque todavía no consigo una que remplace finalmente a la que vengo usando hace más de 7 años, la clásica y nunca mencionada Fixedsys de Windows.
COLECCIONES DE LINKS (Agosto 2010 #1)
Por Marcelo - CSS, Datos Utiles, Diseño, HTML, Javascript, jQuery, Programación - 16/08/2010
Compilé esta colección de links que acabo de chequear y agregar a mis marcadores, y vos también deberías….
RECURSOS CSS
COLECCIONES TIPOGRAFIA (Julio 2010 #1)
Por Marcelo - Datos Utiles, Diseño, Internet, Links - 18/07/2010
Colección de links a las publicaciones de este mes acerca de tipografías gratuitas de excelente calidad. Bajátelas todas:
Encontrar la fuente que aparece en una imagen con Identify Fonts
Links de miércoles. Para el bolsillo del diseñador y del programador web
Por Marcelo - CSS, Datos Utiles, Diseño, Internet, jQuery, Programación, Wordpress - 09/09/2009
Veamos si me sale bien, y todos los miércoles logro emitir una buena colección de links interesantes para la gente del palo.
Son los links a posts más representativos de la semana, utilísimos para diseñadores y programadores. Un MUST que como mínimo, tienen que leer para mejorar sus conocimientos:
- Una colección de links a excelentes sitios de stock photo gratuitos: 25+ Excellent Free Stock Photo Sites for Designers
- Necesitás un software para editar CSS? acá seguro encontrás: 14 Useful CSS Editors for Web Developers and Designers
- 38 jQuery And CSS Drop Down Multi Level Menu Solutions
- Trucos CSS para salvarnos las papas en distintas situaciones: 15 CSS Tricks That Must be Learned
- 36 High-Quality Latest Free Fonts To Enhance Your Designs
- Un verdadero MUST! 300+ Jquery, CSS, MooTools and JS navigation menus
- 50 Useful New jQuery Techniques and Tutorial
- Colección de formularios de contacto bastante creativos: 91 Trendy Contact And Web Forms For Creative Inspiration
- 20 MySQL Admin and Development Tools and cheat sheets
Y para WordPress:
Llega Typedia, una verdadera enciclopedia online de tipografía

Typedia es una nueva comunidad online para clasificar tipografías y educar al público acerca de ellas. Editada al mejor estilo Wikipedia, pero sólo para estilos de letras. Cualquiera puede unirse, aportar y editar contenidos acerca de distintas tipos, o de la gente responsable de las mismas (sus diseñadores).
Visto en Swiss Miss
Tabla interactiva de caracteres Unicode
Por Marcelo - Datos Utiles, Diseño, HTML, Programación - 24/08/2009
Nunca se sabe cuándo vas a necesitar el código de una doble flecha a la izquierda o una cuádruple integral, así que conviene tener esta Tabla Unicode interactiva siempre a mano. Se puede navegar cómodamente por los simbolitos y luego ver sus equivalencias HTML.
Visto en: Microsiervos
Inserta cualquier tipografía en tu sitio web usando @font-face
Leo en CSSBlog un interesante artículo sobre cómo usar el elemento @font-face para incrustar y usar cualquier tipografía en tu sitio web.
@font-face es una propiedad muy útil para definir en un sitio web una o más fuentes que el usuario no tenga instalada en su PC. Sólo es necesario subir la fuente a nuestro sitio web y definirla via CSS.
Para el tipo de fuente, puede usarse una en formato OpenType (.otf) o bien en formato Truetype (.ttf). Vemos un ejemplo si quisiéramos usar la tipografía gratuita Myndraine en los titulares H1:
@font-face {
font-family: "Myndraine";
src: url(http://www.fontex.org/download/Myndraine.otf) format("truetype");
}
h1 {
font-family: "Myndraine", Verdana, sans-serif;
}
Y eso es todo. @font-face está soportada por Internet Explorer 7+, Firefox 3.5+ y Safari 3+ .
Via: CSSBlog
Tipografías standard y cómo usarlas en HTML
Muchas veces una tipografía dada nos puede parecer muy bonita, pero a la hora de usarla en el sitio web que estamos armando nos pueden terminar decepcionando. Y es porque se ven distinto según el sistema operativo que usemos. Para evitar esto hay que saber cuales son las tipografías estándares, y sus equivalentes en distintos sistemas operativos.
En la siguiente imagen se pueden ver los equivalentes entre Windows Vista, Windows anteriores y MacOS.
Y a continuación repasamos el código CSS de las tipografías estándares:


