HTML5: إدراج الوسائط المتعددة (الصوت والفيديو)
يوفر HTML5 عناصر جديدة لإدراج الوسائط المتعددة (Multimédia) مباشرة في صفحات الويب دون الحاجة إلى إضافات خارجية مثل Flash. أهم هذه العناصر <audio> للصوت و <video> للفيديو.
عنصر <video>
يستخدم عنصر <video> لإدراج مقطع فيديو في صفحة الويب. الصيغة الأساسية:
<video src="video.mp4" controls width="640" height="360">
المتصفح لا يدعم تشغيل الفيديو.
</video>
خصائص مهمة
- src: مسار ملف الفيديو.
- controls: يعرض أدوات التحكم (تشغيل، إيقاف، مستوى الصوت).
- autoplay: يبدأ التشغيل تلقائياً عند تحميل الصفحة.
- loop: يعيد تشغيل الفيديو باستمرار.
- muted: كتم الصوت.
- poster: صورة مصغرة تعرض قبل التشغيل.
- width/height: تحديد أبعاد المشغل.
عنصر <audio>
يستخدم عنصر <audio> لإدراج ملف صوتي:
<audio src="podcast.mp3" controls>
المتصفح لا يدعم تشغيل الصوت.
</audio>
توفير صيغ متعددة للتوافق
<video controls width="640">
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
<source src="video.ogv" type="video/ogg">
المتصفح لا يدعم تشغيل الفيديو.
</video>
تمارين تطبيقية
التمرين 1: اكتب صفحة HTML5 تحتوي على مشغل فيديو مع عناصر تحكم كاملة، مع توفير صيغتين مختلفتين للفيديو.
التريبن 2: أضف ملفاً صوتياً إلى صفحة ويب مع خاصية التشغيل التلقائي والحلقة.
التمرين 3: ابحث عن أنواع الصيغ المدعومة للفيديو والصوت في المتصفحات المختلفة.
للمزيد من المعلومات، راجع درس الشبكات: مفاهيم أساسية ودرس الذكاء الاصطناعي.
📍 دروس مشابهة
- الإعلام الآلي — لغة C: المصفوفات ثنائية البعد — الثانية ثانوي (شعب علمية) — بكالوريا — المنهاج الجزائري
- الإعلام الآلي — قواعد البيانات: لغة SQL المتقدمة (الاستعلامات المعقدة) — الثانية ثانوي (شعب علمية) — بكالوريا — المنهاج الجزائري
مدونة التربية و التعليم في الجزائر – دروس، فروض، نتائج امتحانات مدونة التربية والتعليم في الجزائر | تحضير الدروس، فروض واختبارات، نتائج البكالوريا وBEM، مسابقات التوظيف، والتوجيه المدرسي للطلاب وأولياء الأمور.