Тег source - это незаменимый инструмент для указания расположения медиаресурсов. Он позволяет браузеру точно знать, где искать файлы для таких элементов, как <audio> и <video>. Здесь кроется настоящая магия совместимости! Вы можете использовать несколько тегов source, чтобы предложить пользователю альтернативные варианты воспроизведения. Это гарантирует, что контент отобразится корректно, даже если формат основного файла не поддерживается конкретным браузером. Ключевые атрибуты media: - Определяет целевое устройство. Браузер анализирует этот параметр, чтобы решить, стоит ли вообще загружать файл для текущего экрана или типа устройства.
src: - Просто и понятно: здесь указывается точный URL-адрес медиафайла, который будет проигрываться.
type: - Важнейший параметр для оптимизации! Он задает MIME-тип ресурса. Это помогает браузеру быстро понять, сможет ли он обработать файл без лишних загрузок.
- Для видео:
video/ogg, video/mp4, video/webm - Для аудио:
audio/ogg, audio/mpeg Кстати, тег source также поддерживает глобальные атрибуты HTML. Живой пример <audio controls="controls"> <source src="song.mp3" type="audio/mp3"> Ваш браузер не поддерживает тег audio </audio>
|