Звезда не активнаЗвезда не активнаЗвезда не активнаЗвезда не активнаЗвезда не активна
 

        Я уверена, что совсем скоро разработчики откажутся от использования flash на своих и не своих сайтах. С выходом HTML5 и CSS3 использование флеш на сайтах оказывается уже ненужным и устаревшим решением в веб-дизайне и программировании, к тому же он грузит процессор. Но пока ещё не все популярные браузеры поддерживают новые версии HTML5 и CSS3, поэтому мы ещё пока пользуемся решениями на базе flash. Например, при вставке аудио на сайт.


Как вставить аудио на сайт?

Это действительно очень просто. Необходимо залить на сервер 2 файла (если вы хотите выложить всего 1 песню):

  1. Аудиоплеер (в формате .swf)
  2. Аудиотрек, песню, и т.п. (в формате .mp3)

Скачать сам аудиоплеер можно по ссылке. На том же сайте есть руководство по сборке плеера, то бишь, по настройке самого кода, чтобы аудиоплеер отображался на сайте так, как вам нужно.

Рекомендации по использовании аудио на сайте:

  1. Желательно максимально уменьшить размер файла, сохранив при этом оптимальное качество при прослушивании записи. Это уменьшит и вам трафик и даст возможность всем пользователям слушать трек без прерываний.
  2. Помните про авторские права. Если трек не ваш, нужно уточнить в свободном ли доступе данный аудио-файл.

Проигрывание нескольких треков в плей-листе

Реализацию данной возможности нашла на сайте, точнее, блоге htmlka. Автор блога рассказывает о нескольких способах вставки аудио на сайт. Всё доходчиво и наглядно описано. Для самых ленивых сразу даётся готовый код. Вы можете выбрать себе понравившийся вариант. 


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


Скачать архив - аудиоплеер и пример кода для его вывода


Вот и всё. Если что неясно – пишите, я обязательно постараюсь помочь.

Если найдёте вариант лучше и проще – поделитесь ссылочкой, пожалуйста.

Спасибо!


Хорошего дня!