Joomla es muy flexible y ofrece muchas posibilidades. Una desventaja de trabajar con Joomla es que puede parecer complejo debido a todas las opciones de ajustes y navegación que ofrece. Para un especialista en Joomla esto no es un problema, pero para muchos usuarios finales puede ser un escollo en el camino. Agregar artículos a través de la parte pública del sitio (frontend) es usualmente una de las primeras tareas a la que se ve enfrentado el usuario final. Esta debiera ser una operación bastante siemple, pero muchos la experimentan como algo complejo.

Poniendo a prueba al usuario final

Quería ver y poner a prueba la experiencia del usuario final, por lo que instalé una instancia simple de Joomla 3 y le pedí a un usuario final, Julianne, su ayuda. Ella sabía lo que es Joomla!, pero nunca lo había usado anteriormente, le entregué su información de acceso al sitio y le pedí que realizara el siguiente ejercicio:

1. Iniciar sesión con los detalles entregados
2. Publicar un artículo en la página principal con título, texto, imagen y etiqueta.
3. Cerrar sesión

El siguiente video reproducido a 2x de velocidad revela el intento de Julianne de llevar a cabo la tarea propuesta, agregar título y texto se le hizo fácil, agregar la imagen y la etiqueta le resultó un poco más complejo, pero terminó con éxito el ejercicio propuesto.

Sin embargo, al guardar el artículo se creó su mayor confusión. El artículo no aparecía en la página principal, ¿dónde estaba entonces?, luego de unos cuantos clicks, los que incluso la llevaron hasta el backend, notó que la categoría no estaba seleccionada.

En total Julianne necesitó 8 minutos y 22 segundos para publicar el artículo. Nada mal realmente, pero eso debiera ser posible en menos tiempo.

Video posterior a las mejoras de usabilidad

El siguiente video también está reproducido a 2x de velocidad, es la ejecución del mismo ejercico, pero esta vez con una instalación de Joomla! personalizada en la que mejoré la usabilidad.

Esta vez Julianne necesito apenas 1 minuto y 29 segundos. Por supuesto, ya no era su primer encuentro con Joomla!, pero gracias a la mejora en la usabilidad, ella fue capaz de realizar el mismo ejercicio de forma mucho más rápida.

10 consejos para mejorar la usabilidad de Joomla!

Algunas cosas pueden resultar lógicas para nosotros como expertos en Joomla, pero pueden parecer incomprensibles para el usuario final, por lo tanto es bueno pensar desde la perspectiva del usuario final, incluso te puedes poner a observar desde atrás como lo está haciendo, eso me dió la inspiración para hacer las mejoras de usabilidad usadas en este caso.

1. Redirige a una página relevante luego de acceder al sitio

Por defecto el usuario es redirigido o redireccionado a su página de perfil una vez que ha iniciado sesión en el sitio web. En esta página aparecen una serie de diferentes opciones de ajuste al usuario, pero en su gran mayoría genera dudas.

En lugar de eso, es mejor establecer una redirección a una URL que sea relevante, por ejemplo, redireccionar a la página para crear un nuevo artículo en caso que esa sea la razón principal para acceder al sitio web.

2. Mantenlo simple, estúpido! (Principio KISS)

Trata de ocultar o inhabilitar todo lo que no sea relevante para ese sitio web, mientras menos sean las opciones que tenga el usuario, más simple será. Aseguúrate que lo que permanezca visible no le cause confusión.

¿Tienes un item de menú “Iniciar sesión” (Login) en tu website? Entonces asegúrate que este item de menú dejó de ser visible una vez que el usuario inició sesión y en su lugar muestra un item de menú “Cerrar sesión” (Logout).

Esto es muy simple de conseguir si usas el nivel de acceso “Invitado” (Guest) en Joomla. Si se establece para un Item de menú, artículo o módulo, será visible solo para usuarios que no hayan iniciado sesión en el sitio web.

3. Haz uso de la configuración de Joomla!

Demasiadas configuraciones en Joomla! podrían ser una desventaja, pero puedes usarlas para mejorar la usabilidad del usuario final, la configuración de la “Duración de la sesión” puede ocasionar bastante frustración, imagínate que el usuario final está trabajando en un artículo por un periodo de tiempo mayor a la duración de la sesión, cuando guarde su artículo, recibirá el error de “Primero inicie sesión” debido a que el tiempo expiró, con todo lo que ello implica. Incrementa la configuración a 60 minutos por ejemplo.

Otro ejemplo es configurar una categoría por defecto para los artículos que se agregen desde la parte pública (frontend) del sitio. ¿Hay solo 1 usuario autorizado a publicar artículos en la categoría “Blog”?, entonces configura esta categoría por defecto en los ajustes del item de menú, de esta forma evitarás que que los artículos sean agregados a áreas no visibles de tu sitio web.

4. Reduce las opciones del editor de texto

El editor TinyMCE que viene configurado por defecto en Joomla posee demasiadas opciones para dar formato a un artículo en Joomla, usualmente son demasiadas. Para solucionar esto, muchos prefieren usar un editor de texto diferente.

Pero, ¿Sabías que el editor de texto TinyMCE en Joomla también posee bastantes opciones de configuración? El editor de texto TinyMCE es un plugin, si abres el plugin desde el gestor de plugins puedes establecer el ajuste de “Funcionalidad” a “Simple”, de esa forma solo se verán las opciones más básicas disponibles para dar formato a un texto.

5. Haz los Grupos de Usuarios y los Niveles de Acceso comprensibles

Cada sitio web basado en Joomla posee varios grupos de usuarios y niveles de acceso que viene por defecto con la instalación. Usualmente muchos de ellos son no requieren ser usados y pueden ser removidos de forma segura.

Los grupos de usuarios y niveles de acceso que queden, pueden ser renombrados por conceptos más entendibles, “Administrador” es más comprensible que “Super usuario”, “Blogeros” en lugar de “Especial”, sobre todo si se trata de personas no-Joomla las que estarán trabajando con el sitio web, después de todo, es mucho más comprensible si un artículo es visible para “Blogueros” en lugar de “Especial”.

6. Aléjate de las confusiones, no des accesos innecesarios

Jomla posee un avanzado sistema de permisos (ACL) el que te permite configurar exactamente las acciones que cada grupo de usuarios puede ejecutar. Esta acciones vienen configuradas por defecto, pero son completamente personalizables.

Gracias a este ACL tu puedes permitirle a alguien acceder solo a áreas determinadas y ejecutar solo ciertas tareas. Por un lado esta solución evita cambios no deseados y por otro lado evitamos que el usuario se confunda con opciones irrelevantes.

7. Utiliza la sobreescritura de idioma para hacerlo más comprensible

Una forma muy simple, pero muy poderosa a la vez de mejorar la usabilidad de Joomla es la sobreescritura del lenguaje. Todo el sistema de textos y etiquetas está almacenado en archivos de idioma, a través del Gestor de Idiomas de Joomla tu puedes fácilmente sobreescribir las constantes idiomáticas para que sean más relevantes al sitio web.

¿Es la etiqueta “Acceso” de un artículo lo no suficientemente clara?, prueba cambiándola por “Visible para”. Otro ejemplo sería cambiar la etiqueta “Unpublished” por “En desarrollo...”, es un concepto más simple de entender para muchas personas mientras están en el proceso de escribir o complementar contenidos. Incluso, tu puedes agregar tus propias constantes de idioma en caso que sea necesario.

8. Modifica la visual del sitio a través de la sobreescritura de plantillas

La sobreescritura de plantillas es más compleja que la sobreescritura de idioma, pero te permite una completa personalización para visualizar la información sin que tengas que realizar cambios al código de core de Joomla, de esta forma puedes o bien remover funcionalidades que no sean necesarias o agregar nuevas funcionalidades.

Con Joomla 3 generar la sobreescritura de plantillas es mucho más simple, cuando editas una plantilla desde el gestor de plantillas verás una nueva pestaña llamada “Create Overrides”, en esta pestaña solo debes hacer click sobre la carpeta que desees sobreescribir y esta carpeta se generará automáticamente para que puedas hacer todos los ajustes que quieras.

9. Optimiza tu sitio con CSS y JavaScript

Incluso con CSS y JavaScript tu puedes mejorar la usabilidad. Casi todos los elementos de Joomla al ser visualizados usan sus propias clases, tu puedes aplicar estilos o efectos a cada uno de estos elementos.

También puedes utilizar CSS para mostrar el campo de entrada del título, en el formulario de envío de artículos, más grande y agregar adicionalmente un marcador de posición con JavaScript, así como también puedes simplemente ocultar ciertas etiquetas y campos con CSS.

10. Divide los campos de ingreso de los artículos

Aquellos que llevan usando Joomla por un largo tiempo reconocerán de inmediato esta situación: las imágenes que son agregadas a los artículos por los usuarios. Apenas te das cuenta y ya hay una imagen de 2000 px de ancho dentro de un artículo y totalmente mal alineada, generando que el sitio web se vea horrible y totalmente fuera de contexto.

Afortunadamente, ahora el usuario puede seleccionar la imagen a través de un campo separado. Si tu template permite esta funcionalidad, entonces la imagen se mostrará con consistencia en su forma y lugar, esto hace que sea mucho más simple para el usuario mantener el orden del sitio web.

No me pidas que piense

El punto de partida de la mejora y optimización a la usabilidad es "No me pidas que piense" (del libro "Don't make me think” cuyo autor es Steve Krug), debes prevenir que usuarios se enfrentes a la duda, a la búsqueda, a trabajar con estructuras poco consistentes y tomar desiciones que no son necesarias.

Sobreescritura de la plantilla para la vista de la Creación de Artículos

En este caso, una sobreescritura a la plantilla para la visualización de la creación o edición de un artículo fue usada como ejemplo. Todos los consejos mencionados en este artículo fueron aplicados a esta sobreescritura de la plantilla.

¿Puedo usar esta sobreescritura?

¡Por supuesto! El código completo de esta sobreescritura a la plantilla puede ser encontrado aquí: https://gist.github.com/sanderpotjer/5488c2a10dceeee7db7d.

A través del gestor de plantillas crea una nueva sobreescritura para el com_content -> form o crea un nuevo archivo en tu directorio de sobreescrituras: templates/template-name/html/com_content/form/edit.php. Copia y pega el código de esta sobreescritura a tu plantilla en este archivo y personalízalo tanto como quieras.

¡Disfruta mejorando la usabilidad de tus sitios web!

Artículo Original

Esta es una traducción y adaptación del artículo original en inglés "Creating an Article in Joomla! Has Never Been This Easy!", escrito por Sander Potjer y publicado en la Joomla! Community Magazine edición de Septiembre 2014.