Списки

Примечание.

Это руководство по проектированию было создано для Windows 7 и не было обновлено для более новых версий Windows. Большая часть рекомендаций по-прежнему применяется в принципе, но презентация и примеры не отражают наше текущее руководство по проектированию.

С помощью поля списка пользователи могут выбрать из набора значений, представленных в списке, который всегда отображается. В списке с одним выбором пользователи выбирают один элемент из списка взаимоисключающих значений. В списке с несколькими выборами пользователи выбирают ноль или больше элементов из списка значений.

Обычное поле с одним выделением.

Примечание.

Рекомендации, связанные с представлениями макетов и списков, представлены в отдельных статьях.

Выбор правильного элемента управления

Чтобы решить, рассмотрите следующие вопросы:

• Отображает ли список данные, а не параметры программы? В любом случае, поле списка подходит независимо от количества элементов. В отличие от этого, переключатели или флажки подходят только для небольшого количества вариантов программы.
• Нужно ли пользователям изменять представления, группировать, сортировать по столбцам или изменять ширину столбцов и порядок? В этом случае используйте представление списка.
• Должен ли элемент управления быть источником перетаскивания или целевым объектом перетаскивания? В этом случае используйте представление списка.
• Нужно ли копировать элементы списка в буфер обмена или вставить их из буфера обмена? В этом случае используйте представление списка.

Списки одноэлементных выборов

• Используется ли элемент управления для выбора одного варианта из списка взаимоисключающих значений? В противном случае используйте другой элемент управления. Чтобы выбрать несколько параметров, используйте стандартный список с несколькими выборами, флажок, построитель списков или добавить или удалить список.
• Рекомендуется ли использовать параметр по умолчанию для большинства пользователей в большинстве ситуаций? Видит ли выбранный вариант гораздо важнее, чем увидеть альтернативные варианты? Если это так, попробуйте использовать раскрывающийся список , если вы не хотите поощрять пользователей вносить изменения, скрывая альтернативные варианты.

В этом примере высокое качество цвета является лучшим выбором для большинства пользователей, поэтому раскрывающийся список является хорошим выбором, чтобы переиграть альтернативные варианты.

• Требует ли список постоянного взаимодействия? В этом случае используйте одинарный список выбора, чтобы упростить взаимодействие.

В этом примере пользователи постоянно меняют выбранный элемент в списке отображаемых элементов, чтобы задать цвет переднего плана и фона. Использование раскрывающегося списка в этом случае будет очень емким.

• Представляется ли параметр относительным количеством? Будут ли пользователи воспользоваться мгновенными отзывами о влиянии изменения параметров? В этом случае рекомендуется использовать ползунок .
• Существует ли важная иерархическая связь между элементами списка? В этом случае используйте вместо этого элемент управления представления дерева.
• Есть ли экранное пространство в категории "Премиум"? Если это так, используйте раскрывающийся список, так как используемое пространство экрана фиксировано и независимо от количества элементов списка.

Стандартные списки выбора с несколькими выборами и флажки

• Важно ли выбрать несколько элементов для задачи или часто используемых? Если это так, используйте флажок, чтобы сделать несколько выбор очевидным, особенно если целевые пользователи не являются расширенными. Многие пользователи не понимают, что стандартный список с несколькими выборами поддерживает несколько вариантов выбора. Используйте стандартный список выбора с несколькими выборами, если флажки будут привлечь слишком много внимания к нескольким выделениям или привести к слишком большому объему загромождающего экрана.
• Важна ли стабильность нескольких выборов? Если это так, используйте флажок, построитель списков или добавить или удалить список, так как щелкнув только один элемент за раз. С стандартным списком выбора, очень легко очистить все выборы даже по случайности.
• Используется ли элемент управления для выбора нуля или нескольких элементов из списка значений? В противном случае используйте другой элемент управления. Чтобы выбрать один элемент, используйте вместо этого список с одним выделением.

Предварительные просмотры списков

• Проще ли выбрать варианты с изображениями, чем только текст? В этом случае используйте список предварительных версий.

Построитель списков и списки добавления и удаления

• Используется ли элемент управления для выбора нуля или нескольких элементов из списка значений? В противном случае используйте другой элемент управления. Чтобы выбрать один элемент, используйте вместо этого список с одним выделением.
• Имеет ли значение порядок выбранных элементов? Если это так, построитель списков и добавление и удаление шаблонов списков поддерживают порядок, в то время как другие шаблоны выбора нескольких элементов не поддерживаются.
• Важно ли пользователям просмотреть сводку по всем выбранным элементам? В этом случае построитель списков и шаблоны списков добавления и удаления отображаются только выбранные элементы, в то время как другие шаблоны выбора нескольких элементов не отображаются.
• Являются ли возможные варианты недоступными? Если да, используйте список добавления и удаления, чтобы пользователи могли выбирать значения, не находящиеся в данный момент в списке.
• Требуется ли добавление значения в список специализированного диалогового окна для выбора объектов? Если это так, используйте список добавления и удаления и отобразите диалоговое окно при нажатии кнопки "Добавить".
• Есть ли экранное пространство в категории "Премиум"? Если это так, используйте список добавления и удаления, так как он использует меньше места на экране, не всегда отображая набор параметров.

Для списков количество элементов в списке не является фактором выбора элемента управления, так как они масштабируются от тысяч элементов до одного для списков с одним выделением (и нет для нескольких списков выбора). Так как поля списков можно использовать для данных, количество элементов может быть неизвестно заранее.

Примечание. Иногда элемент управления, который выглядит как поле списка, реализуется с помощью представления списка и наоборот. В таких случаях применяются рекомендации, основанные на использовании, а не на реализации.

Варианты использования

Списки имеют несколько шаблонов использования:

Название	Значение
Списки единого выбора позволяют пользователям выбирать один элемент одновременно.	В этом примере пользователи могут выбрать только один элемент отображения.
Стандартные списки с несколькими выборами позволяют пользователям выбирать любое количество элементов, включая нет.	Стандартные списки с несколькими выборами имеют точно тот же внешний вид, что и списки с одним выделением, поэтому нет визуального подсказки о том, что поле списка поддерживает несколько выборок. Так как пользователи должны обнаруживать эту возможность, этот шаблон списка лучше всего использовать для задач, где несколько выборок не является важным и редко используется. Существует два разных режима выбора нескольких элементов: несколько и расширенные. Расширенный режим выбора является гораздо более распространенным, где выделение может быть расширено путем перетаскивания или нажатия клавиш SHIFT+CLICK и CTRL+click, чтобы выбрать группы смежных и не смежных значений соответственно. В режиме выбора нескольких элементов, щелкнув любой элемент, переключает его состояние выбора независимо от клавиш SHIFT и CTRL. Учитывая необычное поведение, режим множественного выбора не рекомендуется использовать и вместо этого следует использовать списки флажок. В этом примере пользователи могут выбрать любое количество элементов с помощью режима множественного выбора.
Флажки списков "Как стандартные списки с несколькими выборами", списки флажков позволяют пользователям выбирать любое количество элементов, включая нет.	В отличие от стандартных списков с несколькими выборами, флажки четко указывают на возможность выбора нескольких вариантов. Используйте этот шаблон списка для задач, в которых несколько выборок является важным или часто используемым. В этом примере пользователи обычно выбирают несколько элементов, поэтому используется флажок. Учитывая это четкое указание на несколько выборов, можно предположить, что списки флажок предпочтительнее стандартных списков с несколькими выборами. На практике для нескольких задач требуется несколько выборок или их использование в значительной степени; При использовании списка флажка в таких случаях слишком много внимания уделяется выбору. Следовательно, стандартные списки с несколькими выборами гораздо чаще.
Списки предварительного просмотра могут быть одним или несколькими выделениями, но они отображают предварительный просмотр эффекта выделения, а не просто текста.	В этом примере предварительный просмотр каждого параметра четко показывает эффект выбора, что является более эффективным, чем использование текста в одиночку.
Построители списков позволяют пользователям создавать список вариантов , добавляя один элемент одновременно и при необходимости устанавливая порядок списка.	Построитель списков состоит из двух списков с одним выбором: список слева является фиксированным набором параметров, а список справа — это созданный список. Между списками есть две кнопки команд: Кнопка "Добавить", которая перемещает выбранный в данный момент параметр в созданный список, вставленный перед выбранным элементом. (Дважды щелкнув элемент параметра, имеет тот же эффект.) Кнопка "Удалить", которая удаляет выбранный элемент из созданного списка и возвращает его в список параметров. (Дважды щелкнув элемент в встроенном списке, имеет тот же эффект.) При необходимости в созданном списке могут быть команды перемещения вверх и вниз , чтобы упорядочить элементы списка. В этом примере построитель списков используется для создания панели инструментов, выбрав элементы из набора доступных параметров и задав их порядок.
Добавление и удаление списков позволяет пользователям создавать список вариантов, добавляя один или несколько элементов одновременно и при необходимости устанавливая порядок списка (например, построители списков).	В отличие от построителя списков, при нажатии кнопки "Добавить" отображается диалоговое окно для выбора элементов для добавления в список. Использование отдельного диалогового окна обеспечивает значительную гибкость при выборе элементов, которые можно использовать специализированный средство выбора объектов или даже общий диалог. По сравнению с построителем списков этот вариант является более компактным, но требует немного больше усилий для добавления элементов. В этом примере пользователи могут добавлять или удалять средства из меню, а также задавать порядок. Хотя построитель списков и шаблоны списков добавления и удаления значительно тяжелее, чем другие списки с несколькими выборами, они предлагают два уникальных преимущества: Пользователи имеют контроль над порядком списка, как при создании списка, так и после. Пользователи могут просмотреть сводку выбранных элементов, что может быть значительным преимуществом, если количество вариантов большое. Их недостатки в том, что они требуют гораздо больше места на экране и могут быть трудно использовать при создании большого списка элементов с нуля. Следовательно, они лучше всего используются для создания коротких списков или изменения списков, которые уже существуют.

Рекомендации

Презентация

• Сортировка элементов списка в логическом порядке, например группирование связанных параметров, размещение наиболее часто используемых элементов в первую очередь или использование алфавитного порядка. Сортировка имен в алфавитном порядке, числа в числовом порядке и датах в хронологическом порядке. Списки с 12 или более элементами должны быть отсортированы в алфавитном порядке, чтобы упростить поиск элементов.

Правильно:

В этом примере элементы списка отсортированы по их пространственной связи.

Неправильно:

В этом примере существует так много элементов списка, которые они должны быть отсортированы в алфавитном порядке.

Правильно:

В этом примере элементы списка проще найти, так как они отсортированы в алфавитном порядке. Однако элемент "Все продукты Windows" находится в начале списка независимо от его порядка сортировки.

• Поместите параметры, представляющие все или нет в начале списка, независимо от порядка сортировки остальных элементов.
• Заключите мета-параметры в скобки.

В этом примере "(none)" является мета-параметром, так как он не является допустимым значением для выбора, а указывает, что сам параметр не используется.

• Вместо этого не имеют пустых элементов списка используйте мета-параметры. Пользователи не знают, как интерпретировать пустые элементы, в то время как значение мета-параметров явно.

Неправильно:

В этом примере значение пустого элемента неясно.

Правильно:

В этом примере мета-параметр "(none)" используется вместо него.

Взаимодействие

• Рассмотрите возможность предоставления поведения двойного щелчка. Двойной щелчок должен иметь тот же эффект, что и выбор элемента и выполнение команды по умолчанию.
• Сделайте поведение двойного щелчка избыточным. Всегда должна быть кнопка команды или команда контекстного меню, которая имеет тот же эффект.
• Если пользователи не могут ничего делать с выбранными элементами, не разрешайте выделение.

Правильно:

В этом поле списка отображается список изменений только для чтения; Выбор не требуется.

• При отключении поля списка также отключите все связанные метки и кнопки команд.
• Не используйте изменение выбранного элемента в списке:
  • Выполнение команд.
  • Отображение других окон, таких как диалоговое окно для сбора дополнительных входных данных.
  • Динамически отображать другие элементы управления, связанные с выбранным элементом управления (средства чтения с экрана не могут обнаруживать такие события). Исключение. Вы можете динамически изменять статический текст, используемый для описания выбранного элемента.

Хорошо:

В этом примере изменение выбранного элемента изменяет описание.

• Избегайте горизонтальной прокрутки. Многоклюмные списки полагаются на горизонтальное прокрутку, что обычно труднее использовать, чем вертикальное прокрутки. Многоклюменные списки, требующие горизонтальной прокрутки, могут использоваться при наличии множества отсортированных по алфавиту элементов и достаточного пространства экрана для широкого элемента управления.

Хорошо:

В этом примере используются несколько столбцов, требующих горизонтальной прокрутки, так как для широкого элемента управления существует много элементов и доступное пространство экрана.

Списки выбора нескольких элементов

• Рассмотрите возможность отображения количества выбранных элементов под списком, особенно если пользователи, скорее всего, будут выбирать несколько элементов. Эта информация не только дает полезные отзывы, но и четко указывает, что поле списка поддерживает несколько вариантов выбора.

В этом примере число выбранных элементов отображается под списком.

• Можно указать другие метрики выбора, которые могут быть более значимыми, например ресурсы, необходимые для выбора.

В этом примере дисковое пространство, необходимое для установки компонентов, является более значимым, чем количество выбранных элементов.

• Если есть потенциально много элементов списка и выбор или очистка всех из них, скорее всего, добавьте команду "Выбрать все" и "Очистить все".
• Для стандартных списков с несколькими выборами не используйте режим множественного выбора, так как этот режим выбора не рекомендуется. Для эквивалентного поведения вместо этого используйте список флажок.

Значения по умолчанию

• Выберите самый безопасный (чтобы предотвратить потерю данных или системного доступа) и наиболее безопасный параметр по умолчанию. Если безопасность и безопасность не являются факторами, выберите наиболее вероятный или удобный вариант.

Исключение. Не выбирайте элементы, если элемент управления представляет свойство в смешанном состоянии, что происходит при отображении свойства для нескольких объектов, которые не имеют одного и того же параметра.

Рекомендуемый размер и интервалы

Рекомендуемый размер и интервал для списков.

• Выберите ширину списка, подходящую для самых длинных допустимых данных. Стандартные поля списка нельзя прокручивать по горизонтали, поэтому пользователи могут видеть только то, что видно в элементе управления.
• Добавьте дополнительный 30 процентов (до 200 процентов для более короткого текста) для любого текста (но не чисел), который будет локализован.
• Выберите высоту списка, отображающую целое число элементов. Избегайте усечения элементов по вертикали.
• Выберите высоту списка, которая устраняет ненужные вертикальные прокрутки. Поля списка должны отображаться между 3 и 20 элементами без необходимости прокрутки. Рекомендуется сделать поле списка немного длиннее, если это устраняет вертикальную полосу прокрутки. Списки с потенциально большим количеством элементов должны отображать по крайней мере пять элементов, чтобы упростить прокрутку, показывая больше элементов за раз и упрощая позицию полосы прокрутки.
• Если пользователи получают преимущества от расширения поля списка, сделайте его поле списка и его родительским окном для изменения размера. Это позволяет пользователям настраивать размер поля списка по мере необходимости. Однако поля списков с изменением размера должны отображаться не менее трех элементов.

Наклейки

Метки элементов управления

• Все поля списков нуждаются в метках. Напишите метку как слово или фразу, а не как предложение; используйте двоеточие в конце метки.

Исключение: опустите метку, если она является просто повтором основной инструкции диалогового окна. В этом случае основная инструкция принимает двоеточие (если это не вопрос) и ключ доступа.

Хорошо:

В этом примере метка поля списка просто выполняет основную инструкцию.

Лучший:

В этом примере удалена избыточность метки, поэтому основная инструкция принимает двоеточие и ключ доступа.

• Если поле списка подчинено переключателю или флажку и отображается меткой этого элемента управления, заканчивающейся двоеточием, не помещайте дополнительную метку в элемент управления списка.

В этом примере поле списка подчинено переключателю и предоставляет общий доступ к метке.

• Назначьте уникальный ключ доступа. Рекомендации см. в разделе "Клавиатура".
• Используйте прописную букву в стиле предложений.
• Поместите метку слева от элемента управления или над ней и выровняйте метку с левым краем элемента управления.
  • Если метка находится слева, выровняйте текст метки по вертикали с первой строкой текста в элементе управления.

Правильно:

В этих примерах метка сверху выравнивается с левым краем поля списка, а метка слева выравнивается с текстом в поле списка.

Неправильно:

В этих неправильных примерах метка сверху выравнивается с текстом в поле списка, а метка слева выравнивается с верхней частью поля списка.

• Для списков с несколькими выборами используйте метку, которая четко указывает, что можно выбрать несколько элементов. Метки списка флажка могут быть менее явными.

Правильно:

В этом примере метка четко указывает на возможность выбора нескольких элементов.

Неправильно:

В этом примере метка не содержит очевидных сведений о нескольких выборах.

Лучший:

В этом примере флажки четко указывают на возможность выбора нескольких элементов, поэтому метка не должна быть явной.

• Вы можете указать единицы (секунды, подключения и т. д.) в скобках после метки.

Текст параметра

• Назначьте уникальное имя каждому параметру.
• Используйте прописную букву в стиле предложений, если элемент не является правильным существительным.
• Напишите метку как слово или фразу, а не как предложение, и не используйте конечные знаки препинания.
• Используйте параллельную фразу и попробуйте сохранить длину примерно одинаковой для всех параметров.

Инструкции и дополнительный текст

• Если необходимо добавить инструкционный текст о поле списка, добавьте его над меткой. Используйте полные предложения с окончанием препинания.
• Используйте прописную букву в стиле предложений.
• Дополнительные сведения, полезные, но не необходимые, должны быть короткими. Поместите этот текст в скобки между меткой и двоеточием или без скобок под элементом управления.

В этом примере дополнительный текст помещается под списком.

Документация

При обращении к полям списка:

• Используйте точный текст метки, включая его заглавную букву, но не включайте символ подчеркивания или двоеточия ключа доступа. Включите список слов. Не ссылайтесь на поле списка как поле списка или поле.
• Для элементов списка используйте точный текст элемента, включая его заглавную букву.
• В программировании и другой технической документации см. список полей в виде списков. Везде, где угодно, используйте список.
• Чтобы описать взаимодействие с пользователем, используйте команду select.
• По возможности отформатируйте метку и элементы списка с помощью полужирного текста. В противном случае поместите метку и элементы в кавычки, только если это необходимо, чтобы предотвратить путаницу.

Пример. В списке "Перейти к чему " выберите "Закладка".