Як вставити звук на сторінку - тридцять перший урок - дикі уроки html
Звук або какофонія голих тіток
До мене часто приходять листи з проханням навчити вставляти на сторінку звук. І таке просте питання ставив мене просто в глухий кут. Відповісти коротко - все одно, що нічого не відповісти. Відповісти повно і ясно - значить в листі пояснити цілий урок. І я пропонувала всім стражденним потерпіти трохи або звернутися до інших вчителям.
Але ось, нарешті настав той день, коли я можу розповісти світу про звук. Так що думаю, хто ще не знав досі, як це зробити, той розкошуючи зможе не тільки сам зробити музичну сторінку. але і набриднути іншим своїми порадами "як, куди і навіщо".
Отже, звук. Звуки вони бувають різними. Це може бути і просто фонове звуковий супровід. Наприклад, ви завантажили якусь сторінку в надії спокійно відпочити і насолодитися чудовими видами моря з оголеними красунями на березі в той час, як строгий шеф відвернувся до вікна, а разом з шумом прибою і натовпом голих тіток в ваш офіс вривається рок-група з металістами і барабанщиками. А кнопки, щоб вимкнути цю ось кокофонію немає. Думаю, шеф забуде навіщо визирав у вікно, думаю, він для початку підстрибне від несподіванки, потім візьме себе в руки і мееееедленной ходою підійде до вас, щоб переконатися зайвий раз у вашій профпридатності.
А ще можна зробити анімацію зі звуком. Прикиньте, сидить собачка, дивиться на вас, махає хвостиком і гавкає, гавкає! Весело, правда? Можна зробити, щоб вона брехати сама по собі, а можна тільки при натисканні на цю собачку або на кнопку з написом "голос!".
А ще можна встановити аудіо в режимі реального часу. Ось зайшов відвідувач на ваш сайт і раптом згадав, що він не чув прогнозу погоди, і він, звичайно втік би відразу до радіоприймача! Тому як деякі без прогнозу погоди на вулицю не вийдуть! Але тільки не цього разу! Тому як у вас - ось, пожалста! Є кнопка, а на ній напис "Чудик, тисни сюди, дізнаєшся чи потрібен тобі сьогодні парасольку". І хіба куди цей відвідувач піде? Так він ваще залишиться жити на вашому сайті! Навіщо йому кудись йти, коли у вас все є?
Ну, а про різні викрутаси по установці зовнішніх програвачів і завантаженні всяких там музичних файлів я взагалі мовчу, бо говорити про це можна нескінченно! Але ж мені ще потрібно пояснити як все це потрібно встановлювати. Так що припиняю базікати дурниці, так що навіть і не просіть!
Так! Ще забула. Ви ж можете записати свій голос. Заспівати пісеньку, записати її і помістити на власний сайт. Тоді вже точно вас ніхто не дорікне в плагіаті, тому що все, що ви вякне - це ваша особиста. І ніхто не зможе це у вас відняти. Навіть копірайтік можете поставити. Щоб не повадно було деяким.
Якщо я що й забула, то обов'язково додам в процесі уроку. Звуки можна зчитувати, оцифровувати або створювати прямо на комп'ютері. Складно це або просто? Все залежить від того, що ви збираєтеся робити. Якщо просто квакнути в мікрофон - це одне, а якщо написати симфонію - погодьтеся, це трохи інше.
Створення звукових файлів невеликих розмірів-
Якщо ви такий невгамовний, і вирішили все-таки помістити музику на свій сайт, то повинні знати, що багато звукові файли мають величезні розміри. Тому вам доведеться вибирати не тільки формат файлу, але і коефіцієнт його стиснення. І добитися того, щоб музика була схожа на музику, а не на хрипіння або там шипіння, і завантажувалася швидко.
Взагалі, на якість звучання впливають дві величини - частота дискретизації і глибина звуку.
Частота дискретизації впливає на діапазон оцифрованого звуку і визначає високі і низькі тони. Вимірюється в кілогерцах. Файли, записані із застосуванням більш високої частоти, мають більший розмір. Найбільш часто використовують такі частоти: 8 кГц, 11 кГц, 22,05 кГц, 44,1 кГц і 48 кГц. Деякі звуки відтворюються добре і при низькій частоті дискретизації. Наприклад, мова, яка не залежить від діапазону відтворюваних частот.
Дозвіл дискретизації (або, простіше кажучи, глибина звуку) визначає діапазон звуку щодо його верхніх і нижніх тонів. Чим більше дозвіл - тим більше розмір файлу. Прям як і в зображенні! При редагуванні можна вибирати дозвіл дискретизації. Оскільки при невисокій частоті з'являється шум, то для кожного елемента необхідно визначити мінімальний дозвіл, яке можна встановити, не доводячи слухачів до сказу. Існують наступні значення дозволу дискретизації. 8-розрядний моно; 8-розрядний стерео; 16-розрядний моно і 16-розрядний стерео.
Як правило, при першому оцифровування звуку його слід записувати при 16-розрядному дозволі і частоті 44,1 кГц. Ну, а далі, в процесі обробки за допомогою програм редагування звуку, дозвіл дискретизації можна зменшити до 8 бітів, а частоту - до 22, 05 кГц. А можна і взагалі звести до нуля і дати можливість відвідувачам відпочити в тиші.
нешкідливі поради
Існують різні програми для перетворення файлів між різними форматами. Прикладом може служити програма Premiere. І ось які можуть бути поради:
- Оцифровувати звук слід при стандартних параметрах (44 кГц і 16 бітів). При необхідності можна уменьшеть розмір файлу до 22 або 11 кГц. Як правило, при більш низьких частотах дискретизації "обрізаються" високі тони, і звук стає глухим. Для мови або звуків, для яких високі частоти не мають особливого значення, зниження частоти дискретизації призводить до створення файлів невеликого розміру при приемлимом якості звучання.
- Зниження в два рази частоти дискретизації зменшує файл вдвічі. Крім того, перехід звучання від стерео до Монозвучання також зменшує файл вдвічі.
- Якщо розмір 16-розрядної звукового файлу занадто великий, можна застосувати алгоритм згладжування. В результаті зменшується розмір дискретизації до 8 бітів. Однак, застосування згладжування призводить до появи шуму, який особливо помітний в паузах.
- Через це шуму не рекомендується застосовувати згладжування звукових файлів, що містять мова. Однак для важкого року або техно це буде цілком виправдано. Там і без того гуркоту вистачає. Якщо не згладжувати не виходить, але дуже хочеться, можна піти іншим шляхом - повторно відцифрованих 16-розрядний файл шляхом їх відтворення при 16 бітах і 44,1 кГц і записи за допомогою цифрового перетворювача при 8 бітах. У багатьох випадках цей спосіб дає більш якісне звучання.
- У найменуванні звукових файлів не повинні міститися прогалини. Довжина файлів не повинна бути більше 8 символів, а розширення і того менше - не більше трьох символів. В іншому випадку користувачі платформ з Windows залишаться глухими до ваших потуг.
- Редагування звуку (переклад з стерео на моно, фільтрацію, нормалізацію, обмеження рівня звуку, а також зменшення дозволу дискретизації) необхідно проводити до перетворення його в 8-бітний. При редагуванні 8-розрядного звуку з'являється "електронний шум", тому редагування краще проводити в файлі з більш високою роздільною здатністю дискретизації ще до його зменшення.
Ви запитаєте, звідки я це все знаю? Так з підручників! Чи не сама ж я все це придумала! Тим більше, мені взагалі ведмідь на вухо наступив. І я ні в життя не розрізню "до" і "ре", якщо мені цього ніхто не вкаже.
Ну, а тепер розповім, нарешті, як же нам впихнути наші звуки на html-сторінку.
Як вставити звук на html-сторінку
Якщо Ви дочитали до цього місця, то, значить, вас вже ніщо не зупинить. І мені не залишиться нічого іншого, як розкрити цю таємницю. Щоб ваші крики слухав весь світ. Сподіваюся, він не оглухне.
Знаєте, ви будете сміятися, але звук в сторінку вставляється точно також як і картинка. Тільки картинка має дозвіл jpg або gif. а звуковий файл - дозвіл тих форматів, які я вказала вище в таблиці.
Ось я скачала файл Vernisaj.wav з музикою "Ах, вернісаж" і помістила його в окрему папку зі звуками "sound" і напишу наступну сходинку:
Ось що вийде в вікні браузера і якщо хочете послухати музику, натисніть на посилання:
А пам'ятаєте, я вам говорила про собачку, на яку можна натиснути і вона почне гавкати? Я ось хоч і не художник, а зобразила щось схоже на собаку (рис. 148):
Мал. 148. Просто собака
Подивитися на цю собаку - так здасться, що вона просто гикає. І щоб змусити її гавкати я купила диск "1100 новітніх професійних семплів" і знайшла там відповідний гавкіт під файлом "Dog.wav", зберегла його у своїй таткові "sound" і написала наступну сходинку:
А тепер тикніте на собачку (рис. 149), тільки дивіться щоб вона вашу тикалку НЕ відкусила!
Мал. 149. Собака буває кусючою.
А якщо ви боїтеся тикати в незнайому собаку, ви можете керувати нею командою. Напишемо цю команду на інший кнопочки, яку я намалюю і назву "golos.jpg".
Тоді код у нас буде такий:
І ось вам результат!
У попередніх випадках ми змушували звук включатися по команді. Але ж можна зробити так, щоб музика була фоном! Щоб відвідувач, хоче чи не хоче цього слухав те, що ми йому хочем наспівати на вушко. І це теж можна зробити дуже просто! Правда, діяти він буде тільки в Explorer, та й то починаючи тільки з 2 версії. Решта - відпочивають!
Для простоти розуміння я візьму той же файл Vernisaj.wav і розміщу його наступним чином:
Як бачите, в цьому випадку музика програла один раз і зупинилася? Але якщо вам цього мало, якщо ви думаєте, що відвідувачеві хочеться ще раз послухати цю музику, ви можете дати йому цю можливість! Ви навіть вирішите, що нехай ця музика грає поспіль 3 рази! І тоді перепишете злегка код:
І будьте впевнені, він буде прослухає цю музику три рази!
Але якщо вам і цього мало, і ви захочете довести бідолаху до сказу, то можете сміливо написати рядок:
І будьте впевнені! Ця музика буде його переслідувати вдень і вночі. Тільки благаю вас, не кажіть йому, хто вас цьому навчив.
А ще є два цікавих атрибута volume і balance. Перший відповідає за рівень відтворення звуку, а другий - за стереобаланс. Volume може приймати значення від -10000 до 0. Тобто його не можна зробити голосніше, ніж він є, але ось приглушити - запросто! Balance - можливі значення від -10000 до 10000. Якщо ми виберемо крайнє значення, то це призведе до того, що буде звучати тільки один динамік.
Так що якщо ми напишемо:
Те почуємо цей файл рівно 10 разів при максимальному звучанні і нормальному стереобаланса.
Ну, а як же наївні відвідувачі Netscape? Що вони не хочуть глухнути? Дамо ж їм цю можливість! Напишемо наступне:
Цим самим EMBED ми вбудували в нашу сторінку аудіоплеєр. Цей елемент був введений вперше компанією Netscape, і з тих пір він підтримується більшістю браузерів, в тому числі і Explorer. І ось, коли наша сторінка буде завантажуватися, браузер, наткнувшись на EMBED подумає-подумає, та й завантажить панель програвача з різними кнопками. А потім і звук запустить. І що радує, можна встановити свої розміри (ширина і висота) цього програвача за допомогою атрибутів width і height. хочеш в пікселах, а не хочеш - у відсотках.
Також є атрибут autostart. який може приймати значення або false (звук тоді включає користувач), або true. коли музика починає програватися відразу при відкритті сторінки.
Ну, і останній атрибут - hidden. Якщо він має значення false. то панель виводиться на екран, в іншому ж випадку (true) - панель, хоч я знаю, а значить спроби користувача вирубати вашу музику - марні. І у нього тільки два шляхи - або піти зі сторінки по-добру, по-здорову, або спробувати знайти творця цього творіння. І поговорити з ним "по душам".
А ось і прімерчік:
А ось і результат цього прімерчік:
Ваш браузер не підтримує аудіо
Ну ось, саме простацьке я вам розповіла. Я не збираюся перетворювати цей урок в музичний салон. По-перше, я не відчуваю себе докою в цій справі, а по-друге, потрібно і іншими уроками зайнятися. А по-третє, боюся захопитися цією справою і звихнутися. Всяке буває. Тому я просто дам вам посилання і ви, якщо впевнені у своїй психіці, можете самі у всьому розібратися.
Macromedia Director / Streaving Audio
Додаток Director є найстарішим інструментом, призначеним для створення мультимедіа-ефектів. Плагін для Web-браузерів, Shockwave дозволяє переглядати на Web-сторінках вміст файлів Director. Плагін Shockwave підтримує потокову передачу звукових файлів. Для створення потокового звукового файлу необхідно навчитися працювати з Director. а також запрограмувати необхідні дії, скориставшись запатентованим мовою програмування Lingo. Більш детальна інформація щодо Director, Shockowave і Lingo знаходиться на сайті компанії www.macromedia.com
Технологія RealAudio є найстарішою і найбільш широко відомою технологією впровадження звукових файлів в Web. У цьому випадку використовується три компоненти:
- Програвач RealAudio відтворює файли у форматі RealAudio
- Кодер RealAudio кодує файли в форматі RealAudio
- Сервер RealAudio передає файли в форматі RealAudio
Для прослуховування файлів у форматі RealAudio необхідно, щоб в системі був встановлений програвач RealAudio. Для створення файлів у форматі RealAudio слід виконати перетворення звукових файлів в цей формат.