Атрибут hidden тега <blockquote>

Описание

Атрибут hidden для тега <blockquote> позволяет скрыть цитату из видимого содержимого страницы. Однако это следует использовать с осторожностью, так как:

  • Цитаты по своей природе предназначены для отображения
  • Скрытие семантического контента может ухудшить доступность
  • Альтернативные методы скрытия могут быть более подходящими

Пример использования:

<blockquote hidden cite="https://example.com/source"> <p>Эта цитата не будет отображаться на странице</p> </blockquote>

Когда использовать hidden для цитат:

Сценарий Альтернатива
Временное скрытие перед показом CSS display: none с JavaScript
Резервный контент aria-hidden="true"
SEO-оптимизация Не скрывайте важные цитаты

Правильные альтернативы:

<!-- CSS-скрытие --> <blockquote class="temp-hidden" cite="https://example.com"> <p>Эта цитата может быть показана позже</p> </blockquote> <!-- ARIA-скрытие --> <blockquote aria-hidden="true"> <p>Цитата, скрытая от скринридеров</p> </blockquote> <style> .temp-hidden { display: none; /* Можно изменить через JS */ } </style>

Особенности работы:

  • Скрытый элемент полностью удаляется из layout
  • Доступен в DOM и может быть показан через JavaScript
  • Не влияет на производительность
  • Может быть проигнорирован скринридерами

Важно: Не используйте hidden для контента, который должен быть доступен для SEO или скринридеров. Вместо этого используйте CSS-скрытие с aria-hidden.

Рекомендации:

  • Избегайте скрытия важных цитат
  • Для временного скрытия предпочитайте CSS-классы
  • Сохраняйте атрибуты cite даже для скрытых цитат
  • Тестируйте доступность скрытого контента