Версия источника: 613500afd8eca5143b4094f6f5cd48e67844f8ff
Синхронизировано: 2026-11-11T03:48:23.836Z
Источник: https://github.com/sergey-from-riders/vibecoding-base/tree/613500afd8eca5143b4094f6f5cd48e67844f8ff

<a id="interface-table-layout"></a>

![Табличные представления: неудобный пример на вымышленных данных](https://raw.githubusercontent.com/sergey-from-riders/vibecoding-base/613500afd8eca5143b4094f6f5cd48e67844f8ff/registry/standards/ui/admin-interface/assets/table-bad.webp)

![Табличные представления: рекомендуемый пример на вымышленных данных](https://raw.githubusercontent.com/sergey-from-riders/vibecoding-base/613500afd8eca5143b4094f6f5cd48e67844f8ff/registry/standards/ui/admin-interface/assets/table-good.webp)

# Табличные представления

## Коротко

Таблица помогает сравнивать однотипные записи и выполнять групповые действия.

## Плохо

```text
Каталог услуг: длинные карточки.
Цена и статус спрятаны внутри каждой карточки.
```

## Хорошо

```text
Каталог услуг: Название | Цена | Статус | Изменено.
Записи можно сравнить, открыть и выделить.
```

## Почему

Одинаковые свойства на одной линии быстрее просматривать. Таблица полезна, когда важны сравнение и обработка списка, а не только изображение.

## Когда применять

Товары, услуги, туры, статьи, заказы, заявки, клиенты, остатки и документы. Для расписания выбирайте календарь, для этапов работы — канбан; визуальную подборку можно показывать карточками.

## Как проверить

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

## Человек

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

## Агент

Показывает типовые строки, проверяет узкий экран и клавиатуру.

## Пример применения

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

## Источники

- [Carbon Design System: Data table](https://www.carbondesignsystem.com/building-blocks/core/components/data-table/guidelines)
- [Index table](https://shopify.dev/docs/api/app-home/latest/patterns/compositions/index-table)

Уровень: Рекомендуется. Опубликовано: 2026-11-11. Проверено: 2026-11-11. Изменено: 2026-11-11.

[Исходный файл](https://github.com/sergey-from-riders/vibecoding-base/blob/613500afd8eca5143b4094f6f5cd48e67844f8ff/registry/standards/ui/admin-interface/rules/table-layout.md)
