كيفية إضافة الصوت إلى صفحة ويب HTML5

يعمل HTML5 على تسهيل إضافة الصوت والموسيقى إلى صفحات الويب باستخدام العنصر. في الواقع ، أصعب شيء هو إنشاء المصادر المتعددة التي تحتاجها للتأكد من تشغيل ملفات الصوت على أكبر مجموعة من المتصفحات.

تكمن فائدة استخدام HTML5 في إمكانية تضمين الصوت باستخدام علامتين فقط. عندئذٍ ، تقوم المتصفحات بتشغيل الصوت تمامًا كما لو كانت تعرض صورة عند استخدام عنصر IMG .

كيفية إضافة الصوت إلى صفحة ويب HTML5

ستحتاج إلى محرر HTML ، وملف صوت (يفضل أن يكون بتنسيق MP3) ، ومحول ملفات الصوت.

1. أولاً ، تحتاج إلى ملف صوت. من الأفضل تسجيل الملف كملف MP3 ( .mp3 ) لأن هذا يحتوي على جودة صوت عالية ويدعمها معظم المتصفحات (Android 2.3+ و Chrome 6+ و IE 9+ و iOS 3+ و Safari 5+).
2. قم بتحويل ملفك إلى تنسيق Vorbis ( .ogg ) لإضافته في Firefox 3.6+ ودعم Opera 10.5+. يمكنك استخدام محول مثل واحد موجود على Vorbis.com. يمكنك أيضًا تحويل MP3 إلى تنسيق ملف WAV ( .wav ) للحصول على دعم Firefox و Opera. أوصي بنشر ملفك في جميع الأنواع الثلاثة ، فقط للأمان ، ولكن أكثر ما تحتاجه هو MP3 ونوع آخر.
3. قم بتحميل كافة الملفات الصوتية إلى خادم الويب الخاص بك وقم بتدوين الدليل الذي قمت بتخزينها فيه. من المستحسن وضعها في دليل فرعي فقط لملفات الصوت ، مثل معظم المصممين يحفظون الصور في دليل الصور .
4. أضف عنصر AUDIO إلى ملف HTML الخاص بك حيث تريد عرض عناصر التحكم في الملفات الصوتية. <ضوابط الصوت>
5. ضع عناصر SOURCE لكل ملف صوتي تحمّله داخل عنصر AUDIO :

1. سيتم استخدام أي HTML داخل عنصر AUDIO كخلفية للمتصفحات التي لا تدعم عنصر AUDIO . لذا أضف بعض HTML. أسهل طريقة هي إضافة HTML للسماح لهم بتنزيل الملف ، ولكن يمكنك أيضًا استخدام أساليب تضمين HTML 4.01 لتشغيل الصوت. في ما يلي احتياطي بسيط:

   متصفحك لا يدعم تشغيل الصوت ، قم بتنزيل الملف:

   1. MP3 ،
   2. Vorbis ، WAV
2. آخر شيء يجب عليك فعله هو إغلاق عنصر AUDIO :
3. عند الانتهاء ، يجب أن يبدو HTML على النحو التالي:
   4. متصفحك لا يدعم تشغيل الصوت ، قم بتنزيل الملف:

   5. MP3 ،
   6. Vorbis ،
   7. WAV

نصائح إضافية

1. تأكد من استخدام نوع HTML5 () بحيث يتم التحقق من صحة HTML الخاص بك
2. راجع السمات المتاحة للعنصر لمعرفة الخيارات الأخرى التي يمكنك إضافتها إلى العنصر.
3. لاحظ أننا قمنا بإعداد HTML لتضمين عناصر التحكم افتراضيًا وإيقاف التشغيل التلقائي. بالطبع ، يمكنك تغيير ذلك ، لكن تذكر أن العديد من الأشخاص يجدون صوتًا يبدأ تلقائيًا / لا يمكنهم التحكم به ليكونوا مزعجين في أفضل الأحوال ، وغالبًا ما يغادرون الصفحة عند حدوث ذلك.