Contenido

La vuelta a las buenas costumbres y de como han cambiado las cosas

15 May

+ 24

Dicen que a veces hay que dejar de hacer algo un tiempo para luego volver con más ganas e ilusiones, no sé si será mi caso, pero creo que es el momento de volver.

aNieto2k nació para solucionar una carencia de mi memoria, incapaz de almacenar de forma ordenada la cantidad de nuevos conocimientos que estaba absorbiendo en mi evolución como desarrollador, nació con la intención de servirme como hemeroteca de cosillas que probaba, y que explicada con mis palabras me sirviera para volver algún día a revisar como hacer esto o lo otro. Una forma de mantenerme al día en el frenético sector en el que estamos metidos, donde de un día para otro las cosas cambian radicalmente.

Y ahora, casi 7 años después, quiero volver a coger las riendas de esa idea.

Como todos sabemos y asumimos, las cosas cambian y las personas no son un excepción, lo que hoy te puede parecer lo más interesante de repente te aburre y se vuelve rutinario, a veces sin ningún motivo y otros por que te satura. En mi caso, he sufrido ambos, pasaron los años y lo que hacía con pasión y dedicación cada día se convirtió en una obligación y en ese momento dejó de ser todo lo divertido que parecía en un principio.

Creo que ha pasado el tiempo suficiente para volver a cogerlo con ganas y disfrutar como lo hacía antes sin caer en los errores del pasado, tomándomelo con más calma y definir un poco más el camino que quiero que siga el blog.

¿Que ha pasado durante este tiempo?

Personalmente muchas cosas y laboralmente muchas más, pero aunque crea que son muchas no son nada con lo que me he encontrado cuando me he puesto a investigar.

En el TODO list, tenía pendiente hacer cositas con Node.js, y cuando he empezado a tirar de la manta se ha destapado todo lo que Node.js ofrece, ya publicaré algunos artículos más concretos para los rezagados como yo que aún no le han metido mano, pero os puedo decir que viendo el código de alguna aplicaciones que hay por internet hace sentirse un abuelo de la programación que aún se sabe de memoria como definir una llamada Ajax usando el objeto XMLHttpRequest, a pelo o hacer los border-radius con una cantidad ingente de div’s para incrustar imágenes con los bordes.

Como persona que se haya en la mediana edad (si, aunque no nos guste como suene es donde estamos trentañeros :D) tengo sentimientos enfrentados al respecto, unos de rechazo frente a lo nuevo y otros de admiración por los cambios, espero que con el uso se vayan disipando.

Así que bueno, pongamos la rueda a rodar a ver hasta donde nos lleva.

Gracias por estar ahí!

Mide el tiempo de carga de tu página con Google Analytics

25 Oct

+ 6

Las estadísticas nunca están de más y disponerlas todas reunidas donde puedan ser cruzadas, nos permitirá realizar combinaciones de lo más variopintas. El tiempo de carga de la página es algo que por norma general no suele estar entre la mayoría de servicios de estadísticas, pero gracias al ingenio y la fléxibilidad de Google Analytics puedes integrar este dato en tus estadísticas de Google Analytics.

landing_page_time copia
(Ver Imagen)

Estos gráficos indican el tiempo en milisegundos que ha tardado la página en cargarse.

<html>
<head>
 <script type="text/javascript">
 //<![CDATA[
    var page_load_start = new Date();
    var _gaq = _gaq || [];
    window.onload =  function() {
      var page_load_end = new Date();
      var load_time = page_load_end.getTime() - page_load_start.getTime();
      load_time = parseInt( load_time / 100 )*100;
      _gaq.push(["_setCustomVar",1,'landingPageTime',load_time,2]);
      _gaq.push(["_setAccount","UA-xxxxxxxx-y"]);
      _gaq.push(["_trackPageview"]);
    };
 //]]>
 </script>
 <!-- Here goes the rest of your head section --/>
</head>
....
<body>
<!-- Your web page goes in here --/>
<script type="text/javascript">
 //<![CDATA[
    (function() {
      var ga = document.createElement('script');
      ga.type = "text/javascript"; ga.async = true;
      ga.src  = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
      var s = document.getElementsByTagName('script')[0];
      s.parentNode.insertBefore(ga,s);
    })();
 //]]>
 </script>
</body>
</html>

Como podemos ver, simplemente inicializamos un contador para obtener el tiempo completo desde que se inicializa hasta que la página está cargada, concretamente en el evento onload(). No creo que sea un sistema muy exácto, pero nos dará un valor de referencia que poder usar en nuestras estadísticas.

[Meme] Concepto de CSS ingenioso

6 Ago

+ 8

Pedro de CSSBlog me pasa un meme muy divertido que trata de definir CSS con una frase ingeniosa y divertida. De esta iniciativa han salido perlas como estas:

CSS es la poesía que el no-programador SI es capaz de apreciar

(Fernando Tellado)

“El CSS es al diseño web lo que los briefings de Toscani son a la publicidad de Benetton, concepto.”
“CSS es nuestro mejor traje, sólo en el espejo de Microsoft nos vemos más gordos.”
“CSS es lo que otros llaman Css, CCS o SCS, yo prefiero llamarlo desde el header.”

(Cristian Eslava)

CSS es el color sobre códigos grises

(Javier Asín)

Y bueno ahí va la mia:

Ojala existieran unas gafas CSS con las que ver el mundo como nosotros queramos.

He dicho! 😀

Fotografía para desarrolladores web

5 Abr

+ 44

Hace unos meses que me he aficionado, y bastante, a la fotografía. Como poco a poco voy introduciéndome en el mundillo y me está gustando mucho he pensado que sería interesante compartir con vosotros lo que voy aprendiendo sobre el tema asemejándolo al lenguaje que los desarrolladores web conocemos.

No soy ningún profesional ni me dedico a ello, así que pido perdón por adelantado por lo errores que pueda cometer. Simplemente intento plasmar los conocimientos adquiridos estos meses.

0) Introducción

Desde que me inicié en la fotografía no he de dejado de ver cada fotografía como un proyecto que llevar a cabo. Partiendo de que la fotografía se compone de 2 grandes conceptos (exposición y composición) podemos asemejarla a una página web en la que la exposición sería la creación de la misma, usando herramientas y lenguajes de programación y a composición podemos llamar a la creación del diseño que el usuario verá de nuestra página. Se trata de un interpretación personal.

Básicamente en fotografía, se trata de realizar una composición que nos agrade o nos llegue a transmitir algo y de hallar una exposición correcta directamente desde nuestra cámara, como con una página web 😀

1) El viaje de la luz

Para los que no lo sepan, la luz es la clave de la fotografía, básicamente lo que hace la cámara es captar la luz reflejada en los objetos que deseamos retratar. Para ello, la luz ha de pasar un obturador que se abre y se cierra limitando la cantidad de luz y un diafragma que abre o cierra el paso de dicha luz, para terminar golpeando en el sensor donde la energía luminosa es convertida en datos binarios para almacenarse posteriormente en nuestra tarjeta SD.

2) Conceptos

Para empezar vamos a definir una serie de conceptos que poco a poco irán cogiendo sentido mientras entramos en materia.

  • Obturador: Se encarga de establecer el tiempo durante el que la luz llega al sensor. Este tiempo se mide en fracciones de segundos o segundos. (Ej: 1/250, 1/125,…)
  • Diafragma: Su función es la de definir la apertura de la óptica del objetivo, haciendo que entre más o menos luz. Se mide mediante el famoso número f, y a mientras mayor número f, menor apertura. (Ej: f/1.8 > f/16)
  • Sensor: El sensor es el encargado de recibir esa luz y procesarla para que la cámara pueda trabajar con ella.

3) Exposición: El lenguaje de programación de la fotografía

La fotografía ha este nivel es un lenguaje de programación más, tenemos una serie de variables que podemos modificar a nuestro antojo al recibir los parámetros de entrada (la escena) y con los que obtendremos un resultado que veremos en nuestra fotografía.

La exposición es la cantidad de luz que encontramos en una fotografía y nuestra misión como programadores de la imagen será encontrar la exposición óptima. Para ello tendremos que usar los tres factores que influyen en la fotografía conseguir la cantidad exacta de luz para cada situación.

Se trata de un triángulo compuesto por:

  1. Velocidad de obturación.
  2. Apertura de diafragma.
  3. Sensibilidad ISO.

Y si tiramos mucho de un lado, tendremos que reducir mucho de otro para compensar. Siempre teniendo en cuenta que la manipulación de cada parámetro afecta a algo de la fotografía.

3.1) Velocidad de obturación

Cuando hablamos de velocidad de obturación, hemos de pensar que los efectos relacionado a la velocidad están estrechamente ligado a ellos. Si deseamos congelar el momento o dar sensación de velocidad dependerá del tiempo que permitamos a la luz llegar al sensor.

Flying Dog
Congelando el momento.
Volviendo a casa
Larga exposición

3.2) Apertura de diafragma

La apertura del diafragma, nos permitirá definir la profundidad de campo de nuestra imagen. La profundidad de campo es aquella zona de la imagen que se ve nítida antes y después del objeto enfocado. Mientras más apertura menor profundidad de campo, permitiendo conseguir interesantes efectos de desenfoques de de fondo o imágenes completamente nítidas.

Flor

Muy poca profundidad de campo

Vista de hormiga

Más profundidad de campo

3.3) Sensibilidad ISO

La sensibilidad ISO, indica la capacidad que el sensor de la cámara tendrá de captar luz. Mediante modificaciones eléctricas la sensibilidad del sensor puede ser ampliada, permitiendo así captar una mayor cantidad de luz. Al tratarse de una alteración electrónica nos produce el desagradable ruido. Así que hemos de tenerlo en cuenta a la hora de usarlo.

Luz en la oscuridad

El ISO muy alta genera mucho ruido

3.4) Subexposición y Sobreexposición

Jugando con los 3 parámetros, podemos conseguir imágenes subexpuestas, osea oscuras, sobreexpuestas osea muy claras, y el punto intermedio que consideramos como correcto.

Surf en Febrero
Sobreexpuesta
Brillante vigilante mojado
Subexpuesta

4) Composición: Como hablar con imágenes

La composición es la forma que tiene el fotógrafo de hacer llegar un mensaje a los que visualizan las imágenes. Dependiendo del nivel cultural, de la nacionalidad, del sexo,… incluso de la edad del que ve la imagen, la percepción de la misma puede variar. Por ese motivo no hay ninguna ley para hacer composiciones correctas, por ejemplo un árabe comenzará a ver la imagen de derecha a izquierda, un chino de arriba a abajo,…

Aún así, hay una serie de reglas que permiten guiar la vista del observador hacia lo que queremos resaltar de nuestra escena. Hay que recordar que las reglas están para saltárselas 😀

4.1) Regla de los tercios

Una de las reglas más importantes es la regla de tercios, básicamente por que las demás reglas se basan en ella para existir. Esta regla se encarga de dividir la escena en 9 cuadrados iguales produciendo una líneas en la imagen.

Rivertree_thirds_md
(Ver Imagen)
Imagen de la Wikipedia

Entre estas líneas, podemos destacar líneas y puntos fuertes. Lugares en los siempre deberíamos intentar ubicar los objetos que estamos fotografiando. La idea es aportarle mayor fuerza a la imagen y descentrando al individuo de la escena conseguimos hacer.

Ratón feliz Rosetón de la Iglésia de Valldemosa

Aunque recordemos, las reglas están para romperlas 😀

4.2) Regla del horizonte

Usando la misma rejilla de la regla de los tercios, la regla del horizonte pretente transmitir un valor añadido a nuestras fotografías del horizonte.

Atardecer

Usando la línea horizontal inferior

Llaüd

Usando la línea horizontal superior

La regla dice que el horizonte nunca debería estar centrado en la imagen, sino que debería ir sobre las dos líneas horizontales fuertes dependiendo de lo que queramos transmitir. Si queremos darle una connotación más celestial por que las nubes del cielo son nuestro individuo usaremos la línea inferior si por lo contrario queremos darle una sensación más terrenal usaremos la línea superior.

4.3) Regla del movimiento

La regla del movimiento dice que siempre que un elemento esté en movimiento debemos dejarle espacio delante del objeto como indicando la dirección que este va a seguir.

Libre Equilibrio

4.4) Regla de la mirada

La regla de mirada es muy similar a la del movimiento y dice que cuando realizamos un retrato debemos dejar espacio en dirección de la mirada del sujeto.

Posando Guarda Vaticano

Bueno, espero haber explicado con palabras mundanas lo que he entendido de fotografía en estos 2 meses que llevo haciendo fotos. Aunque no es la temática habitual del blog, creo que de vez en cuando algo así para coger aire me pueden venir bien, y a vosotros también 😉

Inactividad, desmotivación y esas cosas

17 Mar

+ 174

Muchos son los que me han preguntado por mail, twitter o buzz, el por que no posteo últimamente. Y aunque he intentado dejarlo pasar esperando a que se me pase creo que es el momento de dar la cara y explicarlo.

Hace ya un tiempo que vengo bastante desmotivado, los que lleven más tiempo en el blog, sabrán que no es la primera vez que me pasa, quiero pensar que es temporal y que como las otras veces las ganas de escribir y comentar cosillas van a volver.

Con el tiempo he dejado de ver el blog como una via de escape donde dejar lo que voy descubriendo y de paso compartirlo con todos vosotros. Principalmente por que lo estoy viendo como una obligación y no como un hobbie. Osea que ya no encuentro las ganas que antes tenía por escribir. La falta de comentarios últimamente ha hecho que lo sienta como una canal unidireccional y pierda la gracia que antes tenía, entre otras cosas.

Sigo compartiendo via Twitter todo lo que me parece interesante, con la diferencia de que ahora en 140 carácteres no necesito extenderme y me resulta más cómodo aportar mi granito de arena.

No quiero dar la impresión de que esto es un adios, por que para mi esto es muy importante y sobretodo quiero seguir con ello, pero no así como estoy. Quiero hacerlo con las ganas que siempre he tenido.

Así que siento el coñazo, no soy una persona que le guste hablar de sus sentimientos (no creo que nadie tenga que sufrir de mis problemas teniendo los suyos propios) y espero valoréis lo difícil que ha sido para mi escribir estas líneas.

Un saludo y disculpas por cualquier tipo de molestia que haya podido ocasionar.

Idle Spy para MooTools, usa Ajax solo cuando sea necesario

23 Ene

+ 3

Alfredo Artiles nos vuelve a deleitar con un espectacular script con el que aprovecharemos al máximo los recursos del usuarios y los de nuestro servidor haciendo peticiones Ajax solo cuando estemos en una aplicación web.

El script montado para funcionar con MooTools, se basa en que cuando cambiamos de pestaña el navegador continua ejecutando nuestros scripts de actualización mediante Ajax. Estas llamadas consumen recursos sin ser necesarios, ya que estamos en otra pestaña. Alfredo ha optado por controlar el movimiento del ratón y teclado sobre la página y en caso de pasar un tiempo sin que este actúe sobre nuestra página cancelará nuestras peticiones Ajax.

Modo de empleo

var idleSpy = new IdleSpy({
 idleTime: 300000
});
idleSpy.addEvents({
 'idle': function() { /* on user idle code here */ },
 'back': function() { /* on user back code here */ }
});
idleSpy.start();

Básicamente lo que nos ofrece el script es la posibilidad de definir un tiempo de espera antes de activar el evento idle en el que definiremos que hacer cuando llevemos X segundos sin actuar sobre nuestra página. Posteriormente, definiremos el evento back que se encargará de reestablecer todo lo que hayamos parado previamente.

¿Para jQuery?

Los que usamos jQuery tambien tenemos un plugin que nos permite realizar la misma tarea. jQuery idleTimer, nos permite definir ambos eventos.

// timeout en milliseconds; defaults 30000
$.idleTimer(10000);

$(document).bind("idle.idleTimer", function(){
// ....
});

$(document).bind("active.idleTimer", function(){
// ....
});

$.idleTimer('destroy');

Nicholas C. Zakas, implementó hace ya tiempo una versión para YUI que los desarrolladores que usen pueden tener en cuenta.

Actualizo (11:58)

Alfredo me avisa de que ha encontrado uno para funcionar con Prototype.

Mozilla Firefox 3.6 está entre nosotros

21 Ene

+ 3

Para el que aún no se haya enterado, Mozilla Firefox 3.6 está ya entre nosotros y disponible para descargar. Hay que decir que la velocidad de esta nueva versión ha sorprendido al más incrédulo. Por el momento no hay nada negativo que destacar de esta nueva versión, todo lo contrario, muchas cosas realmente interesantes.

Feliz año nuevo!! Feliz 2010!!

1 Ene

+ 9

Pues eso, entre uva y uva me he acordado de todos vosotros y he parado para desearos un feliz año nuevo!!



$("#2010 *").attr("felicidad", ∞);

Mucho cuidado en la carretera, empieza el año teniendo cabeza.

Mozilla se la devuelve a Google incluyendo V8 en Firefox 3.7

28 Dic

+ 8

Este artículo ha sido la inocentada del 28 de Diciembre de 2009. Siento las molestias que haya podido originar.

Cuando Google anunció Google Chorme el mundo se preguntó por el apoyo que Mozilla recibía para desarrollar su navegador (Firefox) y el significado que tenía la aparición de Google Chrome en la batalla contra Internet Explorer.

Sin duda, este fue el detonante de la tensa situación en la que están inmersas las dos compañías de ahí que Asa Dotzler recomendara usar Bing en lugar de Google, tras las desafortunadas declaraciónes de Eric Schmidt (CEO de Google) en las que decía básicamente que «…el que quiere ocultar sus búsquedas es por que hizo algo malo…«.

Ahora Mozilla nos sorprende con la decisión de integrar V8 en la próxima versión de Firefox, algo que a los desarrolladores web nos ha sorprendido gratamente. Al ser un proyecto open source, muy ligado a la filosofía de Firefox, han tomado la decisión trabajar en el proyecto TraceMonkey (motor de Javascript de Firefox) y desvincularlo de Firefox hasta que este ofrezca unos resultados dignos de competir con V8, mientras tanto, usarán V8 como motor de render de Javascript en el propio Firefox.

firefox-3.7-v8
(Ver Imagen)

Como podemos ver, las gráficas son realmente sorprendentes, ya que al integrar el motor V8 con Gecko han conseguido incrementar la velocidad general del navegador en un 15% sobre la velocidad ofrecida por Chrome (segun SunSpider) y un 6% según Dromaeo. Esto pinta bien, y seguramente en breve podremos testearlo nosotros mismo cuando publiquen la primera alpha de la siguiente versión de Firefox.

Reducisaurus, reduciendo tus CSS y JS remotamente

27 Dic

+ 4

Reducisaurus es un servicio desarrollado sobre App Engine y basado en YUI Compressor que nos permite comprimir nuestros y servir nuestros ficheros CSS y JS.

<script src="http://reducisaurus.appspot.com/js?file1=...&url1=...&max-age=604800"></script>
<link rel="stylesheet" href="http://reducisaurus.appspot.com/css?file1=...&url1=...&max-age=604800"></script>

Es posible enviar múltiples ficheros por GET o POST mediante los parámetros fileX para pasar el contenido del fichero o mediante urlX para cargar el fichero remotamente. Si lo necesitamos podemos usar file y url en la misma llamada.

Además dispone de un parámetro extra que nos permite especificar el tiempo de caché (&max-age=XXX) que deseamos que esté disponible nuestro fichero, por defecto tenemos 600 segundos. O desactivar la caché (&expire_urls=0)