مرحبا، في هذه المحاضرة سوف نتحدث عن الوسائط المتعددة.
وهذا يشمل الفيديو والصوت في موقع الويب الخاص بك.
الآن الفيديو والصوت هما اثنان من
العناصر الأكثر شعبية واثنين من أكثر يكره على شبكة الإنترنت.
المصممين يحبون ذلك لأنها تحصل على وضع أشرطة الفيديو باردة
وربما بعض الموسيقى محلية الصنع على الانترنت ومشاركتها مع الجميع.
يكره الأشخاص الذين يدخلون إلى موقعك أحيانًا لأنهم يشعرون بأنهم لا يملكون
أي سيطرة على ما يرونه.
لذا، ما سنتحدث عنه اليوم هو عناصر الصوت والفيديو HTML5.
سنقوم بشرح باختصار الغرض من المكونات الإضافية.
وأخيرا، سوف نفكر
في قضايا إمكانية الوصول التي تأتي جنبا إلى جنب مع استخدام هذه الأنواع من علامات الوسائط المتعددة.
حتى قبل HTML5 لم يكن هناك حقا أي استخدامات متسقة للوسائط المتعددة
التي كانت تعقد عبر جميع المتصفحات.
لذا تم تصميم HTML5 الجديد لتجنب استخدام الحاجة إلى استخدام المكونات الإضافية أو
البرامج الإضافية التي لا تملكها بالفعل على جهازك.
يجب أن يكون حقا التوصيل والتشغيل.
إذا كنت تريد وضع شريط فيديو، يجب أن يكون الناس قادرين على رؤيته دون
الحاجة إلى تحميل Quicktime أو Flash، أو أي شيء على طول هذا الخط.
الآن إنها ليست علامة منفذة بالكامل حتى الآن.
لكنه يتحرك بسرعة كبيرة في هذا الاتجاه.
لذلك دعونا نبدأ مع عنصر الفيديو.
لذلك تستخدم علامة الفيديو سمة مصدر تشبه إلى حد كبير
سمة الصورة.
أخبر المتصفح أين يوجد الملف.
يمكنك أيضًا استخدام ما نسميه العلامات المضمنة،
حيث قد يكون لديك علامة الفيديو ثم مصادر متعددة أسفل أدناه.
هناك عدد من السمات التي تستخدم على نطاق واسع جدا.
الأولين، الطول والعرض، هي جميلة النفس التفسيرية.
ما مدى حجم الفيديو الذي ترغب في ظهوره في المتصفح؟
يملي التشغيل التلقائي ما إذا كان يجب بدء تشغيل الفيديو بمجرد تحميل الصفحة أم لا.
سوف حلقة تسمح الفيديو للعب مرارا وتكرارا.
وآخر واحد، الضوابط، هو شيء يمكنك إضافته لإعطاء الشخص المزيد من
السيطرة على متى لوقف وبدء الفيديو.
إذا كنت تستخدم علامة فيديو، فعادةً ما تكون فكرة جيدة لوضع بعض
النص هناك مع السمات المختلفة.
وبهذه الطريقة، إذا كان المتصفح لسبب ما لا يدعم العلامة أو
لا يمكن تشغيل الفيديو، يمكنك الحصول على نوع من تلميح مفيد للمستخدم السماح لهم معرفة أنه
يجب أن يكون هناك فيديو هنا أن كنت تبحث في.
عنصر الصوت مشابه جدا للفيديو،
ثم مرة أخرى نستخدم سمة مصدر لربط الملف.
عادة، ستقوم باستخدام ملف.mp3 أو .wav.
السمات مرة أخرى، متشابهة جدا.
لديك التشغيل التلقائي، وعناصر التحكم، وحلقة، ولكن لدينا أيضا التخزين المؤقت، صامتة، وحجم.
وهذه هي السمات الإضافية التي يمكنك وضعها في المكان الذي ستتحكم فيه
بما يستمع إليه الشخص وكيف بصوت عال.
أيضا عندما كنت تستخدم الصوت، يمكنك تعيين مقاطع حيث يمكنك الذهاب في
ويقول، أريد أن يبدأ الفيديو في هذا الوقت بالذات.
لذلك أول مثال لي، أريد أن تلعب الموسيقى فقط من 5 إلى 25 ثانية.
في المرة التالية، تبدأ من البداية
وأنت فقط ستعمل تلعب أول 39 ثانية.
مرة أخرى، يمكنك المضي قدما.
أريد أن أبدأ في دقيقة واحدة 38 ثانية، ومجرد المضي قدما واللعب إلى 45.
أو في النهاية يمكنك فقط أن تقول، مهلا، تبدأ في الثانية 42 واللعب من هناك.
لذا فإن إظهار رمز فيديو HTML
والصوت هو إلى حد كبير نقيض ما يدور حول كل شيء.
من المفترض أن يكون حول النظر إلى الأشياء وسماع الأشياء
لذلك دعونا نمضي قدما وننظر إلى بعض التعليمات البرمجية الآن التي تعمل في الواقع.
يمكنك أن ترى أن لدي src كما مجرد بلدي فيلم BoxCar، ولقد
قمت بتعيين العرض الافتراضي إلى 40.
لذا، سأذهب إلى هنا إلى (سابليم) وأفتح هذا في المتصفح
ها هو، وانها ليست مثيرة جدا.
ما لم يكن لديك عيون فائقة سريعة ومتصفحك سريع بشكل لا يصدق, كنت
غاب تماما حقيقة أنه تحميل هذا الفيديو ولعب على طول الطريق من خلال.
لذلك دعونا المضي قدما ومحاولة هذا مرة أخرى.
في الواقع، انها فقط تحميلها ولم تفعل أي شيء.
دعونا نضيف التشغيل التلقائي.
حسناً، احتفظي به
أنا ذاهب للذهاب أكثر من هنا وإعادة تحميل، والآن يمكنك أن ترى
عن طريق إضافة سمة التشغيل التلقائي، وسوف تظهر تلقائيا الفيديو.
الآن هذا شيء لا تريد القيام به إلا إذا كنت متأكدا جدا
أن المشاهد يريد رؤيته.
كان هناك ضجة كبيرة في الآونة الأخيرة عندما
بدأ موقع وسائل التواصل الاجتماعي في تشغيل جميع مقاطع الفيديو تلقائيًا.
لذا إذا استمرتم، ففجأة كل هذه الفيديوهات كانت تعمل.
وكان يأكل كمية كبيرة من عرض النطاق الترددي للناس، كل الحق؟
لذلك، بدلا من مجرد القيام التشغيل التلقائي، دعونا المضي قدما ووضع في الضوابط.
من خلال القيام بذلك،
يمكنك أن ترى أننا أضفنا الآن لوحة تحكم صغيرة إلى أسفل الفيديو.
يمكن للناس الآن بدء الفيديو، وإيقاف الفيديو، وترجعه.
هذه هي الطريقة التي تريد التفكير فيها كيندا
كيف يمكنك تعزيز تجربة المستخدم.
من الممكن وضع سمات متعددة
في هذا النوع ووضعها فوق بعضها البعض.
إذا فعلنا هذا الآن، يمكنك تجربة بلدي
خمس سنوات الطيران على الطريق عدة مرات مرارا وتكرارا.
مرة أخرى، كنت تريد حقا لتجنب استخدام حلقة وأيضا تجنب استخدام لصناعة السيارات في اللعب،
إلا إذا كنت تعطي الناس الفرصة لاستخدام عناصر التحكم كذلك،
كل الحق؟
آخر شيء أريد أن أتحدث عنه هنا هو أنك قد تلاحظ مع عناصر التحكم
والحلقة، وهذه هي السمات التي لا يبدو أنها تأخذ أي قيم.
حتى سرك =، العرض =.
عندما تضع في هذه السمات المنطقية،
انها نفس الشيء كما يقول الضوابط يساوي صحيح.
الحلقة تساوي الصواب
لذا هكذا مررنا بالفيديو
دعونا نمضي قدما وننظر إلى الصوت لثانية واحدة.
إجعل هذا أكبر قليلاً هنا
ما لدي هنا هو أن لدي رابط إلى نفس الأغنية مرتين
في الإصدار الأول، يمكنك أن ترى أنني أعطيت شريط الصوت الصغير،
لأنني تأكدت من استخدام عناصر التحكم.
وإذا كنت أعزف، فإنه ذاهب إلى المضي قدما والعزف من خلال الأغنية بأكملها.
ولكن في خياري الثاني، يمكنك أن ترى لقد أضفت، هنا، t = 15:35.
لقد قمت بإعداده
لك حتى تحصل حقا على سماع الأغنية من عندما الجزء المثير حقا ركلة في.
لذلك هذه مجرد بعض الأمثلة البسيطة لكيفية استخدامك للعلامات لإظهار
صوت الفيديو الخاص بك.
وأنا آمل حقا أنه كما كنت الترميز، الخاص بك التأكد من كتابة الأشياء على طول،
والعبث مع الأشياء، واللعب مع الأشياء للحصول على شعور حقا كيف هذه أشرطة الفيديو
وجميع علامات HTML5 المختلفة تعمل.
لذا فإن أحد الأشياء التي أتحدث عنها مع الأشخاص، الذين تم
ترميزهم في إصدارات أخرى من HTML ولا يريدون حقًا إجراء التغيير إلى HTML5.
أن هناك الكثير من الأسباب التي تريد أن تجعل هذا التبديل بسيط سريع.
والمكونات الإضافية هي مثال ممتاز.
منذ قبل HTML5، لم يكن هناك معيار، كانت هناك حاجة إلى الإضافات.
لذلك ما نريد القيام به هو المضي قدما
وحتى لو لم يكن مدعوما في الوقت الحالي، والمضي قدما واستخدام هذه العلامة، مع
فهم أن بعض المتصفحات بلدي لا تزال تتطلب فلاش من أجل تشغيلها.
وأخيرًا، دعونا نتحدث عن مشكلات إمكانية الوصول.
عندما تستخدم الفيديو أو الصوت، تمامًا كما هو الحال مع أي نوع من
المحتوى غير السياقي، فإنك تريد التأكد من تقديم أي نوع من أوصاف النص والتسمية
التوضيحية المغلقة أو أي محتوى آخر مكافئ.
تريد التأكد من أنك توفر أيضًا أي ارتباطات للمكونات الإضافية.
خلاف ذلك، كنت إلى حد كبير مجرد ترك مع نوع
من رمز مكسور قليلا فارغة أن الناس لا يفهمون دائما.
وأخيرا، أهم شيء أود منك أن تأخذ بعيدا عن هذا الحديث،
أبعد من أن تكون قادرا على استخدام التعليمات البرمجية،
هو أن الوسائط المتعددة يجب أن تعزز حقا المحتوى الخاص بك.
أنت لا تريد أن يكون إلهاء
لا تريد أن يقضي الأشخاص
وقتًا في محاولة معرفة كيفية إيقاف تشغيله حتى يتمكنوا من ذلك، من أجل الوصول إلى محتوى صفحتك.
شكراً