دوره آموزشی یادگیری صوتی و تصویری وب
1 ساعت 29 دقیقهمتوسط2020-08-17
مدرسین

Joseph Labrecque
University Professor, Adobe Educator, Studio Head
جزئیات دوره
نیاز به اشتراکگذاری ویدیو یا صدا در سایتهای خود دارید، اما رها کردن آن در یوتیوب یا موتور پادکست گزینهای نیست؟ فنآوریهای وب بومی - HTML، CSS و جاوا اسکریپت - پشتیبانی مستقیم از صدا و تصویر را فراهم میکنند و به شما امکان میدهند رسانهها را ترکیب کنید و تجربه پخش را به طور کامل سفارشی کنید. این دوره مقدماتی با مربی جوزف لابرک به شما کمک می کند تا صدا و تصویر تعاملی را در وب سایت ها و برنامه های خود بسازید. ابتدا اصول عناصر رسانه ای HTML5 و ویژگی های آنها را مرور کنید. سپس نحوه جاسازی رسانه، پشتیبانی از بک گراند، و تنظیم اندازه، صدا و سایر تنظیمات مهم را بیابید. سپس، یاد بگیرید که چگونه رابطها را سفارشی کنید تا ظاهر و عملکرد پخشکننده خود را در مرورگرهای مختلف استاندارد کنید. به علاوه، بیاموزید که چگونه میتوانید تجربه کاربری را با HTML5 Media API کاملا تعاملی کنید.
اهداف یادگیری
پیوند به رسانه
جاسازی رسانه
تغییر سند خود برای صدا و تصویر
تعیین منابع صوتی
تعیین ارتفاع و عرض ویدیو
تضمین دسترسی
ایجاد کنترل های پخش
کنترلهای پخش یک ظاهر
کار با HTML5 Media API
اهداف یادگیری
پیوند به رسانه
جاسازی رسانه
تغییر سند خود برای صدا و تصویر
تعیین منابع صوتی
تعیین ارتفاع و عرض ویدیو
تضمین دسترسی
ایجاد کنترل های پخش
کنترلهای پخش یک ظاهر
کار با HTML5 Media API
مهارت ها
Interactive Web ContentHTMLWeb StandardsJavaScriptWeb DesignOracleWeb DevelopmentOpen SourceDeep Dive (X:Y)
سرفصل ها
0. مقدمه
- 01 - صدا و تصویر تعاملی را در وب سایتها و برنامههای خود ایجاد کنید
- 02 - آنچه باید بدانید
- 03 - از فایلهای تمرینی استفاده کنید
- 04 - چه چیزی در این به روز رسانی جدید است
1. با رسانههای مبتنی بر وب شروع کنید
- 05 - محیط خود را تنظیم کنید
- 06 - یک سند جدید ایجاد کنید
- 07 - پیوند به محتوای رسانه ای
- 08 - از رسانههای جاسازی شده استفاده کنید
- 09 - چالش - حاشیه iframe را بردارید
- 10 - راه حل - حاشیه iframe را بردارید
2. با عناصر صوتی کار کنید
- 11 - سند خود را برای صدا تغییر دهید
- 12 - یک منبع صوتی را مشخص کنید
- 13 - چندین منبع صوتی را مشخص کنید
- 14 - محتوای بازگشتی را درج کنید
- 15 - ویژگیهای صوتی اضافی
- 16 - چالش - افزایش دسترسی به صدا با برچسب ها
- 17 - راه حل - افزایش دسترسی به صدا با برچسب ها
3. با عناصر ویدئو کار کنید
- 18 - سند خود را برای ویدیو تغییر دهید
- 19 - ارتفاع و عرض را مشخص کنید
- 20 - از تصویر پوستر استفاده کنید
- 21 - دسترسی به رسانه
- 22 - چالش - پس زمینه را با ویدیوی حلقه پر کنید
- 23 - راه حل - پس زمینه را با ویدیوی حلقه پر کنید
4. کنترلهای پخش رسانه را ایجاد کنید
- 24 - کنترلهای پیش فرض رسانه را غیرفعال کنید
- 25 - دکمههای پخش را اضافه کنید
- 26 - شامل عناصر متنی
- 27 - یک نوار پیشرفت ایجاد کنید
- 28 - چالش - کنترلهای رسانه را روی هم قرار دهید
- 29 - راه حل - كنترل هاي رسانه را روي هم قرار دهيد
5. کنترلهای پخش رسانه سبک
- 30 - استایلهای CSS را در یک سند تعریف کنید
- 31 - دکمههای خود را طراحی کنید
- 32 - به متن خود سبک دهید
- 33 - نوار پیشرفت خود را طراحی کنید
- 34 - چالش - از فونتهای وب استفاده کنید
- 35 - راه حل - از فونتهای وب استفاده کنید
6. با Media API کار کنید
- 36 - مروری بر Media API
- 37 - به رویدادهای رسانه گوش دهید
- 38 - کنترلهای دکمه برنامه
- 39 - نمایش زمان پویا
- 40 - نوار پیشرفت را سیم کشی کنید
- 41 - چالش - نمایش و مخفی کردن کنترل ها
- 42 - راه حل - نمایش و پنهان کردن کنترل ها
نتیجه
- 43 - اطلاعات بیشتر
دوره های مرتبط
- دوره آموزشی ساخت انیمیشنها و گرافیکهای تعاملی با Rive
- دوره آموزشی برنامه نویسی فرمهای وب با جاوااسکریپت
- دوره آموزشی یادگیری جامع ادوب انیمیت
- دوره آموزشی ورد: فرم های عمیق (مایکروسافت 365)
- دوره آموزشی CSS: انیمیشن
- دوره آموزشی CSS: تقویت رابطهای کاربری با انیمیشن
- دوره آموزشی ویژگی های جدید Adobe Animate CC
- دوره آموزشی پیمایش اسکرولی: ایجاد یک تجربه وب یک صفحهای