Los usuarios no siempre lo saben todo

El día de hoy y con este tema se irá indicando que elementos ayudan a una persona a navegar y cuáles no. Asimismo, se intentará señalar que elementos ayudan a predecir al usuario su ocupación al presionar un enlace.Resumen:

  1. Manejen enlaces azules y botones del sistema. Ayuden a la persona a reconocer lo que es presionable y lo que no.
  2. Brinden al usuario la información requerida sobre donde esta y a donde puede ir de manera concisa.
  3. Brinda guías al usuario (1, 2 y 3).
  4. Los manuales que agravan la página tienen que señalar patentemente.
  5. Regulados de más a menos esos elementos que manifiestamente señalan acción al presionar y modificar de página.
    • Los enlaces en azul y los botones del sistema (no se agregan combos).
    • Los enlaces en otro color que no sea azul, derrochan parte de la llamada de enlace.
    • Los botones que no pertenecen al sistema. La pestaña quizás sea el ejemplo más dilatado pero hay otras opciones.
    • Enlaces sin subrayar que modifican el color o se subrayan al pasarlo por encima.
    • Fotos. La dimensión de una foto ayuda a que se pase por encima y se demuestre la opción de presionar. Otra opción que auxilia al usuario al presionar en las imágenes, es la realidad de que esté con borde. Ese borde poseerá el mismo color que los enlaces, por lo que auxiliara al usuario a reconocer el link.
    • Combos. El combo es un instrumento de selección, no de acción. Aun así no se encomienda ni para realizar selecciones. El combo no es una herramienta el cual se recomiende ya que, por lo general deja al usuario a medias, sin saber muy bien que pasa cuando presionan sobre él. Su manejo se recomienda en formularios u operaciones, pero jamás en navegación.
    • Texto o imágenes sin subrayar que no se modifican de color.

Con ese orden se recomienda que siempre se maneje enlaces azules y botones del sistema.
Como expresa el título de esa página, el usuario no es tonto, pero tampoco es brujo y será más sencillo para la navegación si se señala de forma clara que elementos poseen enlaces y cuáles no. Deben recordar que cuanto más sencillo lo pintes, más paginas cumplirán, más banners podrán ver, más productos apreciará.
Ejemplo de botones:
ejemplo de botones que ayudan al usuario a navegar
Esos botones, ordenados de izquierda a derecha, son un claro ejemplo de cómo realizar botones que funcionen.

  1. El cuadrado generará un área mayor de acierto para el usuario.
  2. El círculo asimismo da un área de cordura, pero es disminuido y el usuario se suele apoyar en los contornos.

Si no se pinta el aria de acierto, el usuario puede que apunte bien para acertar el botón.

Ejemplo de botonera ideal:
ejemplo de botonera que ayudan al usuario a navegar

  1. Se muestra de forma clara como indica el área donde se puede pinchar.
  2. El botón señala de forma clara que se puede pinchar al estar subrayado.
  3. La separación entre botones es minúscula impidiendo así zonas que no se pueden clicar.
  4. No se manejan iconos, no son útiles, no auxilian y solo quitan espacio.Hay temas en que los botones gráficos pesan menos que el código html. Eso es debido a un hecho justificado que entre el código y el peso de un gif indexado con solo 2 colores casi no hay discrepancia y asimismo proporcionará un área mayor de acierto. Esa opción, solo en caso de que el peso sea mínimo, solo se encarga para elementos fijos de la navegación que la persona pueda almacenar en su cache desde la primera página.