Administración de ventanas

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.

En este artículo se describe la ubicación predeterminada de las ventanas cuando se muestran inicialmente en la pantalla, su orden de apilamiento en relación con otras ventanas (orden Z), su tamaño inicial y cómo afecta su pantalla al foco de entrada.

Para obtener las instrucciones siguientes:

  • Una ventana de nivel superior no tiene ventana de propietario y se muestra en la barra de tareas. Ejemplos: ventanas de aplicación. En Windows Vista y versiones posteriores, los cuadros de diálogo sin ventanas de propietario y hojas de propiedades también se consideran de nivel superior.
  • Una ventana propiedad tiene una ventana de propietario y no se muestra en la barra de tareas. Ejemplos: cuadros de diálogo modales, cuadros de diálogo modeless.
  • Se muestra una ventana iniciada por el usuario como resultado directo de la acción de un usuario. De lo contrario, se inicia el programa si lo inicia un programa o el sistema si lo inicia Microsoft Windows. Por ejemplo, se inicia un cuadro de diálogo Opciones, pero se inicia un aviso de reunión.
  • Una ventana contextual es una ventana iniciada por el usuario que tiene una relación sólida con el objeto desde el que se inició. Por ejemplo, las ventanas mostradas por menús contextuales o iconos de área de notificación son contextuales, pero las ventanas mostradas por las barras de menú no son.
  • El monitor activo es el monitor donde se ejecuta el programa activo.
  • El monitor predeterminado es el que tiene el menú Inicio, la barra de tareas y el área de notificación.

Conceptos de diseño

La administración de ventanas es una de las actividades de usuario más fundamentales. Antes de Windows Vista, a menudo se les asignaban tamaños predeterminados pequeños y se colocaban en medio de la pantalla. Ese enfoque funciona bien para monitores de una sola resolución más antiguos, pero no para hardware de vídeo moderno.

Windows está diseñado para admitir hardware de vídeo moderno, que a menudo se ejecuta en resoluciones significativamente superiores a la resolución de pantalla mínima admitida y pueden tener varios monitores. Para ello:

  • Permite a los usuarios beneficiarse completamente de su hardware avanzado.
  • Requiere menos esfuerzo para que los usuarios muevan el mouse a distancias mayores.
  • Hace que la colocación de ventanas sea más predecible y, por tanto, sea más fácil de encontrar.

Resolución de pantalla mínima admitida

La resolución de pantalla mínima efectiva compatible con Windows es de 800 x 600 píxeles. Esto significa que las ventanas de tamaño fijo deben mostrarse completamente en la resolución mínima (al reservar espacio para la barra de tareas), pero las ventanas de tamaño redimensionable se pueden optimizar para una resolución efectiva de 1024 x 768 píxeles siempre y cuando sean funcionales en la resolución mínima.

Aunque actualmente las resoluciones de pantalla física más comunes para equipos Windows son de 1024 x 768 píxeles o superior, el destino es de 800 x 600 píxeles permite a Windows:

  • Trabaje bien con todo el hardware moderno, incluidos los equipos portátiles pequeños.
  • Admite la configuración de valores altos de ppp (puntos por pulgada).
  • Admite fuentes más grandes para la accesibilidad.
  • Compatibilidad con hardware usado de forma global.

La elección de la resolución mínima que se va a admitir requiere un equilibrio adecuado. El destino de una resolución más alta daría lugar a una experiencia poco óptima para un porcentaje significativo de hardware moderno, mientras que el destino de una resolución inferior impediría que los diseñadores aprovechen al máximo el espacio de pantalla disponible.

Si cree que los usuarios de destino usan resoluciones significativamente mayores que las mínimas de Windows, puede diseñar el programa para aprovechar al máximo el espacio de pantalla adicional mediante ventanas de tamaño redimensionable que se escalan bien.

Instrucciones

General

  • Admite la resolución mínima efectiva de Windows de 800 x 600 píxeles. Para interfaces de usuario críticas (INTERFACES) que deben funcionar en modo seguro, admita una resolución eficaz de 640 x 480 píxeles. Asegúrese de tener en cuenta el espacio utilizado por la barra de tareas reservando 48 píxeles relativos verticales para las ventanas mostradas con la barra de tareas.
  • Optimice los diseños de ventana de tamaño redimensionable para una resolución eficaz de 1024 x 768 píxeles. Cambia automáticamente el tamaño de estas ventanas para resoluciones de pantalla inferiores de una manera que sigue funcionando.
  • Asegúrate de probar las ventanas en 96 ppp (100 por ciento) a 800 x 600 píxeles, 120 ppp (125 por ciento) a 1024 x 768 píxeles y 144 ppp (150 por ciento) a 1200 x 900 píxeles. Compruebe si hay problemas de diseño, como el recorte de controles, texto y ventanas, y la extensión de iconos y mapas de bits.
  • Para los programas con escenarios de uso táctil y móvil, optimice para 120 ppp. Actualmente, las pantallas de valores altos de ppp son frecuentes en equipos táctiles y móviles.
  • Las ventanas redimensionables ya no deben mostrar el glifo de cambio de tamaño en la esquina inferior derecha, porque:
    • Todos los lados y bordes de una ventana se pueden cambiar de tamaño, no solo en la esquina inferior derecha.
    • El glifo requiere que se muestre una barra de estado, pero muchas ventanas de tamaño redimensionable no proporcionan barras de estado.
    • Los bordes de ventana redimensionables y los punteros de cambio de tamaño son más eficaces para comunicar que una ventana se puede cambiar de tamaño que el glifo de cambio de tamaño.

Controles de barra de título

Use los controles de la barra de título de la siguiente manera:

  • Casi. Todas las ventanas principales y secundarias con un marco de ventana estándar deben tener un botón Cerrar en la barra de título. Hacer clic en Cerrar tiene el efecto de cancelar o cerrar la ventana.

captura de pantalla del cuadro de diálogo sin botón Cerrar

En este ejemplo, el cuadro de diálogo no tiene un botón Cerrar en la barra de título.

  • Minimizar. Todas las ventanas principales y las ventanas secundarias de ejecución prolongada (como los cuadros de diálogo de progreso) deben tener un botón Minimizar. Al hacer clic en Minimizar, se reduce la ventana al botón de la barra de tareas. Por lo tanto, las ventanas que se pueden minimizar requieren un icono de barra de título.
  • Maximizar o restaurar hacia abajo. Todas las ventanas de tamaño redimensionable deben tener un botón Maximizar/Restaurar hacia abajo. Al hacer clic en Maximizar, se muestra la ventana en su tamaño más grande, que para la mayoría de las ventanas está a pantalla completa; mientras que al hacer clic en Restaurar hacia abajo se muestra la ventana en su tamaño anterior. Sin embargo, algunas ventanas no se benefician del uso de una pantalla completa, por lo que estas ventanas deben maximizarse al mayor tamaño útil.

Tamaño de la ventana

  • Elija un tamaño de ventana predeterminado adecuado para su contenido. No tenga miedo de usar tamaños de ventana inicial más grandes si puede usar el espacio de forma eficaz.
  • Use ventanas redimensionables siempre que sea práctico para evitar barras de desplazamiento y datos truncados. Las ventanas con contenido dinámico y listas se benefician más de las ventanas de tamaño redimensionable.
  • En el caso de los documentos de texto, considere una longitud máxima de línea de 65 caracteres para facilitar la lectura del texto. (Los caracteres incluyen letras, signos de puntuación y espacios).
  • Ventanas de tamaño fijo:
    • Debe ser completamente visible y de tamaño para ajustarse al área de trabajo.
  • Ventanas redimensionables:
    • Puede optimizarse para resoluciones más altas, pero reducir el tamaño según sea necesario en tiempo de visualización a la resolución de pantalla real.
    • Para tamaños de ventana progresivamente más grandes, debe mostrar progresivamente más información. Asegúrese de que al menos una parte o control de ventana tiene contenido de tamaño redimensionable.
    • Debe evitar los tamaños restaurados predeterminados que están maximizados o casi maximizados. En su lugar, elija un tamaño predeterminado que suele ser el más útil sin tener pantalla completa. Supongamos que los usuarios maximizarán la ventana en lugar de cambiar el tamaño para convertirlo en pantalla completa.
    • Debe establecer un tamaño mínimo de ventana si hay un tamaño por debajo del cual el contenido ya no se puede usar. Para los controles de tamaño redimensionable, establezca los tamaños mínimos de los elementos de tamaño redimensionable en sus tamaños funcionales más pequeños, como los anchos de columna funcional mínimos en las vistas de lista.
    • Debe cambiar la presentación si hace que el contenido se pueda usar con tamaños más pequeños.

captura de pantalla de los botones del reproductor multimedia

En este ejemplo, Reproductor multimedia de Windows cambia su formato cuando la ventana se vuelve demasiado pequeña para el formato estándar.

Ubicación de la ventana

  • Para las instrucciones siguientes, "centrar" significa inclinar la posición vertical ligeramente hacia la parte superior del monitor, en lugar de colocar exactamente en el medio. Coloque el 45 por ciento del espacio entre la parte superior del monitor o propietario y la parte superior de la ventana, y el 55 por ciento entre la parte inferior del monitor o propietario y la parte inferior de la ventana. Haz esto porque el ojo está naturalmente sesgado hacia la parte superior de la pantalla.

    figura de ventana situada ligeramente encima del centro

    "Centrar" significa inclinar la posición vertical ligeramente hacia la parte superior del monitor.

  • Si una ventana es contextual, mostrarla siempre cerca del objeto desde el que se inició. Colóquelo fuera del camino para que el objeto de origen no esté cubierto por la ventana.

    • Si se muestra con el mouse, cuando sea posible, colóquelo hacia abajo y hacia la derecha.

    figura de ventana contextual situada a la derecha del objeto

    Mostrar ventanas contextuales cerca del objeto desde el que se inició.

    ilustración de la ventana del área de notificación

    Las ventanas iniciadas desde los iconos del área de notificación se muestran cerca del área de notificación.

  • Si se muestra usando un lápiz, cuando sea posible colóquelo para que no esté cubierto por la mano del usuario. Para los usuarios a la derecha, se muestra a la izquierda; de lo contrario, se muestra a la derecha.

    ilustración de la ventana contextual situada a la izquierda del objeto

    Cuando se usa un lápiz, también se muestran ventanas contextuales para que no estén cubiertas por la mano del usuario.

  • Desarrolladores: Puede distinguir entre eventos de mouse y eventos de lápiz mediante la API GetMessageExtraInfo . Puede determinar la entrega del usuario mediante la API SystemParametersInfo con SPI_GETMENUDROPALIGNMENT.

  • Coloque los diálogos de progreso fuera del camino en la esquina inferior derecha del monitor activo.

    ilustración de la barra de progreso en la esquina inferior derecha

    Coloque los diálogos de progreso en la esquina inferior derecha.

  • Si una ventana no está relacionada con el contexto actual o la acción del usuario, colóquela fuera de la ubicación del puntero actual. Si lo hace, se evita la interacción accidental.

  • Si una ventana es una aplicación o documento de nivel superior, siempre en cascada su origen de la esquina superior izquierda del monitor. Si lo crea el programa activo, utilice el monitor activo; De lo contrario, use el monitor predeterminado.

    ilustración de tres ventanas en cascada desde la parte superior izquierda

    Ventanas de aplicación o documento de nivel superior en cascada de la esquina superior izquierda del monitor.

  • Si una ventana es una utilidad de nivel superior, mostrarla siempre "centrada" en el monitor. Si lo crea el programa activo, utilice el monitor activo; De lo contrario, use el monitor predeterminado.

    ilustración de la ventana de utilidad centrada en el monitor

    Ventanas de utilidad de nivel superior del centro.

  • Si una ventana es una ventana de propiedad, mostrarla inicialmente "centrada" en la parte superior de la ventana del propietario. Para la presentación posterior, considere la posibilidad de mostrarla en su última ubicación (relativa a la ventana del propietario) si es probable que sea más conveniente.

    ilustración de la ventana de propiedad centrada en la ventana del propietario

    Ventanas propiedad del centro inicialmente en la parte superior de la ventana del propietario.

  • En el caso de los cuadros de diálogo modeless, siempre se muestra inicialmente en la parte superior de la ventana del propietario para que sean fáciles de encontrar. Sin embargo, si el usuario activa la ventana del propietario, esto puede ocultar el cuadro de diálogo modelado.

    ilustración del cuadro de diálogo modeless sobre la ventana de propietario

    Muestra los cuadros de diálogo modeless inicialmente en la parte superior de la ventana del propietario para que sean fáciles de encontrar.

  • Si es necesario, ajuste la ubicación inicial para que toda la ventana esté visible en el monitor de destino. Si una ventana de tamaño cambia de tamaño es mayor que el monitor de destino, reduzca su ajuste.

Orden de ventana (orden Z)

  • Coloque siempre las ventanas propiedad en la parte superior de su ventana de propietario. Nunca coloque ventanas propiedad en sus ventanas propietarias, ya que lo más probable es que los usuarios no los vean.
  • Respeta la selección de pedidos Z de los usuarios. Cuando los usuarios seleccionan una ventana, traiga solo las ventanas asociadas a esa instancia del programa (la ventana más las ventanas propietarias o propietarias) a la parte superior del pedido Z. No cambie el orden de ninguna otra ventana, como instancias independientes del mismo programa.

Activación de ventanas

  • Respeta la selección del estado de la ventana de los usuarios. Si una ventana existente necesita atención, flashe el botón de la barra de tareas tres veces para llamar la atención y dejarla resaltada, pero no haga nada más. No restaure ni active la ventana. No uses ningún efecto de sonido. En su lugar, permita a los usuarios activar la ventana cuando estén listos.
    • Excepción: Si la ventana no aparece en la barra de tareas, tráela en la parte superior de todas las demás ventanas y flashe su barra de título en su lugar.
  • Restaurar una ventana principal también debe restaurar todas sus ventanas secundarias, incluso si esas ventanas secundarias tienen su propio botón de barra de tareas. Al restaurar, coloque las ventanas secundarias encima de la ventana principal.

Foco de entrada

  • Las ventanas mostradas por las acciones iniciadas por el usuario deben realizar el foco de entrada, pero solo si la ventana se representa inmediatamente (en un plazo de 5 segundos). Una vez representada la ventana, puede tomar el foco de entrada una vez.
    • Si una ventana se representa lentamente (más de 5 segundos), es probable que los usuarios realicen otra tarea mientras esperan. Centrarse en este punto sería una molestia, especialmente si se hace más de una vez.
  • Las ventanas que no se muestran ni se muestran inmediatamente mediante una acción iniciada por el sistema no deben centrarse en la entrada. En su lugar, se muestra en la parte superior sin foco y permite a los usuarios activarlos cuando estén listos.
    • Excepción: Administrador de credenciales.

Persistencia

  • Cuando se vuelve a mostrar una ventana, considere la posibilidad de mostrarla en el mismo estado que la última vez que se ha accedido. Al cerrar, guarde el monitor usado, el tamaño de la ventana, la ubicación y el estado (maximizado frente a la restauración). Al volver a mostrar, restaure el tamaño, la ubicación y el estado de la ventana guardados mediante el monitor adecuado. Además, considere la posibilidad de que estos atributos persistan entre instancias de programa por usuario. Excepciones:
    • No guarde ni haga que estos atributos persistan en las ventanas cuando su uso sea tal que es mucho más probable que los usuarios quieran empezar por completo.
    • Para los programas que es probable que se usen en equipos Tecnología táctil y Tablet PC de Windows, guarde dos estados de ventana para los modos horizontal y vertical. Para obtener más información, vea Diseño de tamaños de pantalla variables.
  • Si la configuración del monitor actual impide mostrar una ventana con su último estado:
    • Intente mostrar la ventana con su último monitor.
    • Si la ventana es mayor que el monitor, cambie el tamaño de la ventana según sea necesario.
    • Mueva la ubicación hacia la esquina superior izquierda para ajustarse al monitor según sea necesario.
    • Si los pasos anteriores no resuelven el problema, vuelva a las directrices de selección de ubicación de ventana predeterminadas. Considere la posibilidad de restaurar el tamaño anterior, si es posible.