Alpha's Manifesto

A black and white figure's thought-hive

Comentarios sobre The State of Responsive Web Design

Opiniones propias sobre muchos problemas mencionados

Acabo de terminar de leer un artículo largo y genial de Smashing Magazine, llamado The State of Responsive Web Design. Como el título lo indica, habla sobre el estado actual del diseño de webs responsive y sus pros y contras. Mucho mejor aún, habla de los distintos problemas a superar y la forma en la que la tecnología de hoy nos permite hacerlo. Pero no es una introducción al tema, sino que abarca todos esos problemas que aún no tienen soluciones definitivas. Totalmente novedoso.

Sin embargo, como bien dicen al final, esto no es ni el comienzo, y sobre las cosas mencionadas tengo mucho que mencionar. Quería dejar mis comentarios por aquí.

(Read more →)

¿Por qué distintos dominios para recursos estáticos?

La razón detrás de las URLs raras...

Sabemos que el nombre no es más que un nombre y que no importa cuál sea el servidor actual en donde se están alojando los datos, pero parecería que es una práctica común de muchos sitios grandes (léase: Facebook, Twitter, Google, etc.) hacer referencia a muchos de sus recursos en dominios externos. Por ejemplo, las imágenes de Facebook se encuentran alojadas debajo de http://static.ak.fbcdn.net/ y no debajo de http://www.facebook.com/, ni siquiera debajo de http://imgs.facebook.com/. ¿Por qué?

Alguien ya hizo esa pregunta y la respuesta fue nueva para mí: hay una limitación en varios browsers (y hastas donde yo sabía, algunos sistemas operativos) que previene hacer más de dos, tres o cuatro conexiones simultáneas a un mismo hostname. De hecho, es parte de la especificación HTTP 1.1 (parece que cumplir el estándar no siempre está tan bueno, ¿no?). Ahora, si notaron, la limitación es por hostname, ¿por qué entonces utilizar distintos dominios? La razón es evitar cookies que pueden estar yendo y volviendo en cada uno de los pedidos, y para evitar eso, se puede usar un dominio extra que nunca devuelva cookies. De esa forma, sitios grandes como estos se ahorran mucho bandwidth.

UPDATE: Gracias a Exos, que claramente estaba más informado que yo en este tema, las limitaciones exactas son de tres conexiones por cada dominio y cinco para cada IP. Los distintos dominios/subdominios ayudan a utilizar CDNs para distribución de contenido con mayor velocidad. Exos está en desacuerdo (y demuestra por qué, miren los comentarios) con que las cookies sean una gran carga respecto del bandwidth. Entonces el por qué de los dominios vs. subdominios queda en duda, pero suponemos que debe estar relacionado con políticas de administración interna de cada empresa.

Soy un zorrinito performante.

Link del día: Cut the Rope

En este caso es un juego, Cut the Rope, con su curiosa URL www.cuttherope.ie, sin ser casualidad. El juego es un juego realizado completamente en HTML5, y ya disponible para una buena cantidad de navegadores. El equipo de desarrollo trabajó en partnership con el equipo de Microsoft Internet Explorer, para demostrar la capacidad del navegador. Funciona realmente bien, y no deja de ser un juego simpático.

Soy un zorrinito jugador.

Link del día: Reportando bugs de browsers: qué, cómo y por qué

Este artículo de Smashing Magazine habla muy en detalle sobre la comunidad de desarrolladores de navegadores (una buena gran mayoría de ellos) y cómo es bienvenido el feedback de los usuarios para mejorar los navegadores mismos.

Explica un poco de qué forma se puede encontrar o aislar algo que creemos que es un bug, que también sirve para método de solución de problemas: una vez aislado el comportamiento no deseado siempre podemos idear un workaround  (que es, de hecho, como surgieron muchos de los hacks vigentes para hacer las cosas funcionar cuando no funcionan como deberían). El resto del artículo nos explica cómo reportar este comportamiento, bajo las líneas básicas de: ver si realmente es inesperado lo que ocurre, ver si no fue reportado antes, y cómo hacer un buen reporte de bug.

Allí están también los links a los bugtrackers de los navegadores más importantes: Internet Explorer, Firefox, Opera, Webkit (Safari/Chrome) y Chrome. (Chrome también tiene otro para el sistema de Javascript, V8).

Para los investigadores, también es interesante poder revisar esos links para ver el estado de avance y noticias de implementaciones de cada navegador.

Soy un zorrinito buggeado.

Link del día: Adaptive Images (mobile)

Nuevamente de la gente de CSS Tricks me llega un dato de una librería muy útil. En este caso es Adaptive Images, es una librería en PHP que nos permite servir imágenes con el tamaño justo dependiendo del tipo de cliente. No sólo se hace la diferenciación del tipo de cliente, sino del tamaño de la pantalla real.

Cómo es que funciona? Básicamente al momento de cargar la página un javascript se ejecuta antes de que ejecute el cuerpo. Este javascript carga una cookie en nuestro navegador con esa información de tamaño de pantalla, y cuando nuestro navegador procede a buscar las imágenes, ese cookie viaja también y el servidor puede devolver una imagen del tamaño justo.

Por supuesto que posee varias opciones de configuración para servir imágenes de la mejor forma para nuestra necesidad, y por supuesto, podemos servir una imagen de baja resolución si la ventana del navegador tenía poco espacio y luego se amplió. Pero hay workarounds para todo, de forma que sigue siendo una herramienta útil.

Soy un zorrinito adaptativo.

Link del día: Trackeo de usuarios, desde caché

Gracias a una característica propia de los browsers en cuanto a la forma que cachean elementos (algo que está funcionando desde hace un buen tiempo ya), resulta que es posible que explotando esa funcionalidad se pueda hacer trackeo de usuarios de la misma forma que podríamos hacerlo con cookies u otros elementos persistentes (recuerdan EverCookie?).

Y resulta que las técnicas no son simples de salvar para que esto no ocurra. Como el autor lo menciona en su artículo, Preventing Web Tracking via de Browser Cache, “esto no es algo con un arreglo simple“.

Él nos explica también cómo se puede lograr este tracking con varios métodos, sin nada que alerte al usuario de estar siendo trackeado.

¿Ustedes qué piensan? ¿Puede esto ser un problema para la seguridad?

Soy un zorrinito cacheado.

Link del día: En defensa de los hacks CSS

Para mi sorpresa, me encontré con un artículo de Mathias Bynens llamado In defense of CSS hacks – introducing “safe CSS hacks”. Él habla e introduce el concepto de los hacks CSS. Permítanme hablar un poco sobre su idea.

Él menciona que los CSS hacks son básicamente comportamiento especial que podemos invocar en cada navegador, algo que a veces es totalmente deseado, y no tiene por qué ser un problema o una mala práctica, sino que puede ser usado para muchas cosas. El uso más común que se le ha dado hoy en día es hacer “tweaks” específicos para la forma de renderización de cada navegador/versión y entonces lograr una visión consistente a lo largo de todos los navegadores.

Sin embargo, decir que tenemos control sobre el estilo de cada navegador y/o versión no necesariamente quiere decir que lo utilicemos sólo para lograr una vista homogénea. De hecho, gracias a ellas podemos utilizar determinadas características que hacen la exploración en un determinado navegador más natural dentro de las capacidades del mismo.

Esto, combinado con sentencias condicionales, hace que podamos tener mucho control sobre lo que el navegador utiliza de nuestro código.

Los dejo con el último ejemplo que el artículo plantea:

[code lang=”html”]
<!–[if lt IE 9]><html class="lte-ie8"><![endif]–>
<!–[if gt IE 8]><!–><html><!–<![endif]–>
[/code]

[code lang=”css”]
.foo {
color: black;
}

.lte-ie8 .foo {
color: green; /* IE8 and older */
*color: blue; /* IE7 and older */
_color: red; /* IE6 and older */
}
[/code]

Personalmente no me encuentro de acuerdo con esta propuesta, pero veo que tiene sus fundamentos. ¿Ideas? ¿Críticas?

Soy un zorrinito hackeado.

Link del día: Los fines de semana son para JavaScript

Aunque el título original del post es Weekends are for hacking, yo creo que este título se le ajusta un poco mejor y se presta menos a confusión, ya que el hacking al que se refiere es hacking de archivos JavaScript para crear nuevas funcionalidades o sobreescribir funcionalidades que ya existen en determinados navegadores. Los ejemplos son muy buenos, y las aplicaciones son múltiples. Pasamos desde la posibilidad de crear gráficos hasta la posibilidad de reproducir MIDI desde el navegador. Por supuesto, todo esto es una gran fuente de conocimiento que podemos utilizar para aprender.

Quizá hacer nuestros propios hacks no sean tan difíciles (y de hecho, nos invitan a que lo hagamos), pero personalmente no creo ser tan conocedor de JavaScript como para ser capaz de algo así. ¿Ustedes sí?

Soy un zorrinito JavaScript.

Dicho sea de paso, ¡Felices Pascuas!

Link del día: IE9, bien encaminado

Llamó mi atención un artículo en SixRevisions llamado Five Things IE9 is (Actually) Doing Right, y me sorprendió leer que este navegador está tomando un rumbo muy interesante. Más allá de personalmente creer que no llega al nivel de usabilidad que logran otros navegadores (aunque es una opinión personal), realmente está dando un giro refrescante.

Entre las cosas que menciona el artículo (sobre las cuales no me extenderé) quiero resaltar el hecho de soportar los nuevos estándares, cosa sin precedentes, tener una performance realmente increíble, la integración de herramientas de depuración (developer tools) y como extra, la transparencia de los desarrolladores.

Uno de los puntos mencionados allí es el hecho que Microsoft nos permita dar un vistazo a la plataforma de IE9 para probarla, cosa que podemos hacer desde IE9 TestDrive, una experiencia sorprendente, en lo especial para mí. No he hecho mucho más que ejecutar varias de las pruebas en IE9 y en comparación con otros navegadores (Chrome, Firefox) y realmente la forma en la que IE9 está trabajando parece ser la mejor.

Por supuesto, lo que tenemos disponible hoy por hoy es solamente la plataforma de renderizado de IE9. ¿Qué pasará cuando se anexen todas las posibilidades que el navegador nos brinda? ¿Mantendrá su performance y su estabilidad? El tiempo nos responderá.

Soy un zorrinito beta.