Monthly Archives: October 2012

HTML 5: Soporte en navegadores

Soy fan number one del HTML 5 y el CSS3 que nos permite crear cosas que llavamos soñándo desde años. Pero como no todo el campo es orégano, el standar todavía no se ha cerrado y la implementación está siendo desigual, como desigual está siendo el soporte en navegadores.

Esto es algo que nos lleva a una lucha diaria con el tan deseado por unos y el tan temido por otros cross browser. Y digo temido porque todavía sigo teniendo pesadillas con el cliente que exige que su página se vea al pixel en el navegador de su oficina que no se ha actualizado desde el origen de los tiempos.

Nos quedan tres alternativas:

  1. Seguir maquetando las webs en XHTML y esperar hasta que todos los navegadores soporten HTML5.
  2. Utilizar HTML 5 y esperar a que todos los que utilizan navegadores antiguos se den cuenta de que se están perdiendo algo y se actualicen.
  3. Utilizar HTML 5 y buscarnos la vida para que los despistados de los navegadores obsoletos no se pierdan lo bueno.

Cada uno que elija.

En fin, me encantaría quedarme con la segunda opción, sobre todo porque ahorraría muchísimo tiempo para dedicarlo en mejorar el desarrollo, pero al final siempre acabo en la batalla de la tercera alternativa: probando, testeando, buscando polyfills para que todos se queden tranquilos, y mi conciencia también.

Estos últimos meses me he hecho con algunos recursos que me vienen bien para esta tarea de preparar la web para distintos navegadores, y me gustaría compartirlos por si a alguien le puede ayudar en su propia lucha 😉

Can I use

Esta es la web referencial para ver el soporte que tiene en la actualidad cada elemento de HTML y CSS.  Y digo en la actualidad, porque lo tienen al día, e incluso con predicciones de futuro cercano y futuro lejano. Todo un lujo.

http://caniuse.com/

HTML 5 Shiv

Este pequeño script hará que los navegadores que no soporten las etiquetas HTML 5 las entiendan. Se pone en el <head> y ya está, una cosa menos de la que preocuparnos.

<!--[if lt IE 9]>
<script src="dist/html5shiv.js"></script>
<![endif]-->

http://code.google.com/p/html5shiv/

Modernizr

Librería JavaScript que detecta la compatibilidad del navegador con HTML5 y CSS3

http://modernizr.com

Polyffils

Esta palabra tan bonita quiere decir hack, los recursos que utilicemos para que nuestro desarrollo se vea bien en otro navegador sin soporte se denominan así.

Iba a hacer una lista de los más útiles, pero como no es muy productivo reinventar la rueda os dejo un enlace MUST que ha creado Paul Irish http://paulirish.com/ que tiene que estar en los marcadores de cada uno de nosotros.

https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills

En siguientes posts explicaré los que yo he utilizado hasta el momento.

Estaría bien que contribuyerais nombrando los polyfills que usais vosotros, para que podamos tener feedback entre todos y podamos aprender más.

Zen Coding hará que vueles con el HTML y CSS

Esta semana pasada he tenido el placer de impartir una master class en @tapquo sobre Zen Coding dentro de las sesiones de #tapCoders.

Suena muy bien eso del Zen, muy relajante y new age, pero  ¿qué es el Zen Coding?

Es un método de abreviaturas que te permite volar con el código HTML y CSS. ¿Qué desarrollador@ web tiene todo el tiempo del mundo para trabajar en su web tranquilamente y pulirla y pulirla hasta que queda satisfech@?  Siempre andamos  con las deadlines torturándonos y esa es la dura realidad.  Queremos volar con el teclado para que las manos vayan a la velocidad de nuestro cerebro, pero no siempre lo conseguimos.

¿Por qué? Porque para escribir  una lista de dos líneas tenemos que poner:

<div class=”item”>

    <ul>

        <li>First item</li>

        <li>Second</li>

    </ul>

</div>

Abrir, cerrar, no te olvides de las comillas, de cerrar la ul… un trabajo mecánico que nos hace perder el foco donde tiene que estar: en el propio desarrollo.

Pues el Zen Coding viene a solucionarnos este tema porque ahora div.item>ul>li*2 se convertirá en esa lista en un abrir y cerrar de ojos.

¿Quieres saber más? Aquí tienes el enlace de la presentación de la master class y conviértete en un maestro Zen del front-end.

Esta sesión fue la inauguración de #tapCoders, una iniciativa para la continua formación y actualización de desarrolladores web que comparten sus conocimientos con la comunidad. Felicito al equipo de tapquo por su iniciativa. Por mi parte sólo me queda agradecer que contaran conmigo, ya que ha sido una experiencia muy positiva para mí. Contad conmigo cuando queráis: Compartir es el camino.

Foto: @sormenpills

Todo empezó con un tweet: Hackathon Windows 8

Megathon Windows 8 de Bilbao

Todo empezó con un tweet… jajajja. Hoy en día parece que twittear un artículo interesante u opinar sobre algo te convierte en un@ sabi@ del tema. El “problema” viene cuando te dicen: eso está muy bien, ¿serías capaz de explicarlo en una charla? Ups… pues ¡por supuesto! Y claro, te pones a estudiar como si no hubiera un mañana, porque está claro que es distinto tener una opinión sobre algo a ser capaz de explicarlo de una manera medianamente profesional sobre un tema técnico. Y ahí que me encontré en el Megathon de Windows 8 de Bilbao, dando la charla sobre el diseño de aplicaciones Windows 8. Todo un reto. Me entusiasma encontrarme con gente que cree en la gente y confía en que lo vas a hacer bien. No hay mejor motivación que ver que los demás piensan que eres capaz.

Y así, como quien no quiere la cosa, nos pasamos tres días inmersos en charlas de formación y diseñando/programando nuestras aplicaciones. Una experiencia para repetir.

Os dejo el enlace de la charla que di ese día.

Siendo consciente de que no todos hemos nacido para “convencer” a las masas, aquí estoy yo, con mis pequeñas propuestas de colaboración, con la cabeza llena de ideas e interrogantes. Buscar los propios límites nunca es fácil, porque sabes que si los encuentras llegará la frustración y un golpe con la realidad, pero como ahora está de moda decir: hay que intentar salir de tu zona de confort. Y en ello estoy.

Fotos: Blog de Josue Yeray: http://geeks.ms/blogs/jyeray/archive/2012/09/11/evento-hackathon-windows-8-en-bilbao.aspx y @asiermarkes