Texto de la interfaz de usuario

Artículo
10/19/2022
Tiempo de lectura: 28 minutos

Nota

Esta guía de diseño se creó para Windows 7 y no se ha actualizado para las versiones más recientes de Windows. Gran parte de las instrucciones todavía se aplican en principio, pero la presentación y los ejemplos no reflejan nuestra guía de diseño actual.

El texto de la interfaz de usuario aparece en las superficies de la interfaz de usuario. Este texto incluye etiquetas de control y texto estático:

Las etiquetas de control identifican los controles y se colocan directamente en los controles o junto a los controles.
Texto estático, que se denomina porque no forma parte de un control interactivo, proporciona a los usuarios instrucciones detalladas o explicaciones para que puedan tomar decisiones informadas.

Nota: Las directrices relacionadas con el estilo y el tono, las fuentes y las etiquetas de control de comon se presentan en artículos independientes.

Patrones de uso

El texto de la interfaz de usuario tiene varios patrones de uso:

Uso	Descripción
Texto de la barra de título use el texto de la barra de título para identificar una ventana o el origen de un cuadro de diálogo.	En este ejemplo, el texto de la barra de título identifica una ventana.
Instrucciones principales use la instrucción principal destacada para explicar concisamente qué hacer en la ventana o página.	La instrucción debe ser una instrucción específica, una dirección imperativa o una pregunta. Las buenas instrucciones principales comunican el objetivo del usuario en lugar de centrarse solo en manipular la interfaz de usuario. En este ejemplo, el texto de la instrucción principal interactúa directamente con el usuario con una pregunta en términos de beneficio o interés del usuario.
Instrucciones complementarias cuando sea necesario, use una instrucción complementaria para presentar información adicional útil para comprender o usar la ventana o la página.	Puede proporcionar información más detallada, proporcionar contexto y definir terminología. Las instrucciones complementarias se elaboran sobre la instrucción principal sin simplemente volver a formular su redacción. En este ejemplo, las instrucciones complementarias proporcionan dos posibles cursos de acción que se realizarán en respuesta a la información presentada en la instrucción principal.
Etiquetas de control etiquetas directamente en o junto a controles.	En este ejemplo, las etiquetas de control identifican la configuración del reloj de escritorio que los usuarios pueden seleccionar o modificar.
Explicaciones complementarias una elaboración de las etiquetas de control (normalmente para vínculos de comandos, botones de radio y casillas).	En este ejemplo, las explicaciones complementarias aclaran las opciones.

Conceptos de diseño

A menudo, los desarrolladores de software piensan en texto como relegados a la documentación del producto y al soporte técnico. "Primero escribiremos el código y, a continuación, contrataremos a alguien para ayudarnos a explicar lo que hemos desarrollado". Sin embargo, en realidad, el texto importante se escribe anteriormente en el proceso, ya que la interfaz de usuario se ha concebido y codificado. Este texto es, después de todo, visto con más frecuencia y por más personas que tal vez cualquier otro tipo de escritura técnica.

El texto comprensible es fundamental para una interfaz de usuario eficaz. Los escritores y editores profesionales deben trabajar con desarrolladores de software en texto de la interfaz de usuario como parte integral del proceso de diseño. Hacer que funcionen con texto temprano porque los problemas de texto a menudo revelan problemas de diseño. Si su equipo tiene problemas para explicar un diseño, a menudo es el diseño, no la explicación, que necesita mejorar.

Un modelo de diseño para el texto de la interfaz de usuario

A medida que piense en el texto de la interfaz de usuario y su colocación en las superficies de la interfaz de usuario, tenga en cuenta estos hechos:

Durante la lectura inmersiva, las personas leen en un orden de izquierda a derecha y de arriba abajo (en las culturas occidentales).
Al usar software, los usuarios no se sumergen en la propia interfaz de usuario, sino en su trabajo. Por lo tanto, los usuarios no leen el texto de la interfaz de usuario que examinan.
Al examinar una ventana, es posible que los usuarios parezcan leer texto cuando en realidad lo están filtrando. A menudo no comprenden realmente el texto de la interfaz de usuario a menos que perciban la necesidad de hacerlo.
Dentro de una ventana, los distintos elementos de la interfaz de usuario reciben distintos niveles de atención. Los usuarios tienden a leer primero las etiquetas de control, especialmente aquellas que parecen relevantes para completar la tarea a mano. Por el contrario, los usuarios tienden a leer texto estático solo cuando creen que necesitan.

En el caso de un modelo de diseño general, no suponga que los usuarios lean cuidadosamente el texto en un orden de izquierda a derecha y de arriba abajo. En su lugar, supongamos que los usuarios comienzan por examinar rápidamente toda la ventana y, a continuación, leer texto de la interfaz de usuario en aproximadamente el orden siguiente:

Controles interactivos en el centro
Botones de confirmación
Controles interactivos encontrados en otro lugar
Instrucción principal
Explicaciones complementarias
Título de la ventana
Otro texto estático en el cuerpo principal
Notas al pie

También debe suponer que una vez que los usuarios han decidido qué hacer, dejarán de leerlo y lo harán inmediatamente.

Eliminación de la redundancia

El texto redundante no solo toma un espacio de pantalla valioso, sino que debilita la eficacia de las ideas o acciones importantes que intenta transmitir. También es un desperdicio del tiempo del lector, y todo más en un contexto en el que el examen es la norma. Windows se esfuerza por explicar lo que los usuarios deben hacer una vez bien y concisamente.

Revise cada ventana y elimine palabras e instrucciones duplicadas, tanto dentro como entre controles. No evite texto importante; sea explícito siempre que sea necesario, pero no sea redundante y no explique lo obvio.

Evitar la comunicación excesiva

Incluso si el texto no es redundante, simplemente puede ser demasiado wordy en un esfuerzo para explicar cada detalle. Demasiado texto desalenta la lectura; el ojo tiende a omitirse hacia la derecha sobre ella, lo que da lugar a menos comunicación en lugar de más. En el texto de la interfaz de usuario, comunique concisamente la información esencial. Si es necesario obtener más información para algunos usuarios o algunos escenarios, proporcione un vínculo a contenido de ayuda más detallado, o quizás a una entrada del glosario para aclarar un término.

Incorrecto:

captura de pantalla del cuadro de diálogo con 6 párrafos

En este ejemplo, hay demasiado texto para escanear fácilmente. Aunque el diseñador no está pensado, hay tanto texto que los usuarios probablemente harán clic en Siguiente sin leer nada.

Para evitar texto que desaconseja la lectura, cree el texto para hacer que cada recuento de palabras. Lo que no agrega resta, así que use texto simple y conciso.

Uso de la pirámide invertida

La escritura académica utiliza normalmente un estilo estructural "piramidal" que establece una base de hechos, trabaja con esos hechos y se construye hasta una conclusión que forma una estructura de tipo piramidal. Por el contrario, los periodistas utilizan un estilo "pirámide invertida" que comienza con la conclusión como la "conclusión" fundamental que los lectores deben tener. A continuación, rellena progresivamente más detalles que los lectores pueden estar interesados en tal vez solo para escanear. La ventaja de este estilo es que llega directamente al punto, y permite a los lectores dejar de leer en cualquier momento que elijan y aún comprendan la información esencial.

Debe aplicar la estructura piramidal invertida al texto de la interfaz de usuario. Acceda directamente al punto con la información esencial, permita a los usuarios dejar de leer en cualquier momento que elijan y usar un vínculo de Ayuda para presentar el resto de la pirámide.

captura de pantalla del mensaje al unirse al programa de Windows

En este ejemplo, la información esencial se encuentra en la consulta del texto de la instrucción principal, la información útil adicional se encuentra en las instrucciones complementarias y los detalles están disponibles haciendo clic en un vínculo de Ayuda.

Si haces solo cinco cosas...

Trabajar en texto temprano porque los problemas de texto a menudo revelan problemas de diseño.
Diseñe el texto para examinarlo.
Elimine el texto redundante.
Usar texto fácil de entender; no se comuniquen por encima.
Cuando sea necesario, proporcione vínculos al contenido de ayuda para obtener información más detallada.

Directrices

General

Quitar texto redundante. Busque texto redundante en títulos de ventana, instrucciones principales, instrucciones complementarias, áreas de contenido, vínculos de comandos y botones de confirmación. Por lo general, deje el texto completo en las instrucciones principales y los controles interactivos, y quite cualquier redundancia de los demás lugares.
Evite bloques grandes de texto de la interfaz de usuario. Entre las formas de hacerlo se incluyen las siguientes:
- Fragmentación de texto en frases y párrafos más cortos.
- Cuando sea necesario, proporcionar vínculos de Ayuda a información útil, pero no esencial.
Elija nombres de objeto y etiquetas que comuniquen claramente y diferencien lo que hace el objeto. Los usuarios no deben tener que averiguar qué significa realmente el objeto o cómo difiere de otros objetos.

Incorrecto:

Mejor:

En el ejemplo incorrecto, los nombres de objeto no se diferencian en absoluto; en el mejor ejemplo se muestra una diferenciación fuerte por nombre de producto.
Si desea asegurarse de que los usuarios lean texto específico relacionado con una acción, colóquelo en un control interactivo.
- Aceptable:
- En este ejemplo, existe la posibilidad de que los usuarios no lean el texto que explica lo que están confirmando.
- Mejor:
- En este ejemplo, puede estar seguro de que al menos los usuarios entienden que están a punto de dar formato a un disco.
Use un espacio entre oraciones. No dos.

Fuentes de texto, tamaños y colores

Use texto azul solo para vínculos e instrucciones principales.
Use texto verde solo para las direcciones URL en los resultados de la búsqueda.

Las siguientes fuentes y colores son valores predeterminados para Windows.

Patrón	Símbolo del tema	Fuente, color
	CaptionFont	9 pt. negro (#000000) Segoe UI
	MainInstruction	12 pt. azul (#003399) Interfaz de usuario de Segoe
	Instrucción	9 pt. negro (#000000) Segoe UI
	BodyText	9 pt. negro (#000000) Segoe UI
	BodyText	9 pt. negro (#000000) Segoe UI, negrita o cursiva
	BodyText	9 pt. negro (#000000) Segoe UI, en un cuadro
	Disabled	9 pt. gris oscuro (#323232) Interfaz de usuario de Segoe
	HyperLinkText	9 pt. azul (#0066CC) Segoe UI
	Acceso frecuente	9 pt. azul claro (#3399FF) Segoe UI
		11 pt. azul (#003399) Interfaz de usuario de Segoe
		11 pt. negro (#000000) Segoe UI
	(ninguno)	9 pt. negro (#000000) Calibri
	(ninguno)	17 pt. negro (#000000) Calibri

Para obtener más información y ejemplos, vea Fuentes y colores.

Otras características de texto

Negrita

Use negrita con moderación para llamar la atención a los usuarios de texto que deben leer. Por ejemplo, los usuarios que examinan una lista de opciones de botón de radio pueden apreciar ver las etiquetas en negrita para destacar del texto que agrega información complementaria sobre cada opción. Tenga en cuenta que el uso de demasiada negrita reduce su impacto.
Con los datos etiquetados, use negrita para resaltar lo que sea más importante para los datos en su conjunto.
- Para datos principalmente genéricos (donde los datos tienen poco significado sin sus etiquetas, como con números o fechas), use etiquetas en negrita y datos sin formato para que los usuarios puedan examinar y comprender más fácilmente los tipos de datos.
- Para la mayoría de los datos autoexplicativos, use etiquetas sin formato y datos en negrita para que los usuarios puedan centrarse en los propios datos.
- Como alternativa, puede usar texto gris oscuro para desacentar la información menos importante en lugar de usar negrita para resaltar la información más importante.
  
  En este ejemplo, en lugar de resaltar los datos con negrita, las etiquetas se desmarcan mediante gris oscuro.
No todas las fuentes admiten negrita, por lo que nunca debe ser fundamental comprender el texto.

Cursiva

Use para hacer referencia al texto literalmente. No use comillas para este propósito.

Correcto:

Los términos documento y archivo se usan a menudo indistintamente.
Use para solicitudes en cuadros de texto y listas desplegables editables.

En este ejemplo, el símbolo del sistema en el cuadro Buscar tiene el formato de texto cursiva.
Use con moderación para resaltar palabras específicas para ayudar a comprender.
No todas las fuentes admiten cursiva, por lo que nunca debe ser fundamental comprender el texto.

Cursiva en negrita

No use en el texto de la interfaz de usuario.

Subrayar

No use, excepto los vínculos.
No use para el énfasis. En su lugar, use cursiva.

Signos de puntuación

Puntos

No coloque al final de las etiquetas de control, las instrucciones principales ni los vínculos de Ayuda.
Coloque al final de instrucciones complementarias, explicaciones complementarias o cualquier otro texto estático que forme una oración completa.

Signos de interrogación

Coloque al final de todas las preguntas. A diferencia de los puntos, los signos de interrogación se usan para todos los tipos de texto.

Signos de exclamación

En las aplicaciones empresariales, evite.
- Excepciones: A veces, los puntos de exclamación se usan en el contexto de finalización de la descarga ("Listo!") y para llamar la atención al contenido web ("Nuevo!").

Comas

En una lista de tres o más elementos, coloque siempre una coma después del elemento siguiente a último de la lista.

Colones

Use dos puntos al final de las etiquetas de control externo. Esto es especialmente importante para la accesibilidad, ya que algunas tecnologías de asistencia buscan dos puntos para identificar las etiquetas de control.
Use dos puntos para introducir una lista de elementos.

Elipses

Los puntos suspensivos significan integridad. Use puntos suspensivos en el texto de la interfaz de usuario de la siguiente manera:
- Comandos: Indique que un comando necesita información adicional. No use puntos suspensivos cada vez que una acción muestre otra ventana solo cuando se requiera información adicional. Para obtener más información, vea Botones de comando.
- Datos: Indique que el texto está truncado.
- Etiquetas: Indique que una tarea está en curso (por ejemplo, "Buscando...").
  
  Propina: El texto truncado en una ventana o página con espacio sin usar indica un diseño deficiente o un tamaño de ventana predeterminado demasiado pequeño. Busque diseños y tamaños de ventana predeterminados que eliminen o reduzcan la cantidad de texto truncado. Para obtener más información, vea Diseño.
No hagas puntos suspensivos interactivos. Para mostrar texto truncado, permita a los usuarios cambiar el tamaño del control para ver más texto o usar un control de divulgación progresiva en su lugar.

Comillas y apóstrofos

Para hacer referencia al texto literalmente, use formato cursiva en lugar de comillas.
Coloque los títulos de ventana y las etiquetas de control entre comillas solo si es necesario para evitar confusiones y no puede dar formato al uso de negrita en su lugar.
Para comillas, se prefieren comillas dobles (" "); evite comillas simples.

Correcto:

¿Confirma que desea eliminar la carpeta cat de Sparky?

Incorrecto:

¿Está seguro de que desea eliminar la carpeta cat de Sparky?

Uso de mayúsculas

Use mayúsculas de estilo de título para títulos, mayúsculas de estilo de oración para todos los demás elementos de la interfaz de usuario. Esto es más adecuado para el tono de Windows.
- Excepción: En el caso de las aplicaciones heredadas, puede usar mayúsculas de estilo título para botones de comandos, menús y encabezados de columna si es necesario para evitar mezclar estilos de mayúsculas.
En este ejemplo genérico se muestran las mayúsculas y minúsculas correctas para las hojas de propiedades.

En este ejemplo genérico se muestran las mayúsculas y minúsculas correctas para los diálogos.
Para los nombres de características y tecnología, sea conservador en mayúsculas. Normalmente, solo los componentes principales deben incluirse en mayúsculas (con mayúsculas de estilo de título).

Correcto:

Analysis Services, cubos, dimensiones

Analysis Services es un componente principal de SQL Server, por lo que la capitalización de estilo de título es adecuada; los cubos y dimensiones son elementos comunes del software de análisis de bases de datos, por lo que no es necesario capitalizarlos.
En el caso de los nombres de características y tecnología, sea coherente en mayúsculas. Si el nombre aparece más de una vez en una pantalla de interfaz de usuario, siempre debería aparecer de la misma manera. Del mismo modo, en todas las pantallas de la interfaz de usuario del programa, el nombre debe presentarse de forma coherente.
No escriba mayúsculas los nombres de elementos genéricos de la interfaz de usuario, como la barra de herramientas, el menú, la barra de desplazamiento, el botón y el icono.
- Excepciones: Barra de direcciones, Barra de vínculos.
No use todas las letras mayúsculas para las teclas de teclado. En su lugar, siga la mayúscula que usan los teclados estándar o minúsculas si la tecla no está etiquetada en el teclado.

Correcto:

barra espaciadora, Tab, Entrar, Subir página, Ctrl+Alt+Supr

Incorrecto:

BARRA ESPACIADORA, TAB, ENTRAR, PG UP, CTRL+ALT+SUPR
No use todas las letras mayúsculas para el énfasis. Los estudios han demostrado que esto es difícil de leer, y los usuarios tienden a considerarlo como "gritando". Para las advertencias, use un icono de advertencia y una explicación clara de la situación. No es necesario agregar, por ejemplo, el término WARNING en todas las letras mayúsculas.

Para obtener más información, consulte la sección "Texto" o "Etiquetas" en las directrices específicas del componente de interfaz de usuario.

Fechas y horas

No codifique de forma rígida el formato de fechas y horas. Respeta la elección de la configuración regional y las opciones de personalización del usuario para los formatos de fecha y hora. El usuario selecciona estos elementos en el elemento del panel de control Región y idioma.

En estos ejemplos de Microsoft Outlook, ambos formatos para la fecha larga son correctos. Reflejan diferentes opciones que los usuarios han realizado en el elemento del panel de control región y idioma.
Use el formato de fecha larga para escenarios que se benefician de tener información adicional. Use el formato de fecha corta para contextos que no tengan suficiente espacio para el formato largo. Aunque los usuarios eligen qué información desea incluir en los formatos largos y cortos, los diseñadores eligen el formato que se va a mostrar en sus programas en función del escenario y del contexto.

En este ejemplo, el formato de fecha larga ayuda a los usuarios a organizar tareas y fechas límite.

Globalización y localización

La globalización significa crear documentos o productos que se puedan usar en cualquier país, región o cultura. La localización significa adaptar documentos o productos para su uso en una configuración regional distinta del país o región de origen. Considere la globalización y la localización al escribir texto de la interfaz de usuario. Tu programa puede traducirse a otros idiomas y usarse en culturas muy diferentes de tu propia.

Para los controles con contenido variable (como vistas de lista y vistas de árbol), elija un ancho adecuado para los datos válidos más largos.
Incluya espacio suficiente en la superficie de la interfaz de usuario para un 30 % adicional (hasta un 200 % para texto más corto) para cualquier texto (pero no números) que se localice. La traducción de un idioma a otro suele cambiar la longitud de línea del texto.
No cree cadenas de subcadenas en tiempo de ejecución. En su lugar, use oraciones completas para que no haya ambigüedad para el traductor.
No use un control subordinado, los valores que contiene o su etiqueta de unidades para crear una frase o frase. Este diseño no es localizable porque la estructura de oraciones varía con el lenguaje.

Incorrecto:

Correcto:

En el ejemplo incorrecto, el cuadro de texto se coloca dentro de la etiqueta de casilla.
No convierta solo una parte de una frase en un vínculo, ya que, cuando se traduce, es posible que ese texto no permanezca juntos. Por lo tanto, el texto del vínculo debe formar una oración completa por sí misma.
- Excepción: Los vínculos del glosario se pueden insertar insertados, como parte de una oración.

Para obtener más información, consulte el Centro para desarrolladores globales de Go.

Texto de la barra de título

Elija el texto de la barra de título en función del tipo de ventana:
- Ventanas de programa centradas en documentos de nivel superior: Use un formato de "nombre de programa de nombre de documento". Los nombres de documento se muestran primero para dar una sensación centrada en documentos.
- Ventanas de programa de nivel superior que no están centradas en documentos: Mostrar solo el nombre del programa.
- Cuadros de diálogo: Muestra el comando, la característica o el programa desde el que vino el cuadro de diálogo. No use el título para explicar el propósito del cuadro de diálogo que es el propósito de las instrucciones principales. Para obtener más instrucciones, consulte Cuadros de diálogo.
- Asistentes: Muestra el nombre del asistente. Tenga en cuenta que la palabra "wizard" no debe incluirse en los nombres del asistente. Para obtener más instrucciones, consulte Asistentes.
Para las ventanas de programa de nivel superior, si el título y el icono de la barra de título se muestran de forma destacada cerca de la parte superior de la ventana, puede ocultar el título y el icono de la barra de título para evitar redundancia. Sin embargo, todavía tiene que establecer un título adecuado internamente para su uso por Parte de Windows.
Para los cuadros de diálogo, no incluya las palabras "dialog" o "progress" en los títulos. Estos conceptos están implícitos y dejar estas palabras desactivadas hace que los títulos sean más fáciles de examinar para los usuarios.

Instrucciones principales

Use la instrucción principal para explicar concisamente lo que los usuarios deben hacer en una ventana o página determinada. Las buenas instrucciones principales comunican el objetivo del usuario en lugar de centrarse solo en manipular la interfaz de usuario.
Expresar la instrucción principal en forma de una dirección imperativa o una pregunta específica.

Incorrecto:

En este ejemplo, la instrucción principal simplemente indica el nombre del programa; no invita explícitamente a un curso de acción para que el usuario realice.

Excepciones: Los mensajes de error, los mensajes de advertencia y las confirmaciones pueden usar estructuras de oraciones diferentes en sus instrucciones principales.
Use verbos específicos siempre que sea posible. Los verbos específicos (ejemplos: conectar, guardar, instalar) son más significativos para los usuarios que los genéricos (ejemplos: configurar, administrar, establecer).
- En el caso de las páginas del panel de control y las páginas del asistente, si no puede usar un verbo específico, es posible que prefiera omitir el verbo por completo.
  
  Aceptable:
  
  Escriba la configuración regional, la región y el idioma.
  
  Mejor:
  
  Configuración regional, región e idioma
- En el caso de los diálogos, como los mensajes de error y las advertencias, no omita el verbo.
No se sienta obligado a usar texto de instrucción principal si agregarlo solo sería redundante o obvio desde el contexto de la interfaz de usuario.

En este ejemplo, el contexto de la interfaz de usuario ya está muy claro; no es necesario agregar texto de instrucción principal.
Use solo una frase completa y concisa. Pare la instrucción principal hasta la información esencial. Si debe explicar algo más, considere la posibilidad de usar una instrucción complementaria.
Use mayúsculas de estilo de frase.
No incluya puntos finales si la instrucción es una instrucción . Si la instrucción es una pregunta, incluya un signo de interrogación final.
En el caso de los diálogos de progreso, use una frase gerundia que explique brevemente la operación en curso y termine con puntos suspensivos. Ejemplo: "Imprimir sus imágenes..."
Propina: Puedes evaluar una instrucción principal imaginando lo que dirías a un amigo al explicar qué hacer con la ventana o página. Si responder con la instrucción principal sería poco natural, poco útil o incómodo, volver a trabajar la instrucción.

Para obtener más información, consulte la sección "Instrucción principal" en las directrices específicas del componente de interfaz de usuario.

Instrucciones complementarias

Cuando sea necesario, use una instrucción complementaria para presentar información adicional útil para comprender o usar la ventana o página, como:
- Proporcionar contexto para explicar por qué se muestra la ventana si se inicia el programa o el sistema.
- Información apta que ayuda a los usuarios a decidir cómo actuar sobre la instrucción principal.
- Definición de terminología importante.
No use una instrucción complementaria si no es necesario. Prefiere comunicar todo con la instrucción principal si puede hacerlo de forma concisa.
No repita la instrucción principal con palabras ligeramente diferentes. En su lugar, omita la instrucción complementaria si no hay nada más que agregar.
Use oraciones completas y mayúsculas de estilo de oración.

Etiquetas de control

Etiquete cada control o grupo de controles. Excepciones:
- Los cuadros de texto y las listas desplegables se pueden etiquetar mediante avisos.
- Por lo general, los controles de divulgación progresivas no están etiquetados.
- Los controles subordinados usan la etiqueta de su control asociado. Los controles de número siempre son controles subordinados.
- Omita las etiquetas de control que restan la instrucción principal. En este caso, la instrucción principal toma la clave de acceso.
  
  Aceptable:
  
  En este ejemplo, la etiqueta del cuadro de texto es simplemente una restamento de la instrucción principal.
  
  Mejor:
  
  En este ejemplo, se quita la etiqueta redundante, por lo que la instrucción principal toma la clave de acceso.
Colocación de etiquetas:
- Los globos, casillas, botones de comando, cuadros de grupo, vínculos, pestañas y sugerencias se etiquetan directamente mediante el propio control.
- Las listas desplegables, los cuadros de lista, las vistas de lista, las barras de progreso, los controles deslizantes, los cuadros de texto y las vistas de árbol se etiquetan encima, se vacían a la izquierda o a la izquierda.
- Normalmente, los controles de divulgación progresivas no están etiquetados. Los botones de botón de contenido adicional están etiquetados a la derecha.
Asigne una clave de acceso única para cada control interactivo , excepto para los vínculos. Para obtener más información, vea Teclado.
Mantenga las etiquetas breves. Sin embargo, tenga en cuenta que agregar una palabra o dos a una etiqueta puede ayudar a la claridad y, a veces, elimina la necesidad de explicaciones complementarias.
Prefiere etiquetas específicas sobre las genéricas. Lo ideal es que los usuarios no tengan que leer nada más para comprender la etiqueta.

Incorrecto:

Correcto:

En el ejemplo correcto, se usa una etiqueta específica para el botón confirmar.
Para obtener listas de etiquetas, como botones de radio, use expresiones paralelas e intente mantener la longitud aproximadamente igual para todas las etiquetas.
En las listas de etiquetas, centre el texto de la etiqueta en las diferencias entre las opciones. Si todas las opciones tienen el mismo texto introductorio, mueva ese texto a la etiqueta de grupo.

Incorrecto:

Correcto:

En el ejemplo correcto se mueve la expresión introductoria idéntica a la etiqueta, por lo que las dos opciones se diferencian más limpiamente.
En general, prefiere expresiones positivas. Por ejemplo, use do en lugar de no, y notifique en lugar de no notificar.
- Excepción: La etiqueta de casilla "No volver a mostrar este mensaje", se usa ampliamente.
Omita verbos informativos que se aplican a todos los controles del tipo especificado. En su lugar, centre las etiquetas en lo que es único sobre los controles. Por ejemplo, no dice que los usuarios necesitan escribir en un control de cuadro de texto o que los usuarios necesitan hacer clic en un vínculo.

Incorrecto:

Correcto:

En los ejemplos incorrectos, las etiquetas de control tienen verbos informativos que se aplican a todos los controles de su tipo.
En algunos casos, las siguientes anotaciones entre paréntesis para controlar etiquetas pueden ser útiles:
- Si una opción es opcional, considere la posibilidad de agregar "(opcional)" a la etiqueta.
- Si se recomienda encarecidamente una opción, agregue "(recomendado)" a la etiqueta. Si lo hace, significa que la configuración es opcional, pero debe establecerse de todos modos.
- Si una opción solo está pensada para usuarios avanzados, considere la posibilidad de agregar "(avanzado)" a la etiqueta.
Puede especificar unidades (segundos, conexiones, etc.) entre paréntesis después de la etiqueta.

En este ejemplo se muestra que la unidad de medida es megabytes (MB).