it-swarm-es.com

Posición de la etiqueta del formulario para una mejor usabilidad

Estoy creando un formulario que le preguntará a un visitante su firstname, middle initial y lastname. Quiero que esos campos de texto estén todos en línea, pero ¿dónde debo colocar las etiquetas? A la izquierda, arriba o debajo de los campos.

Estoy buscando el mejor enfoque desde el punto de vista de la usabilidad.

16
Shane Stillwell

Echa un vistazo a este estudio de UXmatters . Es bastante profundo, incluye datos sobre seguimiento ocular y concluye que las etiquetas en la parte superior son en general la mejor solución.

Hay n artículo similar de Luke Wroblewski , también bastante detallado. ¡Vale la pena leer ambos artículos!

10
Grant Palin

Lo más importante es ser coherente con el resto de su sitio. En general, la mayoría de los sitios web hacen las etiquetas a la izquierda de los campos de texto. En esta causa, sería una descripción larga, así que asegúrese de tener espacio y que fluya bien.

Si a la izquierda no se ve bien o no hay espacio para hacerlo, entonces lo haría arriba. Como eso está muy claro.

El único método que evitaría es colocar las etiquetas debajo de los campos de texto. cuando las etiquetas están debajo de los campos es más confuso.

5
Ben Hoffman

Normalmente, para su situación, en la parte superior o a la izquierda es mejor. Solo asegúrese de que la etiqueta aparezca antes del campo de entrada para accesibilidad.

Todavía hay muchas formas diferentes de diseñar una página y ser accesible.

Las etiquetas de formulario realmente pueden aparecer casi en cualquier lugar que desee, siempre que lo haga desde entonces. Vale la pena echar un vistazo a este recurso http://patterntap.com/tap/collection/forms

4
Kevin

Hay dos opciones que se consideran mejores:

  • etiquetas a la izquierda del campo, enjuagadas a la derecha para que estén cerca de la entrada.
  • etiquetas sobre el campo en sí

otra cosa importante a tener en cuenta para la usabilidad es asegurarse de que está utilizando el atributo for de la etiqueta, de modo que al hacer clic en la etiqueta se centra en el campo que etiqueta.

3
GSto

Respuesta: ninguna de las anteriores. Use marcador de posición texto dentro del campo mismo. El atributo de marcador de posición es una parte integrada de HTML-5.

De lo contrario, diría que lo coloques sobre los campos, alineados a la izquierda.

1
Adam L Davis

Esto es un poco tangente, pero no utilice nombre/apellido/inicial. No todos los nombres pertenecen a esa ordenada agrupación.

Citando a mí mismo en StackOverflow:

Muchas culturas asiáticas ponen el nombre de la familia primero, porque la familia se considera más importante que el individuo.

Al notar que hay un buen número de personas que usan un nombre que no es el que les dieron sus padres, he usado el siguiente esquema con cierto éxito:

Nombre completo (como se escribe normalmente para direccionar correo); Apellido; Conocido como (el nombre comúnmente usado en la conversación).

P.ej.:

Nombre completo: William Gates III; Apellido: Gates; Conocido como: Bill

Nombre completo: Soong Li; Apellido: Soong; Conocido como: Lisa

Ver https://stackoverflow.com/questions/259634/splitting-a-persons-name-into-forename-and-surname/259694#259694 para más.

0
Bevan