Ads 468x60px

Perfil

miércoles, 29 de mayo de 2013

10 Recursos para tipografĂ­as JavaScript


La librerĂ­as JavaScript de cĂłdigo abierto pueden ayudar a diseñar los desafĂ­os web (una tĂ©cnica que optimiza los diseños web para dispositivos mĂłviles), aplicar divertidos efectos de texto y mucho más. Este post, se centrará principalmente en las librerĂ­as  de JavaScript que utiliza tĂ©cnicas modernas de tipografĂ­a web para destacar y promover las prácticas actuales de mejor diseño web.

1. Modernizr

Las reglas @font-face de CSS es rápido, permite escribir HTML semántico (bueno para SEO) y es mucho más fácil de implementar en un sitio web para los diseñadores web, en comparaciĂłn con mĂ©todos anteriores. Aunque la norma ha estado disponible desde el dĂ­a de Internet Explorer 5, la aplicaciĂłn del web navegador inconsistentes  hizo @ font-face una mala opciĂłn. Este no es el caso.
La librerĂ­a JavaScript Modernizr (que no es una librerĂ­a de tipografĂ­a web) le permite detectar si las reglas y propiedades CSS como @ font-face y la sombras de texto están disponibles en el navegador web de un usuario para que pueda ofrecer a este grupo  un progresivamente experiencia de usuario mejorada.

2. Kerning.js

JavaScript-kerning
Kerning.js es una librerĂ­a JavaScript de cĂłdigo abierto que promete a los diseñadores web un completo control de la tipografĂ­a web. De acuerdo con el desarrollador del proyecto, Joshua Gross, la librerĂ­a es sin duda un “trabajo en progreso”. Sin embargo, mediante la ampliaciĂłn de CSS, no necesita programaciĂłn JS fuera de la referencia a la librerĂ­a en el cĂłdigo HTML. SĂłlo tiene que utilizar las propiedades personalizadas CSS de Kerning.js.
Con esta excelente librerĂ­a JavaScript, se puede lograr una variedad de tĂ©cnicas, normalmente asociado con el diseño de impresiĂłn y publicaciĂłn de escritorio. Ver demo.

3. Lettering.js

JavaScript-lettering
Esta librerĂ­a JavaScript proporciona un control sin precedentes. Use Lettering.js para modificar las caracterĂ­sticas de la tipografĂ­a web, producir diseños web sofisticada y tipografĂ­a compleja. Lettering.js es un plugin para jQuery,asĂ­ que tendrá que usar jQuery para hacer trabajar a Lettering.js. Ver demo.

4. FitText

JavaScript-FitText
FitText, es un plugin de jQuery,  ayuda a los diseñadores web establecer la tipografĂ­a flexible que cambia de tamaño en funciĂłn del tamaño del navegador del usuario. Su intenciĂłn para el uso en el diseño web de respuesta se basa en sus diseños web optimizados para verse en cualquier resoluciĂłn, desde la pequeña pantalla de los telĂ©fonos mĂłviles hasta monitores de escritorio de pantalla ancha.

5. Kern.js

JavaScript-Kern
En la tipografĂ­a, Kerning es el acto de ajustar el espacio entre cada letra de una fuente para lograr una mejor proporciĂłn. Por ejemplo, para que las palabras se vean mejor, los diseñadores de la fuente puede variar la cantidad de espacio entre la ‘W’ y ‘T’ de manera diferente que entre ‘W’ y las letras ‘A’ debido a la forma y el tamaño de los pares de letras. Kerning ha sido, tradicionalmente, difĂ­cil para la tipografĂ­a de páginas web debido a las limitaciones, pero Kern.jshace que sea fácil. Este plugin jQuery requiere Lettering.js para funcionar.

6. fontdetect.js

fontdetect.js, esta librería JS detecta si una fuente en particular se encuentra actualmente instalado en el ordenador del usuario. Si el script encuentra la fuente deseada, va a proporcionar la página web correspondiente. Si no, vuelve a la fuente predeterminada que haya especificado en la hoja de estilo de su sitio web.

7. FontEffect

Esta divertida biblioteca de JavaScript se aplica fuera de lo comĂşn. FontEffect le permite procesar el texto tipo: contornos, gradientes, sombras y la reflexiĂłn.

BONUS tipografĂ­as JavaScript

Los siguientes tres recursos no son librerías JavaScript, pero le ayudaran producir impresionantes diseños de tipografía web.

8. Google Web Fonts API

Google Web Fonts API, es un servicio gratuito de google que te permite instalar y usar fácilmente fuentes personalizadas en tu sitio web.

9. HTML5 Boilerplate

HTML5 Boilerplate, Un conglomerado de mejores prácticas modernas de diseño web y un buen punto de partida para cualquier sitio web.

10. Font Squirrel @Font-face Generator

Font Squirrel @Font-face Generator, Utilice esta herramienta para preparar y generar el cĂłdigo necesario para cross-browser/platform usando cualquier archivo de fuente personalizada en su sitio.