¿Cuál es la mejor manera de resaltar un campo obligatorio en un formulario web?

No me parece que el "*" utilizado frecuentemente sea muy atractivo, ¿alguien puede sugerir un método más agradable o señalarme un ejemplo?¿Cuál es la mejor manera de resaltar un campo obligatorio en un formulario web?

Intenté resaltar el campo en rojo como me sugirió una persona, pero no me gustó la apariencia.

Las etiquetas en negrita podrían hacer el truco.

Pero realmente me gusta la idea de que "Obligatorio" aparezca en gris en el campo hasta que se agregue texto. ¿Alguien tiene código para esto?

Fuente

2008-11-04 WPWoodJr

En términos generales, las mejores formas de la tela son los más simples que me obligan a pensar en lo más mínimo . El "estándar" que ha evolucionado es que los campos obligatorios tienen un asterisco (*) junto a ellos. A veces el asterisco es rojo para ayudar a que se destaque un poco.

¿Por qué luchar contra el estándar?No hagas que tus usuarios piensen demasiado. Vaya con el estándar y mantenga su creatividad para cosas más importantes.

Fuente

2008-11-04 19:27:23

A veces las normas no envejecen bien y, finalmente, se encuentran en extrema necesidad de modernización. Aunque sé que mucha gente no estará de acuerdo, sugiero que este estándar sea uno de ellos. El asterisco es viejo y feo, y podemos hacerlo mucho mejor. Es más trabajo, desde luego, pero sugiero que se conserve el asterisco, pero luego se oculta a través de secuencias de comandos del lado del cliente y se resalta el campo asociado con un color en su lugar, quizás amarillo, cuando está vacío. Piense en esos sofisticados campos de contraseña nuevos que actualizan un indicador de fortaleza a medida que lo crea. Algo como eso. – Mir

add style = "border: thin red solid;" para el elemento

Fuente

2008-11-04 18:52:43

funciona bien en la mayoría de los elementos, pero no funciona bien con un conjunto de botones de radio ... o una casilla de verificación (por ejemplo, estoy de acuerdo con el servicio de correo no deseado) – scunliffe

No estoy seguro de que el color transmita la intención correctamente tampoco. Red se parece demasiado a un mensaje de error, pero esto no es tal. Tal vez un borde verde alentaría a la gente a 'ir' a esos campos ... –

Ah, y delgada mostrada de manera muy diferente entre Mozilla e IE la última vez que revisé, por no decir que * no * quiero eso. –

Normalmente no tengo objeciones a ver (requerido) en una fuente más pequeña justo debajo del nombre del campo o junto al campo de entrada.

También podría ver el uso de una "marca de agua de cuadro de texto" para que el campo diga "requerido" hasta que traigan el foco al campo y empiecen a escribir.

Fuente

2008-11-04 18:52:53

¿Hay alguna forma sencilla de agregar texto gris como "Requerido" a un cuadro de texto, que desaparece al enfocar o requiere javascript? – WPWoodJr

Puedes hacerlo con hojas de estilo, pero necesitarías algo de javascript para intercambiar hojas de estilo una vez que el usuario haga clic en el campo de la caja de texto. –

Si usted va a utilizar el color para resaltar el campo, tener en cuenta que algunas personas son daltónicos (lo que tal vez proporcionar otro indicador también)

Fuente

2008-11-04 18:54:31 cagcowboy

he encontrado las respuestas en LukeW.com ser el más útil. porque no hay una solución simple aquí. Depende de qué porcentaje de los campos se requieren, cuántos campos hay en su formulario y cuánto tiempo son sus etiquetas. Para la gran mayoría de la web, las personas entienden que se requiere negrita y el peso normal es opcional (si alguna opción está en negrita). Solo después de que la validación del formulario falla, le presento al usuario los recuadros de entrada requeridos pero omitidos resaltados.

Fuente

2008-11-04 19:00:11

Si usa hojas de estilo para formatear su HTML, puede crear un estilo para .mandatory. Como ejemplo, establezca la entrada obligatoria para usar este estilo, luego puede jugar con él más fácilmente hasta que tenga la combinación correcta de color, borde y otros elementos de estilo que se adapten a su diseño general.

HTML

<input id="username" type="text" class="mandatory" />

CSS

.mandatory { 
    color: red; 
    font-size: 12pt; 
    font-weight: bold; 
    font-style: italic; 
}

También utilizo el asterisco como el PO mencionado como una "copia de seguridad".

-R

Fuente

2008-11-04 19:05:57 Huntrods

Implementaré esto como una clase y no como una implementación específica de id, ya que con id solo puedes hacer 1 elemento obligatorio –

Esto funciona pero lo único que tengo cuidado es hacer campos obligatorios rojos Y campos inválidos/de error rojos. Sería más confuso en ese caso ... –

Cambiar la respuesta para usar la clase en lugar de la identificación, o esto debería ser rechazado. –

posible que desee comprobar hacia fuera www.PeterBlum.com - Sus rocas Profesional paquete de validación para validar y el formato de los controles. Él tiene tutoriales para usar y numerosos ejemplos, así como un manual detallado.

Fuente

2008-11-04 19:19:06 silverbugg

No sé qué opciones de estilo están disponibles para esos validadores, pero debo decir que son algunos de los más feos validadores del lado del cliente que he visto. – scunliffe

me gusta la forma en que se lleva a cabo en el kit de herramientas de control de ASP.NET Ajax para el ValidatorCallout control:

alt text http://i37.tinypic.com/264j7o5.png

Fuente

2008-11-04 19:22:53 splattne

No me gusta porque no dice lo que se necesita hasta después de haber intentado enviar el formulario. Si todo lo que se requiere es una dirección de correo electrónico, entonces ese debería ser el único campo marcado como requerido ... ¿cómo está la pregunta? ;-) – scunliffe

A veces es realmente justificable marcar los campos como obligatorios y opcionales. Sin embargo, antes de hacerlo, debe preguntarse si es razonable preguntar al usuario cualquier información no obligatoria. Esto aplica especialmente en los formularios de registro.

En los formularios de registro y tal, es mucho mejor preguntar solamente la información mínima. Después del registro, el usuario puede, a voluntad, completar la información opcional en formularios separados.

Después de que todo el fragmento innecesario haya sido sacado del formulario, puede ver que no es necesario marcar los campos como obligatorios; o bien todo es obligatorio, o puede ser tan obvio para el usuario qué campos son opcionales, que no habría necesidad de dar pistas visuales al respecto.

Fuente

2008-11-04 19:55:23 smt

¿Cuál es la mejor manera de resaltar un campo obligatorio en un formulario web?

Respuesta

Cuestiones relacionadas