Стол
Используйте таблицу для отображения статических данных пользователям в удобном для сканирования формате.
Обратите внимание, что пользователи могут только просматривать (но не взаимодействовать) информацию в таблице. Если вы хотите, чтобы пользователи взаимодействовали, рассмотрите возможность использования списка .
Пример
Вот пример того, как выглядит таблица.
Требования
Этот визуальный компонент в настоящее время поддерживает настройку .
Имя поля | Необходимый? | Ограничения/настройки |
---|---|---|
Название таблицы | Нет | Настраиваемое семейство шрифтов и цвет. Не более 1 строки (дополнительные символы будут обрезаны). Высота карточки сворачивается, если заголовок не указан. |
Подзаголовок | Нет | Простой текст. Фиксированный шрифт, цвет и размер. Не более 1 строки (дополнительные символы будут обрезаны). Не будет отображаться без заголовка. Высота карточки сворачивается, если не указан подзаголовок. |
Изображение переднего плана | Нет | Настраиваемая форма изображения (угловые или закругленные углы). |
Карточный фон | Нет | Настраиваемое изображение или цвет. |
Заголовок столбца | Да | Простой текст. Фиксированный шрифт, цвет и размер. Настраиваемое выравнивание текста для заголовка и содержимого (слева, справа или по центру). Настраиваемый приоритет столбцов (первые 3 гарантированно отображаются). Нет ограничения на количество символов, но меньшие поверхности могут обрезаться, а не заворачиваться. |
Содержимое строки | Да | Простой текст. Фиксированный шрифт, цвет и размер. Настраиваемый приоритет строк (первые 3 гарантированно отображаются). Максимум 20 символов (дополнительные символы будут обрезаны). |
Ссылка действия | Нет | разрешена 1 ссылка. Настраиваемый цвет ссылки. |
Интерактивность
- Карточка таблицы не имеет взаимодействия без ссылки действия — она только представляет информацию.
- После добавления ссылки действия пользователи могут коснуться ее, чтобы просмотреть веб-контент или перейти к диалоговому окну.
Руководство
Таблицы оптимизированы для отображения табличных данных (например, спортивного зачета, результатов выборов или перелетов). Стремитесь к трем-пяти столбцам и строкам; в зависимости от размера экрана будет отображаться как минимум три. Поэтому расставьте приоритеты в отношении самой важной информации в первых трех столбцах и строках.
Используйте таблицы для передачи статической информации, не требующей особых объяснений. Эта информация должна быть четкой и легко просматриваемой, избегая появления перегруженной электронной таблицы. Поэтому убедитесь, что ваши данные помечены четко и лаконично. Целью должно быть предоставление информации, а не помощь пользователям в выборе (для этого используйте список ).
Данные должны быть краткими, важными и простыми для понимания.
Ключевым моментом является соблюдение правильного баланса между деталями и лаконичностью. Предложите пользователю достаточно подробностей, чтобы они могли различать элементы таблицы, но не настолько, чтобы это было перегружено.
Делать.
Не.
Сохраняйте суть сообщения в подсказках.
Даже когда визуальные эффекты дают лучший ответ, убедитесь, что подсказки по-прежнему напрямую относятся к запросу пользователя и продвигают разговор вперед.
Делать.
Не.