Avisar de contenido inadecuado

Google Font API: Usa tipografías open source en la web

Google font apiCada vez salen más y más APIs, y Google es uno de los qué más APIs libera. Esta vez ha presentado en las conferencias Google I/O, realizadas el pasado 19 y 20 de Mayo, la Google Font API. Esta API te ayuda a añadir tipografías en cualquier página web. Esto tiene unos beficios claros como:

  • Disponer de tipografías de código abierto de alta calidad
  • Funciona en la mayoría de los navegadores
  • Es extremadamente facil de usar.

Google font directoryPuedes ver todas las tipografías disponibles en el Directorio de Tipografías de Google. De momento disponen de 18 fuentes, con variantes en itálica, negrita, italica negrita. Además 1 de ellas dispone de 10 familias diferentes. Por lo tanto contamos con un catálogo amplio que nos permitirá dar otro estilo a nuestra web y salirnos de las típicas tipografías universales.

Google Font APIAdemás el catálogo está muy cuidado, ya que dispone de una ficha por cada una de las tipografías. En la ficha puedes encontrar el nombre del diseñador, con un enlace a su biografía y otros datos personales. También dispones de la descripción de la tipografía y el set de caracteres. También hay ejemplos de textos en diferentes tamaños, desde 36px hasta 12px, en diferentes  colores, #000, #333 y #666, y diferentes variantes, cursiva, negrita y negrita cursiva Puedes ver como ejemplo la ficha de la tipografía Cararell.

Si te parece interesante y quieres ver como incluirlo en tu web acontinuación te cuento las diferentes formas, solo con CSS y con ayuda de Javascript.

Leer más
{
}

Anywhere: API Javascript de Twitter

Hace 1 mes se realizó el Chirp, la conferencia oficial para desarrolladores de Twitter. Y en ella se presentaron varias novedades en torno al mundo Twitter. Entre ellas, una nueva página para desarolladores de Twitter: dev.twitter.com, donde podemos ver nuevas herramientas. En la que nos vamos a centrar, por ser la más cercana a la temática del blog es @Anywhere. @Anywhere es una API de Javascript que te permite integrar Twitter con tu sitio en unas pocas lineas de Javascript. Antes de empezar a utilizarla has de registrarte como desarrollador para que te faciliten una API key, para ello tienes el formulario de registro de un aplicación Anywhere. Tras ese paso, solo debemos añadir en las cabeceras de nuestra web la llamada a este script:

<script src="http://platform.twitter.com/anywhere.js?id=YOUR_API_KEY&v=1" type="text/javascript"></script>

Una vez añadido este script la foma de inicializar @Anywhere es la siguiente:

twttr.anywhere(function (T) {
// Tu código aquí...
});

Como ves en realidad llamamos a una función y le pasamos una función de callback con un parámetro T (podéis llamarlo como queráis). La cual se ejecutará una vez cargado el script de Twitter @Anywhere. Con esta API, de momento, puedes realizar lo siguiente:

Os invito a que la probéis. Desde Pixelover estamos preparando algunas demos de uso que os iremos enseñando a lo largo de estas semanas.

Cómo localizar un portatil robado

Durante mucho tiempo habia tenido el dilema de si comprarme un Mac o no. El motivo principal por el que no me decidía era el precio. Demasiado caros para mi gusto.

El tema es que hace cosa de un año me decidí por fin a entrar en el mundo Apple y me compré un portátil MacBook. Pero mira, por cosas de la vida, justo un par de meses después de haberlo comprado me entraron en casa y me lo robaron :(

Yo pensaba que al ser Apple y al tener el numero de serie y la factura, tendrian alguna forma de rastrear el portátil, de bloquearlo si se conectaba a Internet, o algo asi… pero no. Llamé al servicio técnico de Apple y me dijeron que no podian hacer nada.

Asi que bueno, investigando por la red, he encontrado algunos sistemas para poder localizar tu portátil en caso de robo o desaparición:

Leer más

Comportamiento de los usuarios en los sitios web

La usabilidad web es el área que estudia cómo deben estar hechos los sitios web para que sean fáciles de usar por los usuarios finales, para que encuentren lo que buscan de la forma más rápida y eficiente posible.

Dicho estudio se basa en el comportamiento de los usuarios en la web.

Asi que es importante que tengamos en mente cómo se comportan los usuarios en internet a la hora de diseñar nuestros sitios web. De esta forma conseguiremos que le saquen el máximo partido posible a nuestra web.

Veamos cuales son los patrones básicos de comportamiento de los usuarios en la web:

Leer más
{
}

Cómo extender objetos con jQuery. Diferencia entre $.extend y $.fn.extend

En muchos de los plugins de jQuery que manejamos vemos las expresiones $.extend (o jQuery.extend) y $.fn.extend (o jQuery.fn.extend).

Pues bien, lo que estamos viendo en estas expresiones es la aplicación del metodo .extend().

Este método es la base para la creación de plugins y para la parametrización de nuestros plugins (es decir poder tener unos valores por defecto que el usuario pueda modificar al llamar al plugin).

Pero... ¿que hace exactamente el metodo .extend()?

Basicamente lo que hace es extender objetos. Esto significa que, dado un objeto, le añade el contenido (funciones y variables) de otro objeto (o de otros).

La nomenclatura de este metodo es la siguiente:


jQuery.extend( target, [ object1 ], [ objectN ] )

Ahora bien, dependiendo del numero de objetos que reciba, el resultado final será diferente...

Leer más

Por qué no conviene usar variables globales en Javascript

Desde hace tiempo vengo leyendo en muchos blogs de desarrollo con Javascript la recomendación de no utilizar variables globales en nuestro código. Pero ¿por qué se recomienda no utilizar variables globales en Javascript?

En pixelovers hemos querido ahondar un poco en esta cuestión y para ello comenzaremos respondiendo a algunas preguntas:

  • ¿Qué son las variables globales?

    En Javascript los programas son entregados como texto. Este texto Javascript es evaluado (eval) y compilado en un ejecutable que se ejecuta inmediatamente. Esta ejecución puede dejar algunos elementos en el objeto global de la ventana.

    El objeto global es el espacio de memoria que contiene las funciones y variables que estan en la raiz. Las variables que no se definen específicamente tambien son consideradas como variables globales. Los nombres de estas variables se mantienen en el objeto global y sus valores son accesibles desde cualquier parte del código.

  • ¿Si no es recomendable el uso de variables globales en Javascript por qué existen?

    Este uso de variables globales era conveniente para los pequeños scripts que Navigator 2 esperaba soportar. Con el tiempo, estos pequeños script han derivado en complejas aplicaciones Web 2.0 (POO, AJAX, uso de librerias, plugins, etc...)  por lo que el uso de variables globales ya no tiene justificación.

 

Leer más

Libro manual jQuery UI 1.7

jQuery UI 1.7Hace unos meses cayó en mis manos este fantástico libro: jQuery UI 1.7 de Dan Wellman. Y lo llevo usando casi a diario desde entonces puesto que estoy metido en un proyecto en el cual usamos casi toda la librería (Dialog, Slider, Tabs, Sortable...). Al principio pensé que no le daría uso puesto que existen demos y documentacion de jQuery UI, pero desafortunadamente no es tan buena como me esperaba.

Creo que una de las partes que más conflicto crea entre los usuarios del framework es la cantidad de clases que añade a los elementos involucrados. Y es cierto, añade muchas, pero todas ellas necesarias. Gracias a eso te permite controlar a tu gusto la interfaz. Ellos te proporcionan una serie de temas, los cuales puedes personalizar mediante el jQuery UI ThemeRoller, pero hay casos en los que te quieres salir de la norma y dar, en un caso concreto, un estilo diferente. Conociendo bien el porqué de cada clases es muy fácil, y para este caso el libro me ha venido como anillo al dedo. He podido aprender, ya en el capítulo 2, el CSS Framework, algo imprescindible para dotar a tu interzar la personalidad que buscabas.

Por otro lado el libro me ha venido muy bien para entender paso a paso el funcionamiento de los widgets. Con lo que he podido crear mis propois plugins para automatizar ciertos procesos, como por ejemplo la creación de sliders, o paneles configurables mediante sortable.

La verdad que siendo sincero, si piensas desarollar algo con jQuery UI 1.7 y quieres hacer bien, te recomeiendo este libro.

Javascript y jQuery: Consejos y Buenas Practicas (Parte II)

Hace unas semanas iniciamos una serie de 2 posts para hablar de lo que consideramos que son unas buenas practicas para desarrollar codigo Javascript con la libreria jQuery.

http://stc.obolog.net/multimedia/fotos/309000/308801/308801-209198.jpg

Con este post cerramos la serie y profundizamos un poco más en el tema

En el primer post de esta serie comentamos algunas generalidades que nos pueden servir de base a la hora de desarrollar un código JS eficiente. En este segundo post hablaremos de como solucionar de forma eficiente problemas concretos que nos solemos encontrar en nuestros desarrollos.

Asi que, ahi vamos...

Leer más