عرض مصدر HTML/Media Formats

<noinclude>{{DISPLAYTITLE:أنواع الوسائط المدعومة في المتصفحات}}</noinclude>
تدعم العناصر <code>[[HTML/audio|<audio>]]</code> و <code>[[HTML/video|<video>]]</code> تشغيل الصوت والفيديو ضمن صفحات الويب دون إضافات.

صيغة ملفات الوسائط تتألف من حاوية (container) تحتوي على مسار أو أكثر من مسارات البيانات (data stream)، وتلك المسارات مرمَّزة (coded) باستخدام مرماز (codec). يمكن التعرف على الحاويات من صيغة الملف (أي لاحقته). المسارات الموجودة ضمن الحاويات يمكن أن تتضم مختلف أنواع البيانات مثل الفيديو والصوت والترجمات والبيانات الوصفية. لاحظ أنَّ بالإمكان أن تضم الحاوية الواحدة (أي ملف الوسائط الواحد) على أكثر من مسار من نفس النوع. لاحظ أنَّ كلمة مرماز (codec) تشير إلى الخوارزمية التي تُستخدَم لضغط البيانات في الملف، وكل نوع من أنواع الحاويات تقبل مرمزات محددة.

من المهم فهم لماذا هنالك حاجة لمختلف صيغ ملفات الوسائط في صفحات الويب. إذ هنالك أسبابٌ عديدة وراء ذلك، لكن شرحها يخرج عن نطاق هذه الصفحة. يمكنك مراجعة المقالة «[https://academy.hsoub.com/programming/html5/%D8%B5%D9%8A%D8%BA-%D8%AA%D8%B1%D9%85%D9%8A%D8%B2-%D8%A7%D9%84%D9%81%D9%8A%D8%AF%D9%8A%D9%88-%D9%88%D8%A7%D9%84%D8%B5%D9%88%D8%AA-%D9%88%D8%AD%D8%A7%D9%88%D9%8A%D8%A7%D8%AA%D9%87%D8%A7-%D9%88%D9%83%D9%8A%D9%81%D9%8A%D8%A9-%D8%B9%D9%85%D9%84%D9%87%D8%A7-%D9%81%D9%8A-%D8%A7%D9%84%D9%88%D9%8A%D8%A8-r350/ صيغ ترميز الفيديو والصوت وحاوياتها وكيفية عملها في الويب]» في أكاديمية حسوب لمزيدٍ من المعلومات.

لاحظ أنَّ أحد أهم المعوقات في نشر صيغ الوسائط لصفحات الويب هو براءات الاختراع، فبعض الصيغ تكون محميةً ببراءة اختراع في الولايات المتحدة والاتحاد الأوروبي.

== عرض الوسائط ==
لقد بيّنا بالتفصيل كيفية إضافة الوسائط في صفحة العنصرين <code>[[HTML/audio|<audio>]]</code> و <code>[[HTML/video|<video>]]</code>، مع طريقة دمجهما مع العنصر <code>[[HTML/source|<nowiki><source></nowiki>]]</code>. سنورد هنا مثالًا بسيطًا عن إضافة فيديو إلى صفحة الويب:<syntaxhighlight lang="html">
<video controls poster="khamsat-poster.jpg" height="360">
  <source src="khamsat.webm" type="video/webm">
  <source src="khamsat.mp4" type="video/mp4">
  لا يدعم متصفحك العنصر <code>video</code>.
</video>
</syntaxhighlight>

== صيغ الملفات ==
سنورد هنا عددًا من صيغ الملفات المدعومة في عناصر HTML. راجع قسم «دعم المتصفحات» لتعرف ما هي المتصفحات التي تدعم صيغةً معينةً.

=== WebM ===
صيغة [http://www.webmproject.org/ WebM] مبنية على نسخة من حاوية [http://corecodec.com/products/matroska Matroska]، وهي تستعمل مرماز VP8 أو VP9 للفيديو مع مرماز Vorbis أو Opus للصوت.

في عام 2010، اشترت Google شركة On2 ونشرت مواصفات مرماز الفيديو وأصدرت برمجية ترميز وفك ترميز مفتوحة المصدر. وكان جزءًا من هذه العملية هو «فتح» Google لجميع براءات الاختراع التي سجلتها شركة On2 لمرماز VP8، وذلك بجعلها مجانية الاستخدام أي royalty-free.

وبهذا أصبح VP8 مرمازًا عصريًا مجانيَ الاستخدام ليس محميًا بأيّة براءات اختراع عدا تلك التي سجلتها شركة On2 (وتملكها Google حاليًا) والتي يمكن استعمالها مجانًا. وفي نهاية عام 2012، أطلقت Google مرماز  VP9 الذي طوِّر على خطى مرماز VP8 وهو مرماز مفتوح المصدر ومجاني الاستخدام.

يمكن استخدام أنواع MIME الآتية مع ملفات WebM:
* <code>video/webm</code>: ملف وسائط WebM يحتوي على فيديو (ومن المرجح أن يحتوي على صوت).
* <code>audio/webm</code>: ملف وسائط WebM صوتي فقط.

== Ogg ==
يدعم متصفح Firefox و Chrome و Opera حاوية Ogg مع فيديو مرمَّز بمرماز Theora وصوت Vorbis، ويمكن إضافة الدعم إلى متصفح Safari (على الحاسوب وليس الهاتف). هذه الصيغة غير مدعومة في متصفح Internet Explorer.

من المستحسن استخدام صيغة WebM بدلًا من Ogg عندما تكون متاحةً، ذلك لأنها توفِّر ضغطًا بنسبة أكبر بالتناسب مع الجودة إضافةً إلى دعم متصفحات أكثر لها. لكن صيغة Ogg يمكن تشغيلها من المتصفحات القديمة.

براءات الاختراع الخاصة بهذه الصيغ شبيهة بصيغة WebM، أي أنَّ براءات الاختراع مجانية الاستخدام.

يمكن استخدام أنواع MIME الآتية مع ملفات Ogg:
* <code>audio/ogg</code>: ملف Ogg يحتوي على صوت فقط.
* <code>video/ogg</code>: ملف Ogg يحتوي على فيديو (ومن المرجح أن يحتوي على صوت).
* <code>application/ogg</code>: ملف Ogg دون تحديد المحتوى. من المفضَّل استخدام أحد أنواع MIME السابقة، لكن يمكنك استخدام هذا النوع إن لم تكن تعرف محتويات الملف.

=== Ogg Opus ===
تدعم حاوية Ogg ترميز الصوت باستخدام [http://www.opus-codec.org/ مرماز Opus]، يمكن استخدام نوع MIME الآتي <code>audio/ogg; codecs=opus</code> معه.

=== Ogg FLAC ===
تدعم حاوية Ogg ترميز الصوت باستخدام [https://xiph.org/flac/index.html مرماز FLAC].

== MP4 ==
حاوية MP4 مع فيديو مرمّز بمرماز H.264 وصوت مرمَّز بمرماز AAC مدعومةٌ من متصفح Internet Explorer و Safari و Chrome، لكن Chromium و Opera لا تدعم هذه الصيغة. تدعم متصفحات IE و Chrome تشغيل صوت MP3 في حاوية MP4، لكن متصفح Safari لا يدعم ذلك.

== FLAC ==
حاوية FLAC تدعم ترميز الصوت باستخدام [https://xiph.org/flac/index.html مرماز FLAC]، تنتهي هذه الملفات عادةً باللاحقة ‎<code>.flac</code> ويمكن استخدام نوع MIME الآتي <code>audio/flac</code> أو <code>audio/x-flac</code> معها.

==دعم المتصفحات==
{| class="wikitable"
!الميزة
!|Chrome
!Firefox
!Internet Explorer
!Opera
!Safari
|-
!الدعم الأساسي
|3.0
|3.5
|9.0
|10.50
|3.1
|-
![[HTML/audio|<audio>]]:‏ Vorbis في WebM
|نعم
|4.0
|لا
|10.50
|3.1
|-
![[HTML/audio|<audio>]]:‏ Vorbis في Ogg
|3.0
|3.5
|لا
|10.50
|لا
|-
![[HTML/audio|<audio>]]:‏ MP3
|نعم
|نعم
|9.0
|نعم
|3.1
|-
![[HTML/audio|<audio>]]:‏ AAC في MP4
|نعم
|نعم
|9.0
|نعم
|3.1
|-
![[HTML/audio|<audio>]]:‏ Opus في Ogg
|27.0
|15.0
|؟
|؟
|؟
|-
![[HTML/audio|<audio>]]:‏ FLAC
|56.0
|51
|لا
|لا
|لا
|-
![[HTML/audio|<audio>]]:‏ FLAC في Ogg
|56.0
|51
|لا
|لا
|لا
|-
![[HTML/video|<video>]]:‏ VP8 و Vorbis في WebM
|6.0
|4.0
|9.0
|10.60
|3.1
|-
![[HTML/video|<video>]]:‏ VP9 و Opus في WebM
|29.0
|28.0
|؟
|نعم
|؟
|-
![[HTML/video|<video>]]:‏ Theora و Vorbis في Ogg
|نعم
|3.5
|لا
|10.50
|لا
|-
![[HTML/video|<video>]]:‏ H.264 و MP3 في MP4
|نعم
|نعم
|9.0
|نعم
|نعم
|-
![[HTML/video|<video>]]:‏ H.264 و AAC في MP4
|نعم
|نعم
|9.0
|نعم
|3.1
|-
![[HTML/video|<video>]]:‏ FLAC في MP4
|62.0
|51
|؟
|؟
|؟
|}
[[تصنيف:HTML|{{SUBPAGENAME}}]]
[[تصنيف:HTML Multimedia|{{SUBPAGENAME}}]]