К содержимому
EARN
TO
LEARN
Лента
Сайты
Видео
Графика
/
Добавить
Назад
Редактировать материал
СОХРАНИ ВАЖНОЕ
Название
Направление
AI
Программирование
Математика
Работа и доход
Мышление
Веб-дизайн
Видео и сторителлинг
Камера и свет
Формат
Конспект
Практика
Разбор
Урок
Статус
На потом
Изучаю
Применено
Коротко о главном
Видео в личном интерфейсе должно быть локальным, управляемым и заменяемым неподвижным изображением, а не обязательным фоном страницы.
Текст
Предпросмотр
Markdown: ## заголовок · **жирный** · списки · код
Текст материала
## Результат Вы добавите короткий локальный видеоматериал так, чтобы он открывался без внешней сети и не мешал чтению. Видео может показать процесс, тонкую фактуру или разбор этапов, но не должно быть единственным носителем инструкции. Poster — это первая неподвижная картинка, по которой пользователь понимает тему до загрузки ролика. Для декоративного медиа разумнее начинать с poster и явной кнопки воспроизведения. Качество здесь означает не максимальное разрешение, а достаточную разборчивость при предсказуемой загрузке. Сначала посмотрите poster на ширине карточки: если смысл кадра уже понятен, видео станет дополнительной глубиной, а не препятствием. Если ролик содержит речь или инструкцию, добавьте текстовую расшифровку либо краткие этапы рядом с плеером. ## Шаги 1. Сформулируйте, какой факт показывает ролик и можно ли передать его подписью или серией кадров. Если можно, подготовьте текстовое резюме рядом с видео. 2. Сохраните видео и poster внутри проекта с проверяемым происхождением. Не выдавайте внешний URL за локально доступный материал. 3. Укажите `controls`, `poster` и метаданные; не полагайтесь на autoplay как на способ донести содержание. 4. Не загружайте большие ролики в каждой карточке каталога: там используйте poster и открывайте медиа по действию пользователя. 5. При reduced motion не включайте автоматические циклы. У пользователя должна оставаться возможность поставить воспроизведение на паузу. ## Применимый код ```html <video controls preload="metadata" poster="/media/lesson-poster.webp"> <source src="/media/lesson.webm" type="video/webm"> Ваш браузер не поддерживает видео. </video> ``` ## Критерий проверки При отключённой сети poster и подпись всё равно объясняют материал; ролик не воспроизводится сам, доступна пауза, а список карточек не скачивает все видео заранее. ### Источник - [Web accessibility for seizures and physical reactions — MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/Guides/Seizure_disorders)
Следующий шаг
Для одного видео подготовьте poster, подпись в две строки и проверку сценария без сети.
Ссылка на источник
Сама ссылка требует интернета. Важное содержание сохраните в тексте или вложении.
Изображения, GIF, видео и PDF
До 6 файлов за одно сохранение, до 100 МБ каждый. Файлы сохраняются на компьютере.
Сохранение по кнопке
Отмена
Сохранить материал