دوره آموزشی ایجاد یک تجربه وب واکنشگرا
1 ساعت 24 دقیقهپیشرفته2013-11-18
مدرسین

Chris Converse
Applies design and UX principles to technology
جزئیات دوره
خیلی وقتها فقط تغییر اندازه طراحی وبسایت کافی نیست تا تجربه کاربری رضایتبخشی ایجاد بشه. این دوره به شما کمک میکنه صفحات وبسایتتون رو بهطور بهتری برای اندازههای مختلف صفحه نمایش واکنشگرا کنید با استفاده از HTML، CSS و JavaScript. کریس کانورس نشون میده چطور HTML فعلی خودتون رو تغییر بدید، محتوا رو بهصورت داینامیک بارگذاری کنید، المانها رو روی صفحه انیمیشن بدید و منوها رو روی صفحههای کوچکتر جمع کنید—در حالی که به کاربران اجازه میدهید منوها رو با یک ضربه انگشت باز کنند.
توجه: این دوره از کتابخانه JavaScript به نام jQuery استفاده میکنه تا ویژگیهای تعاملی و دیگهای رو به سایت نمونه اضافه کنه. اما اگر هیچ وقت JavaScript ننوشتهاید، نگران نباشید. این دوره یک روش گامبهگام برای نوشتن کدهایی که برای تکرار تجربهای که کریس نشون میده نیاز دارید، ارائه میده.
اهداف یادگیری:
تغییر گرافیکها
تنظیم CSS برای ناوبری
افزودن JavaScript و jQuery به پروژه
بارگذاری محتوا با استفاده از jQuery
تعیین اندازه صفحه نمایش با JavaScript
بارگذاری محتوای جایگزین بسته به اندازه صفحه نمایش
انیمیشن دادن به پانل اصلی
حفظ پشتیبانی از Internet Explorer 7 و 8
توجه: این دوره از کتابخانه JavaScript به نام jQuery استفاده میکنه تا ویژگیهای تعاملی و دیگهای رو به سایت نمونه اضافه کنه. اما اگر هیچ وقت JavaScript ننوشتهاید، نگران نباشید. این دوره یک روش گامبهگام برای نوشتن کدهایی که برای تکرار تجربهای که کریس نشون میده نیاز دارید، ارائه میده.
اهداف یادگیری:
تغییر گرافیکها
تنظیم CSS برای ناوبری
افزودن JavaScript و jQuery به پروژه
بارگذاری محتوا با استفاده از jQuery
تعیین اندازه صفحه نمایش با JavaScript
بارگذاری محتوای جایگزین بسته به اندازه صفحه نمایش
انیمیشن دادن به پانل اصلی
حفظ پشتیبانی از Internet Explorer 7 و 8
مهارت ها
jQueryResponsive Web DesignHTMLCSSWeb DesignFull-Stack Web DevelopmentProjectWeb DevelopmentOpen Source
سرفصل ها
0. مقدمه
- 01 - پیش نمایش پروژه نهایی
- 02 - در مورد فایلهای تمرین
- 03 - نرم افزاری که برای تکمیل این دوره به آن نیاز دارید
- 04 - برای کسانی که از Dreamweaver استفاده میکنند
1. اصلاح پروژه قبلی
- 05 - اصلاح گرافیک
- 06 - تنظیم CSS برای ناوبری
2. بارگذاری پویا محتوا
- 07 - افزودن محفظه محتوا و فایل ها
- 08 - افزودن جاوا اسکریپت و جی کوئری به پروژه خود
- 09 - بارگذاری محتوا با جی کوئری
3. حالت دادن به منطقه قهرمان
- 10 - قرار دادن عکس و عنوان
- 11 - سبک دادن به عنوان قهرمان
4. تنظیم تجربه بر اساس اندازه صفحه نمایش
- 12 - تعیین اندازه صفحه با جاوا اسکریپت
- 13 - تشخیص تغییر در اندازه صفحه نمایش
- 14 - بارگذاری محتوای جایگزین بر اساس اندازه صفحه نمایش
- 15 - تنظیم دکمه ناو موبایل
- 16 - راهاندازی پنل ناوبری موبایل
- 17 - باز و بسته شدن پنل nav
5. متحرک سازی پنل قهرمان
- 18 - از پیش بارگذاری تصاویر
- 19 - متحرک سازی عناصر قهرمان
6. حفظ پشتیبانی از اینترنت اکسپلورر 7 و 8
- 20 - تغییر CSS و جاوا اسکریپت برای اینترنت اکسپلورر 7 و 8
نتیجه
- 21 - از اینجا به کجا برویم
دوره های مرتبط
- دوره آموزشی یادگیری جامع jQuery
- دوره آموزشی ساختن یک برنامه Google Maps با جاوا اسکریپت
- دوره آموزشی ساخت یک برنامه حمل و نقل عمومی با jQuery
- دوره آموزشی جی کوئری: ساختن یک رابط
- دوره آموزشی یادگیری جامع jQuery آپدیت (2016)
- دوره آموزشی جی کوئری برای طراحان وب
- دوره آموزشی یادگیری رابط کاربری جی کوئری
- دوره آموزشی CSS: تکنیک های پیشرفته تایپوگرافی