Dźwięki na stronach WWW
Manna5
Dźwięki na stronach WWW
W tym artykule postaram się wyjaśnić jak wzbogacać strony WWW o dźwięki. Zanim jednak przejdziemy do samego osadzania dźwięków, należy wspomnieć o paru ważnych kwestiach.
Formaty plików dźwiękowych
- WAV - zapewnia wysoką jakość kosztem przestrzeni zajmowanej na dysku. Każda sekunda dźwięku zajmuje około 23 Kbajty, a więc ten format raczej nie nadaje się na strony WWW, z wyjątkiem krótkich nagrań jak np. odgłosy zwierząt. Aplikacja Rejestrator dźwięków wbudowana w Windows nagrywa dźwięk właśnie w tym formacie.
- MID - inne podejście do zapisu dźwięku. Zamiast fali dźwiękowej (jak WAV) pliki MID zawierają zapis nutowy melodii. Są znacznie mniejsze i to nimi będziemy się zajmować.
Inne formaty (m. in. MP3) też mogą zostać użyte, ale czasem występują problemy z ich obsługą.
Skąd brać dźwięki
Polecę tutaj dwa źródła plików dźwiękowych MID.
- MIDI World - ogromny katalog dźwięków do pobrania.
- Music MIDI 2000 - archiwum 209 plików z muzyką znanych zespołów. Nie zrażaj się układem strony.
- WavSource - tu natomiast znajdziesz pliki typu WAV, jeśli zdecydowałeś się je zastosować.
Istnieje także aplikacja WWW Online Sequencer pozwalajaca tworzyć ("sekwencjonować") własne efekty dźwiękowe oraz pobrać je w formacie MID.
Prawa autorskie dla dźwięków
Muzyka objęta jest prawami autorskimi. Uzyskanie całkowitej pewności, że unikniemy wszeklkich kłopotów jest trudne, szczególnie dlatego, że strony z dźwiękami zwykle nie podają żadnych informacji na ten temat. Jedyną w 100% pewną metodą jest samodzielne tworzenie dźwięków.
Umiar w dodawaniu dźwięków
Kolejną ważną kwestią jest to, żeby efektami dźwiękowymi nie odstraszyć odwiedzających stronę. Krótki, cichy efekt odtwarzany w momencie wejścia na stronę jest OK, lecz głośny kawałek heavy metalu odtwarzany ciągle w pętli - zdecydowanie nie.
Jak osadzić dźwięk w HTML-u
Wreszcie przebrneliśmy przez wszelkie problemy z dźwiękami i możemy przejść do samego ich osadzania w dokumencie HTML. Najprościej jest zwyczajnie utworzyć odsyłacz do pliku z dźwiękiem, o tak:
<A HREF="disney.mid">Jakaś melodia Disney Theme</A>
Gdy użytkownik kliknie taki odsyłacz, przeglądarka pobierze plik o nazwie disney.mid z serwera i prawdopodobnie uruchomi odtwarzacz, a w najgorszym razie zwyczajnie zapisze plik na dysku do ewentualnego póżniejszego odtworzenia.
Metoda z łączem do dźwięku jest najbardziej niezawodna (zadziała nawet na telefonach komórkowych z Internetem), lecz także najmniej efektowna. Użytkownik musi kliknąć łącze, żeby odtworzyć dźwięk. Nie da się tym sposobem przygotować "powitalnego" efektu dźwiękowego.
Wkomponowywanie dźwięków w stronę (wraz z automatycznym odtwarzaniem) jest dosyć skomplikowane, gdyż służą do tego różne znaczniki, każdy kompatybilny z określoną przeglądarką bądź rodziną przeglądarek. Omówię tutaj kilka wybranych metod.
Metoda I - osadzenie wtyczki Windows Media Playera
Zestaw znaczników pozwalający użyć jej do umieszczenia dźwięków na stronie wygląda następująco:
<OBJECT CLASSID="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"> <PARAM NAME="FileName" VALUE="disney.mid"> <PARAM NAME="AutoStart" VALUE="true"> Dźwięki nie działają w twojej przeglądarce. Możesz jednak <A HREF="disney.mid">pobrać ten dźwięk</A>. </OBJECT>
Jest to znacznik <OBJECT>
opatrzony identyfikatorem wtyczki Windows Media Player, wraz z parametrami zawartymi w znacznikach <PARAM>
. Najważniejszy parametr FileName
określa nazwę pliku dźwiękowego, natomiast AutoStart
- czy rozpocząć odtwarzanie samoczynnie (wartość true
, odpowiednie dla efektów dźwiękowych), czy też dopiero po kliknięciu przycisku Play (wartość false
, odpowiednie dla muzyki). Dodając atrybuty WIDTH
i HEIGHT
do znacznika <OBJECT>
pozwala ustawić wymiary okienka odtwarzania, a przypisując obu wartość zerową ukryjemy je.
Tekst zawarty obok parametrów zostanie wyświetlony w przypadku, kiedy osadzenie dźwięku nie zadziała. Warto powiadomić o sytuacji i ewentualnie dać możliwość pobrania dźwięku.
Metoda II - uogólnione osadzenie pliku
Sposób powyższy jest kompatybilny tylko z Internet Explorerem na Windowsie, gdyż wymaga on dostępności tej konkretnej wtyczki. Można jednak również po prostu wkskazać plik i jego typ, pozostawiając wybór jak go potraktować. Wtedy należy wykorzystać atrybuty DATA
i opcjonalnie TYPE
tego samego znacznika. Oto przykład:
<OBJECT DATA="disney.mid" TYPE="audio/midi"> Dźwięki nie działają w twojej przeglądarce. Możesz jednak <A HREF="disney.mid">pobrać ten dźwięk</A>. </OBJECT>
To rozwiązanie nie jest już w żaden sposób związane z konkretnym odtwarzaczem.
Metoda III, najlepsza - znacznik dźwięku z HTML5
W wersji 5 języka HTML nareszcie dodano standardowy znacznik do wstawiania dźwięków, i to jego najlepiej używać, jeżeli bierzemy pod uwagę przeglądarki obsługujące najnowszy standard. Oto przykład osadzenia dźwięku, tym razem w formacie WAV, za pomocą nowego znacznika jakim jest <AUDIO>
.
<AUDIO SRC="intro.wav" TYPE="audio/wave" CONTROLS> <!-- Tekst umieszczony tutaj pojawi się, jeżeli przeglądarka nie obsługuje danego formatu dźwięku lub znacznika AUDIO. --> </AUDIO>
Atrybut pusty CONTROLS
powoduje wyświetlenie kontrolek odtwarzania, a nieużyty tutaj AUTOPLAY
- samoczynne rozpoczęcie odtwarzania.