Iconos estándar

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.

Los iconos estándar son los iconos de error, advertencia, información y signo de interrogación que forman parte de Windows.

Los iconos estándar de error, advertencia, información e signo de interrogación.

Los iconos estándar tienen estos significados:

• Icono de error. La interfaz de usuario (UI) presenta un error o problema que se ha producido.
• Icono de advertencia. La interfaz de usuario presenta una condición que podría causar un problema en el futuro.
• Icono de información. La interfaz de usuario presenta información útil.
• Icono de signo de interrogación. La interfaz de usuario indica un punto de entrada de Ayuda.

Los iconos estándar son notables porque están integrados en muchas interfaces de programación de aplicaciones (API) Windows, como cuadros de diálogo de tareas, cuadros de mensaje, globos y notificaciones. También se usan normalmente en las barras de estado y mensajes en contexto.

Nota: Las directrices relacionadas con los iconos se presentan en un artículo independiente.

Conceptos de diseño

Hay varios factores para elegir el icono estándar adecuado que, en parte, explica por qué a menudo se usan incorrectamente. Los errores más comunes son:

• Usar un icono de advertencia para errores menores. Las advertencias no son errores "suavizados".
• Usar un icono estándar cuando es mejor no usar ningún icono en absoluto. No todos los mensajes necesitan un icono.
• Los usuarios alarmantes al proporcionar advertencias para problemas menores o presentar preguntas rutinarias como advertencias. Al hacerlo, los programas parecen propensos a riesgos y se desvirtecen de problemas realmente significativos.

En el resto de esta sección se explica cómo pensar en los iconos estándar para evitar estos errores comunes.

Tipo de mensaje frente a gravedad

Elija iconos estándar según el tipo de mensaje, no la gravedad del problema subyacente. Los tipos de mensaje son:

• Error. Error o problema que se ha producido.
• Advertencia. Condición que podría causar un problema en el futuro.
• Información. Información útil.

Por lo tanto, un mensaje de error podría tomar un icono de error, pero nunca un icono de advertencia. No use iconos de advertencia como una manera de "suavizar" errores menores. Por lo tanto, a pesar de su diferencia de gravedad, "Tamaño de fuente incorrecto" es un error, mientras que "Continuar con esta operación establecerá su casa en el fuego" es una advertencia.

Determinar el tipo de mensaje adecuado

Algunos problemas se pueden presentar como un error, una advertencia o información, según el énfasis y la expresión. Por ejemplo, supongamos que una página web no puede cargar un control de ActiveX sin firmar basado en la configuración actual de Windows Internet Explorer:

• Error. "Esta página no puede cargar un control de ActiveX sin firmar". (Fraseda como un problema existente).
• Advertencia. "Es posible que esta página no se comporte como se esperaba porque Windows Internet Explorer no está configurado para cargar controles de ActiveX sin firmar" o "Permitir que esta página instale un control de ActiveX sin firmar? Si lo hace desde orígenes que no son de confianza, puede dañar el equipo". (Ambos frasedos como condiciones que pueden causar problemas futuros).
• Información. "Ha configurado Windows Internet Explorer para bloquear los controles de ActiveX sin firmar". (Frasedo como una declaración de hecho).

Para determinar el tipo de mensaje adecuado, céntrese en el aspecto más importante del problema que los usuarios necesitan conocer o actuar sobre ellos. Normalmente, si un problema impide que el usuario continúe, se presenta como un error; si el usuario puede continuar, se trata de una advertencia. Cree la instrucción principal u otro texto correspondiente basado en ese foco y, a continuación, elija un icono (estándar o de otro modo) que coincida con el texto. El texto de la instrucción principal y los iconos siempre deben coincidir.

severity

Aunque la gravedad no es una consideración al elegir entre los iconos de error, advertencia e información, la gravedad es un factor para determinar si se debe usar un icono estándar en absoluto.

Los iconos funcionan mejor cuando se usan para comunicarse visualmente. (Tenga en cuenta que, por motivos de accesibilidad, esta comunicación visual siempre debe ser redundante con otro formulario, como texto o sonido). Los usuarios deben poder distinguir de un vistazo la naturaleza de la información y las consecuencias de su respuesta, por lo que debemos diferenciar los errores críticos y las advertencias de sus equivalentes normales. Los errores críticos y las advertencias tienen estas características:

• Implican una posible pérdida de uno o varios de los siguientes elementos:
  • Un recurso valioso, como la pérdida de datos o la pérdida financiera.
  • Acceso o integridad del sistema.
  • Privacidad o control sobre información confidencial.
  • Tiempo del usuario (una cantidad significativa, como 30 segundos o más).
• Tienen consecuencias inesperadas o imprevistas.
• Ahora requieren un control correcto, ya que los errores no se pueden corregir fácilmente e incluso pueden ser irreversibles.

Para distinguir errores y advertencias no críticos de los críticos, los mensajes no críticos suelen mostrarse sin un icono. Si lo hace, llama la atención a los mensajes críticos, hace que los mensajes críticos y no críticos sean visualmente distintos, y es coherente con el tono de Windows.

No todos los mensajes necesitan un icono. Los iconos no son una manera de decorar los mensajes.

A continuación se muestra un buen ejemplo de una advertencia crítica porque cumple las características definidas anteriormente.

En este ejemplo, una advertencia crítica alerta a los usuarios de una posible pérdida de datos irreversible.

Sin embargo, el ejemplo siguiente no es crítico porque es probable que sea intencional y sus resultados se deshacen fácilmente.

Incorrecto:

En este ejemplo, esta confirmación no es crítica porque es probable que sea intencionada y fácil de deshacer.

En una interfaz de usuario típica, la mayoría de los errores se relacionan con los errores de entrada del usuario. La mayoría de los errores de entrada de usuario no son críticos porque se corrigen fácilmente, y los usuarios deben corregirlos antes de continuar. Además, llamar demasiada atención a errores menores de usuario es contrario al tono de Windows. Por lo tanto, los errores de entrada de usuario menores normalmente se muestran sin un icono de error. Para reforzar su naturaleza no crítica, nos referimos a ellos como problemas de entrada del usuario.

En este ejemplo, este problema de entrada de usuario secundario no es crítico, por lo que no necesita un icono cuando se presenta en un cuadro de diálogo.

Evitar el exceso de advertencia

Contamos con Windows programas. El programa de Windows típico tiene iconos de advertencia aparentemente en todas partes, advertencia sobre las cosas que tienen poca importancia. En algunos programas, casi todas las preguntas se presentan como una advertencia. La advertencia excesiva hace que el uso de un programa se sienta como una actividad peligrosa y se desvirtece de problemas realmente significativos.

La mera posibilidad de pérdida de datos por sí sola es insuficiente para llamar a un icono de advertencia. Además, los resultados no deseados deben ser inesperados o no deseados y no corregirse fácilmente. De lo contrario, casi cualquier pregunta respondida incorrectamente podría interpretarse para dar lugar a la pérdida de datos de algún tipo y merecer un icono de advertencia.

Para centrar los iconos de advertencia en problemas realmente críticos:

• Asegúrese de que el problema garantiza una mayor atención del usuario. Las confirmaciones y preguntas rutinarias no deben tener iconos de advertencia.
• ¿Es probable que los usuarios se comporten de forma diferente como resultado del icono de advertencia? ¿Es probable que los usuarios consideren la decisión con más cuidado?

Incorrecto:

En este ejemplo, ¿es probable que los usuarios respondan a esta pregunta de forma diferente debido al icono de advertencia?

• ¿Hay alguna acción importante para hacer o tomar decisiones? Las advertencias sin acciones hacen que los usuarios se sientan paranoicos.

Incorrecto:

¿Por qué esta notificación es una advertencia? ¿Qué se supone que deben hacer los usuarios (además de preocuparse)?

Context

El contexto también es una consideración en el uso de iconos estándar porque el propio contexto comunica información. Específicamente:

• Aunque los cuadros de diálogo (incluidos los cuadros de diálogo de tareas y los cuadros de mensaje) y las notificaciones no necesitan iconos para errores no críticos, los errores en contexto siempre necesitan iconos de error. De lo contrario, estos comentarios no modales serían demasiado fáciles de pasar por alto.
• Las advertencias en contexto siempre necesitan iconos de advertencia para distinguirlos del texto normal.
• Los cuadros de diálogo, las notificaciones y los globos no necesitan iconos de información porque presentan claramente información. Por el contrario, los banners necesitan información de 16 x 16 píxeles u otros iconos porque estos comentarios no modales serían demasiado fáciles de pasar por alto.

Dado que el contexto es un factor significativo en el uso de iconos, las directrices de iconos estándar de este artículo se proporcionan en términos de su contexto.

Evaluación de la idoneidad del icono estándar

Al evaluar el texto de la interfaz de usuario, lea también los iconos estándar. Lea los iconos de error como "error!", los iconos de advertencia como "advertencia, tener mucho cuidado aquí!", y los iconos de información como "atención!". Después, continúe leyendo el contexto restante, como las instrucciones principales, el área de contenido y los botones de confirmación. Asegúrese de que el significado y el tono de cada icono estándar coinciden con el significado y el tono de su contexto. Si no lo hacen, ha encontrado un problema.

Si sólo haces una cosa...

Asegúrese de que el significado y el tono de cada icono estándar coinciden con el significado y el tono de su contexto. Si no coinciden, cambie o quite el icono.

Directrices

Nota: Para las instrucciones siguientes, "en contexto" significa en cualquier superficie de ventana normal, como dentro del área de contenido de un asistente, hoja de propiedades o página de elementos del panel de control.

General

• Elija iconos estándar según su tipo de mensaje, no la gravedad del problema subyacente:
  • Error. Error o problema que se ha producido.
  • Advertencia. Condición que podría causar un problema en el futuro.
  • Información. Información útil.
• Si un problema estraba diferentes tipos de mensajes, céntrese en el aspecto más importante en el que los usuarios necesitan actuar.
• Los iconos siempre deben coincidir con la instrucción principal u otro texto correspondiente.

Correcto:

Incorrecto:

En el ejemplo incorrecto, el icono de advertencia estándar no coincide con la instrucción principal (lo que da un error).

Tamaño de icono

• Elija el tamaño del icono estándar en función del contexto:

  Context	Cuándo se usa
  Cuadros de diálogo	Use 32 x 32 píxeles para los iconos del área de contenido; 16 x 16 píxeles para los iconos de área de nota al pie.
  In situ	Use 32 x 32 píxeles para páginas de error; Iconos de 16 x 16 píxeles para todos los demás.
  Notificaciones	Use iconos de 16 x 16 píxeles.
  Globos	Use iconos de 16 x 16 píxeles.
  Banners	Use iconos de 16 x 16 píxeles.

Iconos de error

• Use iconos de error solo cuando se haya producido un error o un problema:

  Context	Cuándo se usa
  Cuadros de diálogo	Use solo para errores críticos. (no use iconos estándar para errores no críticos).
  Errores en contexto	Use para todos los errores.
  Notificaciones	Use solo para errores críticos. (para errores de acción).
  Globos	No lo use. Los globos no se deben usar para errores críticos y no necesitan iconos de error para errores no críticos.
  Banners	No lo use. Los banners no deben usarse para errores.

• Por lo general, los iconos de error no son necesarios para problemas de entrada de usuario no críticos. Sin embargo, los iconos son necesarios para errores en contexto, ya que, de lo contrario, estos comentarios contextuales serían demasiado fáciles de pasar por alto.

• En los cuadros de diálogo de tareas, no use iconos de nota al pie de página de error. Los iconos de error solo se deben presentar en el área de contenido.

Iconos de advertencia

• Use iconos de advertencia solo cuando una condición pueda causar un problema en el futuro:

  Context	Cuándo se usa
  Cuadros de diálogo	Use para todas las advertencias.
  Advertencias en contexto	Use para identificar el texto como advertencia.
  Notificaciones	Use para todas las advertencias. (para eventos del sistema no críticos).
  Globos	Se usa para condiciones especiales.
  Banners	Use para llamar la atención al banner.

• No use iconos de advertencia para "suavizar" errores no críticos. En su lugar, los errores no son advertencias que aplican las directrices del icono de error.

• En los cuadros de diálogo de preguntas, use iconos de advertencia solo para preguntas con consecuencias significativas. No use iconos de advertencia para preguntas rutinarias.

Correcto:

Incorrecto:

En el ejemplo incorrecto, se usa incorrectamente un icono de advertencia para una pregunta rutinaria.

• En el caso de los cuadros de diálogo de tareas, puede usar un icono de nota al pie de advertencia para alertar a los usuarios de consecuencias de riesgo. Sin embargo, use un icono de advertencia en el área de contenido o en el área de nota al pie, pero no en ambos.

En este ejemplo, se usa un escudo de seguridad amarillo en una nota al pie.

Iconos de información

• Use iconos de información solo cuando el contexto no presente información obviamente:

  Context	Cuándo se usa
  Cuadros de diálogo	No lo use.
  In situ	No lo use. En su lugar, use texto estático sin formato o un banner.
  Notificaciones	No lo use.
  Globos	No lo use.
  Banners	use para llamar la atención sobre el banner.

• Los iconos de información no son necesarios en los cuadros de diálogo, las notificaciones y los globos, ya que su contexto comunica suficientemente que proporcionan a los usuarios información.

• En el caso de los cuadros de diálogo de tareas, no use iconos de notas al pie de información. Las notas al pie son lo suficientemente visibles y no dicen que son información.

Iconos de signo de interrogación

• Use el icono de signo de interrogación solo para los puntos de entrada de ayuda. Para obtener más información, consulte las instrucciones del punto de entrada de ayuda .
• No use el icono de signo de interrogación para formular preguntas. De nuevo, use el icono de signo de interrogación solo para los puntos de entrada de ayuda. No es necesario hacer preguntas con el icono de signo de interrogación de todos modos es suficiente presentar una instrucción principal como una pregunta.
• No reemplace rutinariamente los iconos de signo de interrogación por iconos de advertencia. Reemplace un icono de signo de interrogación por un icono de advertencia solo si la pregunta tiene consecuencias significativas. De lo contrario, no use ningún icono.