src=filename - чзвуковой файл

lоор=n - количество повторов (infinite - непрерывно)

volume - громкость (от 10000 до 0,0 - значение по умолчанию)

balance - баланс между левой и правой колонками, значение может изменяться от -10000 (максимум для левого канала) до 10000 (максимум для правого канала).

Мы уже говорили об использовании HTML5 и почему это актуально на сегодняшний день. Теперь остановимся более подробно на вопросе "Как вставить аудио на сайт с помощью HTML5".

Добавить музыку на сайт можно с помощью тега audio . Пример простейшей реализации этого тега:

Но опять же, как и в случае с видео, не всё так просто. Не все браузеры поддерживают нужные аудио-кодеки. Взглянем на таблицу:

Как видно из таблицы, наиболее "универсальным" является формат.wav. Но, тем не менее, его не поддерживает Internet Explorer. Поэтому, рекомендуется конвертировать аудиофайл в несколько форматов и использовать несколько аудио-кодеков. Следующий пример иллюстрирует один из способов добавления аудио HTML на веб-страницу:

Внешний вид аудиоплеера будет зависеть от браузера, вот, например, вид аудиоплеера в браузере Firefox:

Атрибуты тега AUDIO

К основным атрибутам тега audio относятся:

• src - путь к аудиофайлу (может задаваться отдельно с помощью вложенного тега source );
• controls - отображается панель управления аудио (play, pause, volume и т.д.);
• autoplay - воспроизводит аудиофайл сразу после загрузки веб-страницы;
• loop - циклическое воспроизведение;

Вложенный тег source может иметь следующие атрибуты:

• src - путь к аудиофайлу;
• type - тип аудио-источника;
• media - тип устройства, на котором будет проигрываться аудиофайл (all - на всех устройствах, tv - телевизор и т.д.);

Зачем нужна музыка на сайте?

Довольно интересный вопрос, воспроизведение музыкальных или голосовых файлов на сайте, или встроенный плеер помогает посетителям сайта расслабиться, вызывает положительные эмоции и настроивает на нужный лад, так сказать облегчает взаимодействие с сайтом. Но данные эффекты работают только в том случае, когда музыка на сайте подобрана правильно и громкость звука не превышает допустимые пределы, иначе все ваши старания окажутся напрасными и вызовут отрицательные эмоции у посетителей сайта.

Как вставить аудио (музыку) на сайт в html?

Нам часто задают такой вопрос, музыка на сайте является актуальным и креативным элементом, а способов её воспроизведения много и их не так сложно внедрить. Начнем с того, что каждый пользователь Глобальной Сети использует какой либо браузер для выхода в Интернет, а общей и универсальной технологии воспроизведения звуковых и музыкальных файлов нет, каждый браузер работает по своим собственным алгоритмам и они несколько отличаются друг от друга, поэтому при воспроизведении музыки с помощью внедрения в HTML код страницы могут возникать проблемы. Но как Вы знаете, все проблемы решаемы!

Вставить музыку на сайт HTML, JavaScript, jQuery, AJAX способы:

Создание аудио проигрывателя музыки на сайте или плеера

Технология проста, создается файл проигрывателя, чтобы он не нагружал сайт или сервер выбираем технологию которую будем использовать: JavaScript, jQuery, AJAX . На основе выбранной технологии разрабатываем скрипт для нашего сайта и вставляем на сайт. Скрипт создается в зависимости от того, что Вам нужно: автоматическое воспроизведение фоновой музыки на сайте или управляемый посетителем плеер. Далее создаем папку в корне сайта для музыки и загружаем в нее аудио файлы.

Или как альтернативный сопсоб можно создать плеер по флеш-технологии (Flash), такой плеер будет смотреться более эффектно. Правда выйдет дороже и тяжелее для сайта (повысит время загрузки страниц сайта).

2 способ.

Установка музыки на сайт с помощью HTML

Используя возможности HTML и браузера можно вставить на сайт плеер или фоновую музыку. Технология так же проста: создается HTML5 код с тегом "audio" и этот код прописывается в сайт, а когда пользователь заходит на сайт он видит минимизированный плеер, посетитель нажимает кнопку плэй или автоматически начинает играть фоновая музыка. Вид плеера будет зависеть от браузера с которого зашел посетитель, но функциональность останется стандартной: кнопки Play, Stop, Next, Prev, Volume. Выглядит плеер с HTML кодом вот так:

Cам код для вставки выглядит так:

Как вы могли заметить команда "controls autoplay" включает автопроигрывание музыки как только посетитель заходит на сайт.

Альтернативный вариант HTML кода это тег "bgsound", это вообще не использовать визуальный плеер, при посещении сайта начнет играть музыка на сайте, но регулировать громкость, поставить на паузу и т.д. пользователь не сможет. Настройка громкости воспроизведения звукового файла настраивается в самом коде.

Форматы звуковых файлов для проигрывания музыки на сайте могут быть: WAV, AU, MIDI, MP3, OGG (расширения). Музыкальные файлы загружаются на сайт, либо используются ссылки на те сайты, где располагается звуковой файл, главное, чтобы он находился в открытом доступе.

Однако зачастую интернет-контент уникален, например, включает в себя не только музыку, но и комментарии исполнителей, интервью, всяческие байки о создании и т. п.

Для загрузки потокового контента из Сети создано невероятно много утилит - одни из них - универсальные, другие - «заточенные» под определенные сервисы. Какие-то программы получают доступ к исходным аудио- и видеофайлам и просто побайтово считывают их из Интернета, а некоторые умеют докачивать, загружать файлы в несколько потоков, работать с группами файлов и т. п. Описание потока может представлять собой xml-файл в формате ASX (для Windows Media Player) или храниться в файлах формата RealAudio (расширения.ra и.rm - для аудио, .rv - для видео) и др. Доставляются такие потоки не только по стандартным протоколам http, udb / tcp, но и по специальным - rtsp, mms, rtp, а также посредством пиринговых технологий, применяемых, к примеру, в таком популярном сервисе интернет-телевидения, как SopCast. Естественно, чтобы воспроизвести эти форматы, необходим соответствующий клиент - скажем, плееры Windows Media Player, медиапроигрыватель VLC и проч. Последний, к слову, умеет не только проигрывать потоковый контент, но и сохранять его на локальных дисках. Именно им мы и воспользуемся, ведь большинство ресурсов ему вполне по зубам.

Итак, чтобы записать, в частности, программу онлайнового радио или подкаст, необходимо прежде получить ссылку на потоковый контент, а затем ввести ее в VLC-плеере. Если на сайте для воспроизведения аудио используется Windows Media Player, добраться до ссылки будет просто. Нужно щелкнуть правой кнопкой на встроенном на странице сайта проигрывателе и выбрать пункт «Свойства». В поле «Размещение» следует найти адрес и скопировать его в буфер обмена. Если же на сайте применяется Flash-плеер или проигрыватель, разработанный на базе HTML5, то, вполне вероятно, придется порыться в исходном коде страницы или обратиться к специальным утилитам для «выдирания» ссылок.

Следующее действие - конвертирование потокового аудио. Пожалуй, не скажешь, что эта операция в VLC - простая и очевидная. Скорее, наоборот, она громоздкая и путаная. Коман­дой меню «Медиа Открыть URL» потоковый контент можно записать в файл. По умолчанию VLC настроен на воспроизведение ссылки, и, чтобы сохранить ее в файл, нужно в открывшемся диалоговом окне изменить режим на «Конвертировать». Диалог при этом изменится - в новом окне указывается конечный файл и выбирается профиль (т. е. формат, в котором будет сохранена запись). После нажатия кнопки «Начать» плеер приступает к копированию потокового аудио в файл. Делает он это совершенно незаметно и в принципе способен писать сколь угодно долго - данный процесс придется контролировать самостоятельно. Следует учитывать, что при останове и продолжении процесса конвертирования результирующий файл обнуляется. Так что нужно переименовывать ранее сохраненные файлы.

Совершенно очевидно, что каждый раз повторять подобную операцию весьма хлопотно. Особенно если требуется писать различные потоки в разное время. Плеер VLC предоставляет простейшее средство загрузки по расписанию, получившее название «Конфигуратор VLC». В нем указывается, что и куда писать (эти параметры настраивают так же, как описывалось выше) и насколько долго. Скажем, если нужно ежедневно записывать некую программу интернет-радио, стоит задать в диалоге опции «Повтор» и «Интервал между повторами». Теперь программа после запуска будет самостоятельно конвертировать потоковый контент.

Кстати, VLC поможет и при преобразовании потоков, например файлов формата ASF в более привычный и понимаемый карманными плеерами MP3. Эту операцию можно проделывать либо вручную, каждый раз конвертируя локальный файл, либо автоматически с помощью несложного скрипта на Powershell, входящего, как известно, в состав Windows 7 и доступного в более ранних версиях данной операционной системы. Скрипту передаются несколько параметров - путь к файлам, маска файлов и опционально результирующая папка, куда складируются файлы (если она не указана, файлы записываются в исходный каталог). Внутри цикла вызывается программа VLC, которой пересылаются параметры: что кодировать, куда записывать и собственно параметры кодирования. По окончании кодирования VLC выгружается из оперативной памяти. Убедиться в этом позволяет последняя конструкция, ожидающая, пока процесс выгрузится из памяти. Ввести такой скрипт можно в любом текстовом редакторе - блокноте или специальном «визуальном» редакторе Powershell ISE. Если сохранить его в файле, к примеру convert.ps1, то он запускается конструкцией вида:

.  convert.ps1 c:  files  music *.asf.

В завершение стоит отметить еще несколько особенностей скрипта. В операционной системе Windows автоматически не прописываются пути к программам, так что в скрипте необходимо также указать путь к vlc.exe: в 64‑разрядной версии - C:  ’Program Files (x86) ’  VideoLAN  VLC  (обратите внимание, что строки с пробелами заключены в кавычки) и в 32‑разрядной - C:  ’Program Files’  VideoLAN  VLC  . Кроме того, вам следует убедиться, что до запуска скрипта вы покинули программу VLC, иначе метод waitforexit () будет работать бесконечно долго (из-за того, что вызываемая в скрипте программа завершит работу, но ее копия останется). Конечно, в скрипте допустимо обрабатывать еще и идентификаторы процессов, но такая возможность лишь усложнит его. Чтобы решить данную проблему, следует попросту добавить в начало скрипта принудительное завершение всех запущенных VLC: ps vlc* | % { $_.kill ()}. Еще одна особенность связана с системой безопасности Windows 7, требующей, чтобы все скрипты были подписаны. Обойти такое ограничение поможет команда Set-ExecutionPolicy RemoteSigned, запускать которую нужно в Powershell от имени администратора.

Скрипт convert.ps1 на Powershell дляконвертирования потокового контента в MP3

param ( $inputpath, $wildcard, $outputpath = $inputpath)

ls -path $inputpath  $wildcard | % {

write-host $outputfile

vlc -i dummy $_.fullname ¨:sout=#transcode {acodec=mp3,ab=128,channels=2}:standard {access=file,mux=asf,dst=$outputfile}¨ vlc://quit

Извлечение аудио из FLV-роликов

Другой пример совместного применения VLC и Powershell - это извлечение аудио из Flash-видеороликов формата FLV. Подобные видеоклипы хранятся на специализированных порталах, таких, например, как небезызвестный YouTube. Конечно, Google и другие владельцы видеохостингов всячески препятствуют скачиванию контента, но всегда найдутся способы обойти защиту и заполучить понравившийся ролик…

Впрочем, обсуждаемая здесь задача заключается в следующем: как из загруженного любым известным способом FLV-файла извлечь аудио, чтобы, к примеру, слушать его в карманном плеере. Подобная операция вполне по силам VLC, причем и в GUI, и из командной строки. Кстати, в первом случае необходимо проделать практически тот же набор действий, что и раньше: выбрать в меню команду «Медиа - Конвертировать / Сохранить», указать исходный и результирующий файлы, а также параметры конвертирования, т. е. соответствующий кодек.

Для ручного преобразования с помощью Powershell нужно, как и в прошлый раз, сконструировать небольшой скрипт (назовем его flv2mp.ps1), которому пересылаются имена исходной и результирующей папок (по умолчанию - такая же, как и исходная). Вся его хитрость заключается в переданных параметрах: поскольку видео не требуется, стоит использовать параметр dummy, в блоке standard определить параметры файла, а чтобы скрипт не докучал всплывающими окнами, попросту блокировать их опцией –dummy-quiet –sout.

param ( $inputpath, $outputpath = $inputpath)

ls -path $inputpath  *.flv | % {

$outputfile = join-path $outputpath ($_.name.replace ($_.extension, ‘.mp3’))

write-host $outputfile

vlc $filename -I dummy --dummy-quiet --sout ¨#transcode {acodec=mp3,vcodec=dummy}:standard {access=file,mux=raw,dst=’$outputfile’}¨ vlc://quit

ps vlc | % { $_.waitforexit ()}

Музыка на сайте - это скорее редкость, чем норма. Вставляя музыку на сайт, нужно понимать, что некоторых пользователей она может и вовсе оттолкнуть. В этой статье мы рассмотрим несколько вариантов вставки музыки на сайт, а также рассмотрим как сделать фоновую музыку.

Как вставить фоновую музыку на сайт

Вставка фоновой музыки на сайт самый опасный вариант в плане потери посетителей. Потому что фоновою музыку мало того, что нельзя никак выключить, так к тому же и громкость ее никак не регулируется (все зависит от текущей громкости на компьютере). Так что надо сто раз подумать, прежде чем вставлять фоновую музыку.

Есть два способа для вставки музыки в html

Вариант 1. Через html тег

У тега есть несколько атрибутов:

• loop="значение" - количество повторений музыки (если -1, то повторяется бесконечно)
• balance="значение" - стереобаланс (от -10000 до 10000)
• volume="значение" - громкость (0 максимум, -10000 минимум)

Музыка будет играть автоматически при загрузке страницы.

Например

Вариант 2. Через тег

У тега возможно использование следующих атрибутов:

• width="значение" - ширина (в пикселях или процентах)
• height="значение" - высота (в пикселях или процентах)
• align="значение" - выравнивание (left - слева, right - справа, center - по центру)
• hidden="значение" - видимость панели (true - скрыть, false - показывать), по умолчанию панель видна
• autostart="значение" - проигрывать музыку при загрузке (true - да, false - нет)
• loop="значение" - значение true - проигрывать по кругу, false - один раз

Например

У каждого браузера штатный проигрыватель будет выглядеть по разному, поэтому рассматривать каждый из них в отдельности мы не будем.

В html5 можно использовать тег

Смысл использования тега

Следующие атрибуты можно использовать:

• autoplay="значение" - включить музыку сразу при загрузке страницы
• controls="значение" - отображать панель управления плеера в браузере
• loop="значение" - отвечает за цикличность
• preload="значение" - загружать музыку сразу с загрузкой страницы

Рассмотренные варианты на мой взгляд не являются идеальными решениями, поскольку все базируются на штатных проигрывателях. У каждого браузера будет свой штатный проигрыватель по умолчанию, а в каких-то он вообще может не работать. Поэтому лучше всего скачать плеер к себе на сайт и уже с него загружать музыку. У такого плеера будет функции остановки, настройки громкости и т.п. - весь необходимый набор для простого пользователя.