Recursos y herramientas para ayudar con el desarrollo web actual

Cuando los desarrolladores pensamos en una web actualmente, no podemos evitar pensar en varios puntos importantes, que muchas veces nos traen de cabeza.

Por enumerar algunos, se me ocurren:

  • Responsive (/adaptive)
  • Internet Explorer (sí, lo he nombrado… sí)
  • Rapidez

Cuando digo Responsive, me refiero a que cuando lanzamos una web a día de hoy, ya lo hacemos con previsión a que pueden visitarla desde diferentes dispositivos, y eso se debe de pensar antes de empezar el desarrollo, ya en el mismo diseño hay que tenerlo planteado.

Cuando menciono al Internet Explorer (no lo haría 3 veces delante de un espejo…) lo hago porque muchas técnicas actuales no funcionan con algunas de sus versiones, e incluso a veces funcionan a medias, y hay que tenerlo claro nada más empezar, para intentar que la web sea compatible con cuantos más navegadores mejor, y… tendremos que llamar navegador al Internet Explorer.

Y cuando me refiero a rapidez, no me estoy refiriendo a una optimización extrema, porque para empezar no aconsejo enfrentarse a eso, esa parte mejor dejarla para el final, cuando todo está correcto. Pero aún así, siempre piensas un poco en qué usar, y cómo usarlo, para ganar unas décimas de segundo en el resultado final.

Pues bien, vamos a enumerar una serie de recursos o herramientas para ayudar a lidiar con estos puntos, y con muchos otros.

Ayudas generales acuales (con actual me refiero, enfocado al mundo responsive):

  • Webdev check list: Listado mediante checks, para que no se te olvide nada antes de lanzar. Es bastante completo, aún así siempre pueden faltar (o sobrar) algunos de ellos.
  • Patternlab: Me encanta, los creadores son Brad Frost y Dave Olsen, a los que he nombrado en varios posts anteriores. La idea principal va ligada al Atomic design, que básicament es partir de elementos muy pequeños, e ir creciendo hacia arriba, agrupando esos elementos conformando unidades más grandes, así hasta el site completo.
  • Modernizr: Es una librería javascript, pero para mi va algunos pasos más allá, porque consigue allanar el camino entre los navegadores que aún no soportan ciertas funcionalidades, y otros que sí. Diría más, incluso, para mi es el camino (al menos actualmente) a aplicar una mejora progresiva (progressive enhancement) correctamente.
  • This is responsive: Recopilatorio enorme de ayudas, recursos, noticias y patrones para ejecutar un Responsive más allá de lo correcto. Os lo recomiendo, es una fuente inagotable de conocimiento al respecto.

Para ayudar con navegadores y versiones de los mismos:

  • Modernizr HTML5 Cross browser Polyfills: Listado enorme de fallbacks y polyfills para conseguir un HTML5 robusto en todos (o casi) los navegadores.
  • Browserhacks: No tiene mucha más explicación, el título es bastante claro 😉
  • Can I Use: Absolutamente genial. Buscas una propiedad, un atributo, una funcionalidad, y automáticamente tienes un listado de los navagadores, y versiones de los mismos, que lo soportan o no lo soportan, e incluso si lo soportan parcialmente.
  • Selectivizr: Otra de las librerías útiles cuando el objetivo es conseguir compatibilidad de CSS3 con Internet Explorer.

Para desarrollo enfocado al móvil:

  • Mobile Web Best Practices: Su nombre ya lo dice todo, interesante recopilación separada entre experiencia de usuario, desarrollo, diseño, estrategia, etc…
  • Mobile Site Audit Checklist: Esto realmente fue un post que leí hace un tiempo de moz.com, pero que me pareció extraordinario. Son una serie de checks (enfocados al visionado móvil) a repasar una vez tienes el sitio web listo.

Para los emailings:

¡Y hasta aquí por hoy!

Comparte… ¡o no!
Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedIn

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *