Уявімо сторінку послуги: ціна, обмеження й порядок звернення заховані у дванадцяти однакових рядках. Екран виглядає охайно, але людині потрібно відкрити все, щоб зрозуміти пропозицію. Це умовний редакційний приклад, а не опис роботи клієнта. Компактність корисна лише тоді, коли вона не перетворює читання на пошук прихованих умов.
Розділіть головне й додаткове
Коротке пояснення послуги, ключові обмеження та зрозумілий наступний крок краще залишити видимими. Деталі підготовки, винятки й пояснення термінів можна винести у блоки, що розкриваються. Перед версткою позначте кожен абзац: потрібен усім чи лише частині читачів? Ця проста редакторська операція важливіша за вибір стрілочки.
Заголовок має обіцяти конкретну відповідь
«Що входить у підтримку сайту?» допомагає орієнтуватися краще, ніж «Додаткова інформація». Формулюйте запитання словами відвідувача, а не внутрішніми назвами відділів. Усередині починайте з прямої відповіді, після неї додавайте умови й посилання на відповідну сторінку. Не змушуйте відкривати наступний блок заради завершення попередньої думки.
Спочатку стандартна поведінка
HTML має елементи details і summary для показу та приховування змісту. Для простих пояснень це розумна початкова точка, яку все одно слід перевірити у цільових браузерах. Якщо потрібен власний компонент, рекомендації W3C для disclosure передбачають кнопку, керування клавішами Enter і пробіл та узгоджений стан aria-expanded. Намальований знак плюс сам по собі не забезпечує такої поведінки.
Не закривайте відповідь без потреби
Коли людина порівнює два пояснення, примусове закриття першого може заважати. Для довідкового розділу розгляньте можливість тримати кілька відповідей відкритими. Якщо обрана інша поведінка, перевірте її на реальному завданні: знайти умову, зіставити варіанти, повернутися до потрібного пункту. Універсальної кількості блоків для будь-якого сайту немає.
Перевірка перед випуском
Пройдіть розділ клавіатурою, збільшіть текст, відкрийте довгу відповідь на вузькому екрані. Переконайтеся, що видно фокус, назви не обрізані, а розкритий текст не перекриває сусідні кнопки. Перевірте з допоміжною технологією, чи зрозуміло повідомляється стан. Окремо перечитайте сторінку із закритими блоками: чи можна зрозуміти головне без жодного натискання?
Наш редакційний принцип: спочатку повна зрозуміла відповідь, потім спосіб її подачі. FAQ не замінює логічну структуру сайту й не є обіцянкою позицій у пошуку. Про назви переходів читайте в матеріалі «Посилання, які пояснюють шлях».