Jon Parro

entusiasta 2.0

Formularios: alinear label y campos

Por Jon el 19 Julio 2009 2 comentarios

Al diseñar un formulario una de las primeras cuestiones importantes a tener en cuenta es la alineación de los label y los campos. A continuación voy a comentar las ventajas y desventajas de los distintos tipos de alineaciones.

1. Horizontal, label alineados a la izquierda.

La excesiva distancia entre un label y su campo correspondiente dificulta su relación y ralentiza la lectura, siendo esto un pequeño inconveniente. Sin embargo, a su vez esto puede resultar interesante para formularios con datos con los que el usuario no está familiarizado, ya que se le obliga a prestar mayor atención.

La alineación a la izquierda de los label permite predecir al usuario fácilmente dónde comienza el siguiente label, facilitando la lectura vertical.

2. Horizontal, label alineados a la derecha.

Mayor facilidad para relacionar label y su campo correspondiente gracias a estar ambos más juntos. De esta manera el formulario se rellena con mayor rapidez.

Se dificulta la lectura vertical debido a las diferentes longitudes de los label y que el usuario tiene que forzar la vista para ver dónde comienza el siguiente label.

3. Alineación vertical.

Al encontrarse label y su campo correspondiente muy juntos y en el mismo eje de visión, el usuario puede rellenar el campo prácticamente al mismo tiempo que lee el label, por lo tanto reduce el tiempo necesario para completar el formulario. Esto se acentúa si los datos a rellenar son fáciles y familiares para el usuario, en dónde casi no necesita pararse a leer los label.

En la parte negativa, está el hecho de que se necesita más espacio vertical.

En las alineaciones verticales es necesario jugar con los espacios, separando correctamente un label y su campo, del siguiente label.

Diseño de páginas de error 404 usables

Por Jon el 28 Noviembre 2008 Comenta!

A día de hoy se siguen viendo páginas de error 404 poco usables o útiles para las personas. La clave para diseñar correctamente una página de error 404 está precisamente en la palabra persona.

Las páginas de error 404 se  producen por llegar a una página que no existe en nuestra web, posiblemente porque el usuario ha llegado desde un enlace incorrecto (interno o externo) o bien porque el mismo usuario ha escrito mal la URL. En cualquier caso hay que personalizar esta página y proporcionar una alternativa al usuario para salir de ella.

Cuando en el primer párrafo decía que clave estaba en la palabra persona, me refería a que hay que hacer páginas de error 404 útiles y usables para las personas. Con ese objetivo doy las siguiente recomendaciones:

  1. Haz que el usuario entienda lo que ha pasado.
    Utiliza un lenguaje claro y sencillo, el usuario no sabe que el error se llama 404, ni lo sabe ni le importa, así que simplemente indícale que la página que buscaba no existe, sin tecnicismos.
  2. Ofrécele alternativas.
    El usuario ya sabe qué ha ocurrido un problema, ahora hay que darle soluciones. Puedes incluir un enlace a la página principal, al mapa web y ponerle una caja de búsqueda para que busque la información que necesite. Si lo ves necesario, incluso le puedes ofrecer enlaces a las 2-3 secciones más visitadas de tu web. También es interesante incluir un enlace al formulario de contacto.
  3. Haz tu página 404 sencilla.
    Muesta los mensajes de forma breve y clara, no incluyas demasiada información ni diseño gráfico sin sentido, simplemente utiliza la página para explicar el problema y llevarle rápidamente a otra sección de tu web.

Aunque tu página 404 sea muy usable, siempre es mejor que el usuario no llegue a estas páginas, ya que dan mala imagen, así que en la medida de lo posible corrige los errores.

Es posible que los errores 404 lleguen en muchas ocasiones de un mismo enlace o por alguna página que ya no exista, en esos casos podemos corregir ese error. Para ello tenemos que seguir pautas de errores mediante nuestro servicio de analítica web. Por ejemplo, si descubrimos que tenemos un enlace interno mal puesto lo podemos corregir sin probemas, o si existe un enlace externo mal puesto a una página nuestra, podemos hacer una redirección 301 a la página correcta.

Contenido, pasión y entusiasmo por Jon Parro
© Todos los derechos reservados.

¡Ah, y el theme lo he hecho yo solito!