10 de Marzo, 2006

Yahoo! Design Pattern Library

Hace cosa de un mes que Yahoo! lanzó una biblioteca de patrones de diseño, que se pueden consultar en base a las necesidades del usuario o a requerimientos de la aplicación.

Son patrones de diseño, así que nadie espere encontrar código (confusión habitual a primera vista, para código ya está la Yahoo! UI Library). ¿Qué es entonces un patrón de diseño? Según Yahoo!, con traducción libre mía:

Un patrón describe una solución óptima para un problema común en un contexto específico.

Hay una explicación bastante clara, por si aún quedan dudas.

Como ejemplo podemos ver la navegación por pestañas:

Navigation Tabs
Mi implementación de pestañas de navegación

Estudiando el elemento según Yahoo!, con otra traducción libre mía:

  • Las pestañas aportan contexto. Dan al usuario una indicación visual de dónde se encuentra.
  • Las pestañas son fácilmente identificables. Coinciden con un elemento del mundo real que el usuario conoce: las carpetas de un archivo. El aspecto de las pestañas seleccionadas refuerza eso.
  • Las pestañas permiten navegar, y es fácil desplazarse por las opciones.

En este caso funcionan muy bien, el usuario se maneja de forma muy intuitiva, permitiendo al desarrollador presentar un menú en dos niveles (la pestaña seleccionada arriba muestra las sub-opciones abajo).

Cualquiera que lleve un tiempo desarrollando web seguramente ya se habrá enfrentado a muchos de los problemas descritos, aunque es curioso ver las propuestas... porque casi siempre tienen toda la razón y, al menos yo, he implementado alguna solución que queda lejos de ser la solución óptima ;).

Muy recomendable echarle un vistazo, para aclarar ideas de cara a futuros proyectos.

Anotación por Juan J. Martínez.

Los comentarios están cerrados: los comentarios se cierran automáticamente una vez pasados 30 días. Si quieres comentar algo acerca de la anotación, puedes hacerlo por e-mail.