لطفا جهت اطلاع از آخرین دوره ها و اخبار سایت در
کانال تلگرام
عضو شوید.
آموزش یادگیری صوتی و تصویری وب
Learning Web Audio and Video
نکته:
آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:
نیاز به اشتراک گذاری ویدیو یا صدا در سایت های خود دارید ، اما انداختن آن در YouTube یا موتور پادکست گزینه ای نیست؟ فناوری های وب بومی - HTML ، CSS و JavaScript - پشتیبانی مستقیم از صدا و تصویر را برای شما فراهم می کنند تا بتوانید از رسانه استفاده کرده و تجربه پخش را کاملاً شخصی سازی کنید. این دوره مقدماتی با مربیگری جوزف لابرکک به شما کمک می کند تا صدا و فیلم تعاملی را در وب سایت ها و برنامه های خود ایجاد کنید. ابتدا اصول عناصر رسانه HTML5 و ویژگی های آنها را مرور کنید. سپس نحوه جاسازی رسانه ، پشتیبانی از عقب مانده و تنظیم اندازه ، میزان صدا و سایر تنظیمات مهم را بیابید. در مرحله بعدی ، نحوه شخصی سازی رابط ها برای استاندارد کردن ظاهر و عملکرد پخش کننده خود در مرورگرهای مختلف را بیاموزید. بعلاوه ، بیاموزید که چگونه تجربه کاربر را با HTML5 Media API کاملاً تعاملی کنید.
موضوعات شامل:
پیوند با رسانه li>
جاسازی رسانه ها li>
تغییر سند خود برای صدا و تصویر li>
تعیین منابع صوتی li>
تعیین ارتفاع و عرض فیلم li>
اطمینان از دسترسی li>
ایجاد کنترل های پخش li>
یک ظاهر طراحی کنترل های پخش li>
کار با HTML5 Media API
سرفصل ها و درس ها
مقدمه
Introduction
صوتی و تصویری تعاملی را در وب سایت ها و برنامه های خود بسازید
Build interactive audio and video into your websites and applications
آنچه شما باید بدانید
What you should know
از پرونده های تمرینی استفاده کنید
Use the exercise files
چه جدید در این به روز رسانی
What's new in this update
1. با رسانه های مبتنی بر وب شروع کنید
1. Get Started with Web-Based Media
محیط خود را تنظیم کنید
Set up your environment
سند جدیدی ایجاد کنید
Create a new document
پیوند به محتوای رسانه ای
Link to media content
از رسانه های تعبیه شده استفاده کنید
Use embedded media
چالش: حاشیه iframe را بردارید
Challenge: Remove the iframe border
راه حل: حاشیه iframe را بردارید
Solution: Remove the iframe border
2. با عناصر صوتی کار کنید
2. Work with Audio Elements
سند خود را برای صدا تغییر دهید
Modify your document for audio
منبع صوتی را مشخص کنید
Specify an audio source
چندین منبع صوتی را مشخص کنید
Specify multiple audio sources
محتوای برگشتی را وارد کنید
Include fallback content
ویژگی های صوتی اضافی
Additional audio attributes
چالش: قابلیت دسترسی صوتی را با برچسب ها افزایش دهید
Challenge: Increase audio accessibility with tags
راه حل: قابلیت دسترسی صوتی را با برچسب ها افزایش دهید
Solution: Increase audio accessibility with tags
3. با عناصر ویدیویی کار کنید
3. Work with Video Elements
سند خود را برای فیلم اصلاح کنید
Modify your document for video
ارتفاع و عرض را مشخص کنید
Specify height and width
از تصویر پوستر استفاده کنید
Use a poster image
قابلیت دسترسی به رسانه
Media accessibility
چالش: پس زمینه را با ویدئو حلقه ای پر کنید
Challenge: Fill the background with looping video
راه حل: پس زمینه را با ویدئو حلقه ای پر کنید
Solution: Fill the background with looping video
4. کنترل های پخش رسانه را ایجاد کنید
4. Create Media Playback Controls
کنترلهای پیش فرض رسانه را غیرفعال کنید
Disable default media controls
دکمه های پخش را اضافه کنید
Add playback buttons
عناصر متن را وارد کنید
Include text elements
یک نوار پیشرفت ایجاد کنید
Create a progress bar
چالش: کنترل های رسانه را بیش از حد پوشش دهید
Challenge: Overlay the media controls
راه حل: کنترل های رسانه را همپوشانی کنید
Solution: Overlay the media controls
5. کنترل های پخش رسانه ای سبک
5. Style Media Playback Controls
سبک های CSS را در یک سند تعریف کنید
Define CSS styles in a document
دکمه های خود را طراحی کنید
Design your buttons
متن خود را سبک کنید
Style your text
نوار پیشرفت خود را طراحی کنید
Design your progress bar
چالش: از فونت های وب استفاده کنید
Challenge: Use web fonts
راه حل: از فونت های وب استفاده کنید
Solution: Use web fonts
6. با API Media کار کنید
6. Work with the Media API
بررسی اجمالی API رسانه
Overview of media API
برای رویدادهای رسانه گوش دهید
Listen for Media events
کنترل های دکمه برنامه
Program button controls
نمایش زمان پویا
Dynamic time display
نوار پیشرفت را سیم کشی کنید
Wire up the progress bar
چالش: کنترل ها را نشان دهید و پنهان کنید
Challenge: Show and hide the controls
راه حل: کنترل ها را نشان دهید و پنهان کنید
Solution: Show and hide the controls
لینکدین: شبکه اجتماعی حرفهای برای ارتباط و کارآفرینی
لینکدین به عنوان یکی از بزرگترین شبکههای اجتماعی حرفهای، به میلیونها افراد در سراسر جهان این امکان را میدهد تا ارتباط برقرار کنند، اطلاعات حرفهای خود را به اشتراک بگذارند و فرصتهای شغلی را کشف کنند. این شبکه اجتماعی به کاربران امکان میدهد تا رزومه حرفهای خود را آپدیت کنند، با همکاران، دوستان و همکاران آینده ارتباط برقرار کنند، به انجمنها و گروههای حرفهای ملحق شوند و از مقالات و مطالب مرتبط با حوزه کاری خود بهرهمند شوند.
لینکدین همچنین به کارفرمایان امکان میدهد تا به دنبال نیروهای با تجربه و مهارت مورد نیاز خود بگردند و ارتباط برقرار کنند. این شبکه حرفهای به عنوان یک پلتفرم کلیدی برای بهبود دسترسی به فرصتهای شغلی و گسترش شبکه حرفهای خود، نقش مهمی را ایفا میکند. از این رو، لینکدین به عنوان یکی از مهمترین ابزارهای کارآفرینی و توسعه حرفهای در دنیای امروز مورد توجه قرار دارد.
جوزف لابرک یک توسعه دهنده، طراح و استاد دانشگاه خلاق است.
جوزف نزدیک به دو دهه تجربه در ساخت وب گویا دارد. راه حل های دسکتاپ و موبایل. او کتابها، مقالات و دورههای ویدئویی در زمینه فناوریهای طراحی و توسعه، ابزارها و مفاهیم را از طریق ناشران مانند LinkedIn Learning، Peachpit Press و Adobe تالیف کرده است. او شرکت Fractured Vision Media, LLC را تأسیس کرد. یک استودیوی تولید رسانه های دیجیتال و وسیله نقلیه توزیع. جوزف استاد دانشگاه کلرادو بولدر کالج رسانه، ارتباطات و اطلاعات، و همچنین یک رهبر آموزش Adobe، Adobe Community Professional، و یکی از اعضای Adobe Partners by Design است.
نمایش نظرات