Как пользоваться
- Введите ячейки в сетке или вставьте CSV или TSV в поле Вставить CSV или TSV (необязательно) и нажмите Загрузить в таблицу.
- Отметьте Первая строка — заголовок и Первый столбец — заголовок, чтобы обозначить ячейки заголовков.
- Введите Подпись, в которой сказано, что показывает таблица. Отметьте Добавить минимальное оформление, если таблице нужны границы.
- Скопируйте поле HTML или нажмите Скачать и вставьте разметку на свою страницу.
Почему ячейки заголовков имеют область действия
Ячейка заголовка — это элемент th, а не td. Его атрибут scope показывает, какие ячейки он подписывает: col для заголовка над столбцом и row для заголовка в начале строки. Программы чтения с экрана объявляют эти заголовки вместе с каждой ячейкой данных, поэтому посетитель, который не видит сетку, всё равно понимает, что означает число.
Подпись — это название всей таблицы, и она стоит первой внутри таблицы. Пишите подпись, которая говорит, что показывает таблица, например «Продажи по месяцам», а не пропускайте её. В разделе о таблицах HTML (на английском) описаны эти элементы.
заголовок над столбцом: th с scope col; заголовок в начале строки: th с scope row; данные: td
Вставка из таблицы и экранирование
Текст CSV разделяет ячейки запятыми, точками с запятой или табуляцией, а ячейка, в которой есть один из этих символов, заключается в двойные кавычки. Копирование ячеек из электронной таблицы обычно даёт текст с табуляцией. Таблицы на языках, которые пишут дробную часть через запятую, часто сохраняют CSV с точками с запятой. «Определить» читает первую строку и выбирает разделитель, который встречается в ней чаще всего.
Текст каждой ячейки экранируется до записи. Знак «меньше» или амперсанд становится ссылкой на символ, поэтому на странице он выглядит как текст и никогда не читается как разметка. Короткая строка дополняется пустыми ячейками, поэтому у каждой строки одинаковое число ячеек.
Пример: таблица из двух столбцов с заголовками строки и столбца
Возьмём ячейки Месяц и Продажи в первой строке и Янв и 1200 во второй, с первой строкой и первым столбцом как заголовками и подписью Продажи.
Таблица начинается с элемента caption с текстом Продажи. Затем идёт заголовочная строка из двух ячеек заголовков, у каждой из которых scope col, а затем тело таблицы, в котором Янв — ячейка заголовка со scope row, а 1200 — ячейка данных.
Частые вопросы
Что делает атрибут scope?
Он говорит вспомогательным технологиям, какие ячейки подписывает заголовок. Значение col означает, что заголовок стоит над своим столбцом, а row — что он стоит в начале своей строки. Без scope программе чтения с экрана приходится угадывать эту связь.
Когда нужен столбец заголовков?
Когда первый столбец называет каждую строку, например товар, человека или месяц. Таблица из одних чисел без названий строк в нём не нуждается, поэтому его лучше не включать.
Зачем таблице подпись?
Подпись даёт таблице название, которое программы чтения с экрана объявляют до ячеек. Она также помогает зрячему посетителю сразу понять, о чём таблица, поэтому пишите её, когда таблица стоит сама по себе.
Какой разделитель выбрать для электронной таблицы?
Табуляцию — для текста, скопированного из электронной таблицы, и точку с запятой — для файла CSV, сохранённого в языке, где десятичный разделитель — запятая. «Определить» подходит в большинстве случаев, а предпросмотр показывает результат до копирования.
Меняет ли минимальное оформление другие таблицы на моей странице?
Да, если вставить его в страницу как есть, потому что элемент style действует на каждую таблицу страницы. Не добавляйте его, если ваша страница уже оформляет таблицы, или скопируйте только нужные правила.
Таблица, которую я ввожу или вставляю, куда-нибудь отправляется или сохраняется?
Нет. Таблица, предпросмотр и HTML создаются в вашем браузере. Ничего не сохраняется и не отправляется на наш сервер, поэтому скопируйте HTML или скачайте его, прежде чем покинуть страницу.
Источники
- WHATWG: HTML Living Standard, tables (на английском)
- MDN (на английском): th element
- MDN (на английском): caption element
Цифры и текст в последний раз проверены вторник, 10 ноября 2026 г..