domingo, 26 de mayo de 2013

Generar font face en linea

Muchas veces cuando me solicitan un tipo especial de letra en un desarrollo web, lo incluyo directamente desde las fuentes de Google. (http://www.google.com/fonts/) Si la fuente está dentro de las opciones de Google, doy clic en uso rápido y el me da todas las opciones de insertar la fuente dentro de la web.


En la siguiente pantalla simplemente seleccionamos como deseamos insertar, estandar dentro del header de nuestra web, importando dentro de nuestro archivo css o incrustando con javascript.   Copiamos el código según vamos a usar.   Y luego aplicamos la fuente dentro de nuestro css en donde deseemos incluir esta fuente.



Si la fuente no se encuentra dentro de Google Font pero tenemos el archivo de la fuente, podemos generar un kit en el siguiente sitio web:  http://www.fontsquirrel.com/tools/webfont-generator

Pasos para usar el Kit de fuente:


  1. Descomprima los archivos dentro de su carpeta css. 
  2. Localizamos el archivo stylesheet que incluye el @font-face lo copiamos y pegamos dentro de nuestro archivos css. 
  3. Usamos esta fuente donde corresponde. 


viernes, 3 de mayo de 2013

Generadores de CSS, ayuda con css

Cuando diseño sitios web siempre me apoyo en estos sitios que generan código CSS perfecto y fácil de usar.

Tamaños para Media Queries en diferentes dispositivos

A continuación presento algunas medidas estándar para los más comunes dispositivos a los que nos podemos enfrentar a la hora de diseñar sitios web adaptables.

Que es "CSS3 Media Queries"

Nos permite escribir CSS (hojas de estilo), que reconocen el tipo de medio por el cual se está visualizando nuestro sitio web. Con CSS se pregunta sobre el tipo de medio, detectando ciertas condiciones y permitiendo crear estilos especiales para cada salida que reconoce.