الملفات الصوتية
تسجيل الدخول
تضمين ملف صوتي في صفحة HTML
لم يكن إدراج الصوت في صفحة الويب أمرًا سهلاً من قبل ، لأن متصفحات الويب لم يكن لديها معيار موحد لتحديد ملفات الوسائط المضمنة مثل الصوت.
سنوضح في هذا الدرس بعض الطرق العديدة لتضمين ملف صوتي في صفحة الويب.
استخدام العنصر <audio>
يوفر عنصر <audio> الذي تم إضافته حديثًا إلى لغة HTML5 طريقة قياسية لتضمين الصوت في صفحات الويب. ومع ذلك ، فإن عنصر الصوت جديد نسبيًا ولكنه يعمل في معظم متصفحات الويب الحديثة.
يقوم المثال التالي بإدراج ملف صوتي في صفحة HTML5 ، باستخدام مجموعة عناصر التحكم الافتراضية للمستعرض ، مع تحديد مصدر واحد للملف الصوت بواسطة السمة src.
- <audio controls src="media/birds.mp3">
- متصفحك لا يدعم العنصر Audio.
- </audio>
يمكننا ايضا استخدام مصادر بديلة للصوت بإستخدام عناصر <source>.
- <audio controls>
- <source src="media/birds.mp3" type="audio/mpeg">
- <source src="media/birds.ogg" type="audio/ogg">
- متصفحك لا يدعم العنصر Audio.
- </audio>
يعمل مسار 'ogg' في المثال أعلاه في Firefox و Opera و Chrome ، بينما تتم إضافة نفس المسار بتنسيق 'mp3' لجعل الصوت يعمل في Internet Explorer و Safari.
ربط الملفات الصوتية
يمكنك إنشاء روابط تشعبية لملفاتك الصوتية وتشغيلها عن طريق النقر عليها.
لنجرب المثال التالي لفهم كيفية عملها:
- <a href="media/SandandSea.mp3">Track 1</a>
- <a href="media/Spring.mp3">Track 2</a>
باستخدام العنصر object
يتم استخدام العنصر <object> لتضمين أنواع مختلفة من ملفات الوسائط في صفحة HTML. سابقا كان يستخدم هذا العنصر لإدراج عناصر تحكم ActiveX ، ولكن وفقًا للمواصفات ، يمكن أن يكون الكائن أي كائن وسائط مثل الصوت أو الفيديو أو ملفات PDF أو الرسوم المتحركة فلاش أو حتى الصور.
يشتمل المثال التالي على ملف صوتي بسيط في صفحة ويب.
- <object data="media/SandandSea.mp3"></object >
العنصر <object> غير مدعوم على نطاق واسع ويعتمد كثيرًا على نوع الكائن المضمن. قد تكون الأساليب الأخرى مثل العنصر <audio> أو مشغلات الصوت من قبل جهات خارجية اختيارًا أفضل في كثير من الحالات.
إستخدام العنصر embed
يتم استخدام العنصر
- <embed src="media/SandandSea.mp3">
عنصر <embed> مدعوم جيدًا في المتصفحات الحالية ومُعرَّف كمعيار قياسي في HTML5 ،ومع ذلك قد لا يتم تشغيل الصوت الخاص بك بسبب نقص دعم متصفح الويب لتنسيق الملف أو عدم توفر المكونات الإضافية.