Archivo etiqueta tipografías
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
Seguramente en más de una ocasión debes haber visto una tipografía en una imagen y haber dicho “¡Esa es la que quiero usar!”. Pero a menos que seas un experto consumado, saber exactamente cual es no es algo que todos podamos lograr. Pero con Identify Fonts las cosas pueden resultar más fáciles.
Links de miércoles. Para el bolsillo del diseñador y del programador web
Por Marcelo - CSS, Datos Utiles, Diseño, Internet, Programación, Wordpress, jQuery - 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:
Suscripción Gratuita!
