HTML5 го олеснува додавањето звук и музика на вашите веб-страници со елементот. Всушност, најтешкото нешто што треба да направите е да создадете повеќе извори што ви се потребни за да бидете сигурни дека вашите звучни датотеки играат на најширокиот спектар на прелистувачи.
Придобивката од користењето на HTML5 е тоа што можете да го вградите звукот само со користење на неколку ознаки. Прелистувачите потоа го пуштаат звукот исто како да прикажуваат слика кога користите елемент IMG .
Како да додадете звук на HTML5 веб-страница
Ќе ви треба HTML Editor , звучна датотека (по можност во MP3 формат) и конвертор на звучни датотеки.
- Прво, ви треба звучна датотека. Најдобро е да ја снимите датотеката како MP3 ( .mp3 ), бидејќи има висок квалитет на звукот и е поддржана од повеќето прелистувачи (Android 2.3+, Chrome 6+, IE 9+, iOS 3+ и Safari 5+).
- Конвертирајте ја вашата датотека во Vorbis формат ( .ogg ) за да додадете во Firefox 3.6+ и Opera 10.5 + поддршка. Можете да користите конвертор како оној што е пронајден на Vorbis.com. Исто така, можете да го конвертирате вашиот MP3 во WAV формат на датотека ( .wav ) за да добиете Firefox и Opera поддршка. Препорачувам да ја објавите вашата датотека во сите три типа, само за безбедност, но најмногу ви се потребни MP3 и уште еден друг тип.
- Поставете ги сите аудио-датотеки на вашиот веб-сервер и направете белешка за директориумот во кој сте ги зачувале. Добра идеја е да ги поставите во под-директориум само за аудио-датотеки, како што повеќето дизајнери зачувуваат слики во директориумот за слики .
- Додајте го елементот AUDIO во вашата HTML датотека каде што сакате да се прикажат контролите за звучни датотеки. <аудио контроли>
- Ставете SOURCE елементи за секоја аудио датотека што ја вчитувате во елементот AUDIO :
-
- Било кој HTML во внатрешноста на АУДИО елементот ќе се користи како резервна копија за прелистувачите кои не го поддржуваат елементот AUDIO . Па додадете некои HTML. Најлесен начин е да додадете HTML за да дозволите да ја преземат датотеката, но исто така можете да користите HTML 4.01 вградливи методи за да го пуштите звукот. Еве едноставна резервна копија:
Вашиот прелистувач не поддржува аудио репродукција, преземете ја датотеката:
- Последното нешто што треба да направите е да го затворите вашиот AUDIO елемент:
- Кога ќе завршите, вашиот HTML треба да изгледа вака: <аудио контроли>
Дополнителни совети
- Бидете сигурни да го користите HTML5 doctype (), така што HTML ќе валидира
- Прегледајте ги атрибутите достапни за елементот за да видите кои други опции можете да ги додадете во вашиот елемент.
- Имајте на ум дека ние го поставите HTML за да ги вклучувате стандардните контроли и автоматското исклучување е исклучено. Можете, се разбира, да го промените тоа, но запомнете дека многу луѓе наоѓаат звук кој автоматски започнува / не може да контролира за да биде досаден во најдобар случај, и честопати ќе ја напушти страницата кога тоа ќе се случи.