آموزش طراحی وب Responsive دستی 2: تصاویر و اسلایدرهای Responsive

Hands-on Responsive Web Design 2: Responsive Images and Sliders

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیویی برای نمایش وجود ندارد.
توضیحات دوره: هنگام ایجاد هر وب سایت پاسخگو ، معمولاً از اطلاعات HTML5 ، CSS3 و SASS اطلاع دارید. این دوره به شما می آموزد که چگونه با استفاده از برچسب های تصویر و عکس که می توانید در پروژه توسعه وب بعدی خود استفاده کنید ، تصاویر واکنش گرا را پیاده سازی کنید. همه را بزرگ کنید بررسی اجمالی دوره 1 متر 10 ثانیه مقدمه 8 متر 6 ثانیه تصاویر پس زمینه و مقیاس بندی 25 متر 0 ثانیه آرم تراکم Pixel 9m 44s تصاویر پاسخگو به اندازه مشابه 14m 28s تصاویر پاسخگو در اندازه های مختلف 16m 34s کارگردانی هنری 20 متر 37s تصاویر تنبل بار 15 متر 27 ثانیه لغزنده های تصویر 10 متر 31 ثانیه علائم تجاری و نام تجاری اشخاص ثالث ذکر شده در این دوره متعلق به صاحبان مربوطه می باشند و Pluralsight وابسته یا تأیید شده توسط این احزاب نیست.

سرفصل ها و درس ها

بررسی اجمالی دوره Course Overview

  • بررسی اجمالی دوره Course Overview

مقدمه Introduction

  • بررسی اجمالی Overview

  • تراکم پیکسل Pixel Density

تصاویر پس زمینه و مقیاس بندی Background and Scaling Images

  • بررسی اجمالی Overview

  • ساخت تصاویر هدر زمینه در فتوشاپ Building the Background Header Images in Photoshop

  • افزودن تصویر پس زمینه هدر در CSS Adding the Header Background Image in the CSS

  • ساخت و افزودن تصویر بدنه مقیاس پذیر Building and Adding the Scaling Body Image

  • در حال آزمایش صفحه Testing the Page

آرم تراکم Pixel Pixel Density Logo

  • بررسی اجمالی Overview

  • ساخت آرم های مختلف Building the Different Sized Logos

  • افزودن نشان ها به عنوان صفحه وب با استفاده از SRCSET Adding the Logos to the Web Page Header Using SRCSET

  • در حال آزمایش سایت در چندین مرورگر و دستگاه Testing out Site on Multiple Browsers and Devices

تصاویر پاسخگو به اندازه مشابه Similar Sized Responsive Images

  • بررسی اجمالی Overview

  • ایجاد تصاویر در فتوشاپ Creating Images in Photoshop

  • ساختن ستون های روزنامه Building Newspaper Columns

  • استفاده از SRCSET برای یک تصویر محتوا Using SRCSET for a Content Image

  • صفحه و توصیه ها را امتحان کنید Testing Page and Recommendations

تصاویر پاسخگو در اندازه های مختلف Different Sized Responsive Images

  • بررسی اجمالی Overview

  • تصویر با 50 درصد عرض صفحه Image at 50 Percent Page Width

  • تصویر در عرض های چند صفحه Image at Multiple Page Widths

  • در حال آزمایش صفحه در چندین مرورگر Testing Page on Multiple Browsers

کارگردانی هنری Art Direction

  • بررسی اجمالی Overview

  • تصویر قهرمان پرتره با استفاده از جهت هنری Portriat Hero Image Using Art Direction

  • تصویر قهرمان پرتره و منظره با استفاده از جهت هنری Portriat and Landscape Hero Image Using Art Direction

  • معرفی Tag Tag Introducing the Picture Tag

  • تست و بررسی اندازه صفحه Testing and Page Size Review

تصاویر تنبل بار Lazy Load Images

  • بررسی اجمالی Lazy Loading Overview of Lazy Loading

  • تنبل بارگیری با جاوا اسکریپت Lazy Loading with JavaScript

  • در حال بارگذاری تنبل با تصاویر پاسخگو Lazy Loading with Responsive Images

لغزنده های تصویر Image Sliders

  • نمای کلی اسلایدرها Overview of Sliders

  • با یک مجموعه عکس یک اسلایدر بسازید Build a Slider with One Set of Images

  • با تصاویر پاسخگو یک اسلایدر بسازید Build a Slider with Responsive Images

نمایش نظرات

نظری ارسال نشده است.

آموزش طراحی وب Responsive دستی 2: تصاویر و اسلایدرهای Responsive
خرید اشتراک و دانلود خرید تکی و دانلود | 160,000 تومان (5 روز مهلت دانلود) زمان تقریبی آماده سازی لینک دانلود این دوره آموزشی حدود 5 تا 24 ساعت می باشد.
جزییات دوره
2h 1m
32
Pluralsight (پلورال سایت) pluralsight-small
02 شهریور 1396 (آخرین آپدیت رو دریافت می‌کنید، حتی اگر این تاریخ بروز نباشد.)
29
4.7 از 5
دارد
دارد
دارد
Paul Cheney

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Paul Cheney Paul Cheney

کمک به مردم برای درک آبرنگ


سلام، من پل هستم. قبل از همه‌گیری، یک فروشگاه مستقل کوچک آبرنگ در پاریس انتاریو داشتم. من از آموزش آبرنگ به صدها نفر به صورت حضوری لذت بردم. چند سال به سرعت به جلو رفت و من اکنون در حال انتقال روند تدریس خود به صورت آنلاین هستم. من فکر می کنم ضروری است هنگام آموزش آنلاین تمام تلاش خود را برای ارائه همان سطح از آموزش با کیفیت انجام دهید. مردم باید مفاهیم را درک کنند و بتوانند آنها را در کار خود به کار ببرند. چه به صورت حضوری و چه آنلاین، یادگیری هنر مهارتی است که هر کسی می تواند بر آن مسلط شود. مطمئناً ممکن است برای برخی افراد آسان تر باشد، اما هیچ جادو، استعداد پنهان و غیره وجود ندارد.

هنر یک مهارت آموخته شده است، هیچ کس با آن متولد نمی شود - مانند بسیاری از مهارت ها - فقط تمرین می خواهد. امیدوارم از کلاس های من لذت برده باشید، لطفا در صورت امکان بازخورد خود را بنویسید!

Pluralsight (پلورال سایت)

Pluralsight یکی از پرطرفدارترین پلتفرم‌های آموزش آنلاین است که به میلیون‌ها کاربر در سراسر جهان کمک می‌کند تا مهارت‌های خود را توسعه دهند و به روز رسانی کنند. این پلتفرم دوره‌های آموزشی در زمینه‌های فناوری اطلاعات، توسعه نرم‌افزار، طراحی وب، مدیریت پروژه، و موضوعات مختلف دیگر را ارائه می‌دهد.

یکی از ویژگی‌های برجسته Pluralsight، محتوای بروز و با کیفیت آموزشی آن است. این پلتفرم با همکاری با توسعه‌دهندگان و کارشناسان معتبر، دوره‌هایی را ارائه می‌دهد که با توجه به تغییرات روزافزون در صنعت فناوری، کاربران را در جریان آخرین مفاهیم و تکنولوژی‌ها نگه می‌دارد. این امر به کاربران این اطمینان را می‌دهد که دوره‌هایی که در Pluralsight می‌پذیرند، با جدیدترین دانش‌ها و تجارب به روز شده‌اند.