Me mudo

Este blog no recibirá ya más actualizaciones. Ve al nuevo blog enricflorit.com o averigua por qué me mudo.

jueves, 6 de septiembre de 2012

Porqué usar características que no son cross-browser

Últimamente hay mucho revuelo en el mundo del desarrollo web. Constantemente aparecen nuevas funciones en los navegadores, algunas quedan obsoletas por las nuevas especificaciones del HTML5, CSS3 y JavaScript. Lo cierto es que a veces puede ser un auténtico lío implementar determinadas cosas en un sitio web.
Pongo un ejemplo: el audio/vídeo nativo en todos los navegadores aún no termina de ser una realidad. Pongo otro: las fuentes CSS que son compatibles en IE no lo son en FF, Chrome y viceversa. Aún hay más: el método matchesSelector de JS requiere un mínimo de 4 prefijos para funcionar correctamente.
Podríamos seguir así indefinidamente... Pero a veces, puede ser bueno usar funciones nuevas que sabemos que no serán soportadas por todos los usuarios. Y sí, tengo razones para afirmar esto:
  • Exclusividad. Convence a tus usuarios de la mejor experiencia que obtendrán actualizando su navegador. Así lo hace gmail, por poner un ejemplo. Y ahora es muy fácil mandarlos a browsehappy para que descarguen un navegador más nuevo.
  • Estética y/o decoración. Border radius es una propiedad CSS soportada por el 79% de los usuarios web. El resto ve unos bonitos bordes de 90º. Pero en la mayoría de los casos, el uso de border-radius (y su uso con prefijos) se limita a razones estéticas. A los usuarios que no lo vean no les pasará nada por no ver del todo bien tu sitio.
  • Funcionalidades no imprescindibles. Sólo Chrome y Safari 6 soportan las notificaciones web. ¿Imprescindibles? No lo creo, son sustituíbles por un <div> que aparezca en una esquina de la página o por la función alert(). Pero evidentemente, queda mucho mejor si se ve de forma nativa en el navegador.
  • Fallbacks. Si pones un input type="search/email/number/date/url/range" (etc), los navegadores que no lo soporten mostrarán una caja de texto normal y corriente. Y como igualmente en el lado del servidor es prácticamente obligatorio comprobar los datos introducidos, no supone un problema.
    Otro ejemplo son los de los degradados en CSS. Definimos un color de fondo por si acaso, y luego creamos el degradado.
  • Alternativas (polyfills). Muchas veces, para hacer funcionar una determinada característica, función o API en nuestra web no tenemos más que ir a google, buscar un poco y descargar un script. Y la mayoría de estas veces, habremos tardado 2 minutos en poder avanzar en nuestra aplicación con garantías.
  • Soporte progresivo. Lo que hoy no está soportado por la mayoría, lo estará mañana. Un buen ejemplo es Internet Explorer 10: hace unos años era impensable que el navegador de Microsoft pudiera llegar a soportar ni la mitad de estándares web (aparte de los que ellos mismos introdujeron, claro).
Riesgos
Está muy bien usar nuevas funciones: aportan un aire de avance tecnológico a la web y una mejor experiencia para el usuario. Pero no todo son ventajas. Por ejemplo, una web con un diseño muy catastrófico en navegadores antiguos hará que los nuevos visitantes huyan más rápido. Un visitante que llega a tu web a través de una búsqueda quiere respuestas. Luego si acaso (y no siempre) ya se interesará por el resto del contenido de tu web.
Así que hay que tener en cuenta una cosa: siempre mostrar la información de manera adecuada, pese a que el diseño y/o los efectos "extra" no estén soportados en todas las plataformas.
Por último, una recomendación: HTML5 Please. Esta web tiene como lema "Utiliza lo nuevo y brillante responsablemente" (Use the new and shiny responsibly). Tiene muy buenos consejos y recomendaciones sobre qué es mejor usar (o no usar) en el campo de las últimísimas nuevas tecnologías web. No dejéis de visitarla: html5please.com.
Un saludo! ;-)

No hay comentarios:

Publicar un comentario

Related Posts Plugin for WordPress, Blogger...