Тег <noscript>
Описание
Тег <noscript> (от англ. "no script") предоставляет альтернативное содержимое, которое отображается, когда браузер не поддерживает JavaScript или его выполнение отключено пользователем. Это важный элемент для обеспечения доступности и постепенной деградации функциональности.
<script>
document.write("Привет, JavaScript работает!");
</script>
<noscript>
Ваш браузер не поддерживает JavaScript или он отключён.
</noscript>
Ключевые особенности:
- Содержимое отображается только если JavaScript недоступен
- Может содержать любые HTML-элементы, включая стили
- Работает как в
<head>, так и в<body> - Важен для accessibility (доступности) и SEO
- Поддерживается всеми современными браузерами
<div id="dynamic-content"></div>
<noscript>
<div class="no-js-content">
<h3>Альтернативное содержимое</h3>
<p>Для полной функциональности включите JavaScript</p>
<a href="/simple-version">Перейти на простую версию сайта</a>
</div>
<style>
.no-js-content { background: #f0f0f0; padding: 20px; }
</style>
</noscript>
Рекомендации по использованию:
- Используйте для критически важного контента, который зависит от JavaScript
- Предоставляйте осмысленную альтернативу, а не просто сообщение об ошибке
- В сложных приложениях предлагайте ссылку на простую HTML-версию
- Можно использовать для обнаружения отключенного JavaScript в CSS
- Сочетайте с принципом прогрессивного улучшения
Современные практики:
- В прогрессивных веб-приложениях (PWA) используйте для сообщения о необходимости JavaScript
- Для аналитики можно отслеживать показы noscript-контента
- В SSR (Server-Side Rendering) часто используется как fallback
Тег <noscript> остаётся важным инструментом для создания устойчивых веб-приложений, работающих даже в условиях ограничений или при отключенном JavaScript.
Атрибуты
| accesskey | Горячая клавиша для активации элемента |
| class | CSS-классы для стилизации элемента |
| contenteditable | Разрешает редактирование содержимого |
| data-* | Пользовательские данные элемента |
| dir | Направление текста (ltr|rtl) |
| hidden | Скрывает элемент от отображения |
| id | Уникальный идентификатор элемента |
| lang | Язык содержимого элемента |
| spellcheck | Включает проверку орфографии |
| style | Инлайновые CSS-стили элемента |
| tabindex | Порядок перехода при навигации по Tab |
| title | Всплывающая подсказка для элемента |
| translate | Определяет возможность перевода содержимого |
Поддержка браузерами
 |
 |
 |
 |
 |
|---|---|---|---|---|
| 4.0 | 1.0 | 4.0 | 1.0 | 1.0 |