Заголовки HTML стають темою не щодня de jour, але моя папка збережених посилань накопичує статті про нещодавно об'єднані видалення алгоритму структури документа в WHATWG Living Standard.
По-перше, ви повинні знати, що алгоритму насправді ніколи не існувало. Звичайно, це було в специфікації. І звичайно, у специфікації було попередження про його використання. Але жоден браузер ніколи не реалізував це, як Брюс Лоусон нагадав нам. Весь час ми жили в плоскій структурі документа.
Це дуже старі новини. Адріан Розеллі писав про міф про структуру документа З 2013. Але це його публікація 2016 року під назвою «Немає алгоритму структури документа» який всебічно пояснює це та регулярно оновлюється додатковими фрагментами контексту про розмови та труднощі, які привели нас сюди. Це дійсно найкраща хронологія саги. Амелія Белламі-Ройдс також заглибився в коріння дилеми у минулому тут, на CSS-Tricks.
Мій розум миттєво переходить до всієї роботи, яка була витрачена на створення алгоритму структури документа, який підтримує розділення. Видалення його зі специфікації, безумовно, є правильним рішенням, але це не позбавляє від величезних зусиль, які були докладені для цього, навіть якщо зараз він похований в історії версій. Я також думаю про всіх людей із добрими намірами, які з часом помилково писали про алгоритм (зокрема на цьому самому сайті!), сподіваючись, що він не за горами. Майже сім років психічної та технічної заборгованості ми накопичили через те, що виглядає як відсутність дій.
Оглядаючи «новини» про те, що алгоритму офіційно більше немає, Брюс нарікає, що немає загального <h> елемент або подібне, яке можна розділити на секції для створення правильного рівня заголовка. Я згоден. Маючи <h1> елемент по суті існує як відкритий <title> обмежує, особливо тому, що сторінки так рідко структуровані навколо однієї статті з одним заголовком верхнього рівня. Я часто здригаюся щоразу, коли використовую якийсь компонент картки <h3> може бути технічно правильним, але виглядає не в порядку. І це ще до того, як ми навіть поговоримо про міркування щодо стилю, де нижчий рівень заголовка тепер має виглядати як виразний вищий рівень заголовка.
Говорячи про управління рівнем заголовка, Стів Фолкнер (який є автором PR, який витягнув алгоритм із специфікації) супер практичний огляд використання <hgroup> елемент для обробки шаблонів заголовків, які включають підзаголовки, субтитри, альтернативні заголовки, інші слогани. Я впевнений, що ви бачили таку розмітку в дикій природі:
<h1>Disappointingly Average</h1>
<h2>The Autobiography of Geoff Graham</h2>
<h3>by Geoff Graham</h3>Це не поєднується з плоским контуром документа, керованим рівнями заголовків. Кожен із цих заголовків представляє розділ, який утворює ієрархію інформації:
Disappointingly Average
└── The Autobiography of Geoff Graham
└── by Geoff GrahamНатомість ми хочемо a група заголовків. Підкажіть <hgroup> Елемент:
При вкладенні в a
<hgroup>елемент,<p>Вміст елемента представляє підзаголовок, альтернативний заголовок або слоган, які не включені до структури документа.
Отже, ми отримуємо таку структуру:
<hgroup>
<h1>Disappointingly Average</h1>
<p>The Autobiography of Geoff Graham</p>
<p>by Geoff Graham</p>
</hgroup><hgroup> is role=generic на даний момент, але Стів вказує на пропозицію які могли б зіставити це з role=group. Якщо це станеться, дерево доступності дозволить допоміжним технологіям призначити більше семантичного значення цим абзацам, як частинам підзаголовків і слоганів, якими вони є. Звучить просто, але Стів помічає проблеми, які стоять на шляху. Він також демонструє, як цей тип шаблону можна реалізувати сьогодні за допомогою атрибутів ARIA.
Поки ми завершуємо ситуацію, Матіас Отт опублікував кілька порад створення структурованого плану із заголовками. Перегляньте кінець, щоб отримати чудовий список інструментів для перевірки контурів заголовків.
