دوره فرانت‌اِند

زیباسازی سایت با CSS

آیا می دانستید با یادگیری css چه کارهای زیبا و عجیبی می توانید روی سایت خود انجام دهید؟ در این دوره دقیقا نحوه پیاده‌سازی کارهای زیبا را به شما آموزش می‌دهیم.

CSS STYLES
CSS HOVER
CSS ANIMATE

 

 

کابوس محدود شدن به امکانات پوسته را برای همیشه فراموش کنید!

با یادگیری css قادر خواهید بود هر تغییر ظاهری و گرافیگی دلخواه مانند موارد زیر را خیلی راحت انجام دهید.

  • تغییر فونت‌، افزودن فونت دلخواه به پوسته
  • تغییر اندازه نوشته‌ها، عکس‌ها و المان‌های دیگر
  • تغییر رنگ دکمه‌ها و بخش‌های دیگر سایت
  • حذف برخی از المان‌های پوسته
  • افزودن افکت به دکمه‌ها، لینک‌ها، منو
  • تبدیل متن به دکمه
  • راست‌چین کردن المان‌های پوسته و پلاگین
  • و…

علاوه بر این یاد می‌گیرید چطور از افکت‌ها و کدهای آماده که در سایت‌های دیگر هستند استفاده کنید و آن‌ها را روی سایت خودتان پیاده‌سازی کنید. تصویر زیر خیلی واضح و مشخص به شما می‌گوید که CSS چه وظیفه‌ای را در سایت ایجاد می‌کند.

 

شاید باور نکنید ولی همین انیمیشن که در زیر مشاهده می‌کنید با css انجام شده است بدون اینکه حجمی داشته باشد.

افکت‌های جذاب

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

Sadie

افکت شماره یک

لورم ایپسوم متن ساختگی با تولید سادگی
با استفاده از طراحان گرافیک است

View more

img14

افکت شماره یک

لورم ایپسوم متن ساختگی با تولید سادگی
با استفاده از طراحان گرافیک است

View more

Layla

img06

افکت شماره دو

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.

View more

img03

افکت شماره دو

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.

View more

Bubba

img02

افکت شماره سه

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.

View more

img16

افکت شماره سه

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.

View more

پیاده‌سازی افکت‌های متنوع برای تصاویر

در دوره فرانت‌اِند (زیباسازی سایت با CSS) به شما یاد می‌دهیم چطور افکت‌هایی که در سایت‌های دیگر وجود دارد را روی سایت خودتان پیاده‌سازی کنید. همچنین منابعی را به شما معرفی می‌کنیم که افکت‌های بسیار جذابی در آن وجود دارد که برای شما آماده‌سازی شده که استفاده کنید و آن را به سایت خود اضافه کنید. افکتی که در زیر می‌بینید، هرگز امکانات پوسته (قالب) سایت نیست بلکه به کمک CSS به تصاویر باکس‌ها اضافه کرده‌ایم.

pr-sample13

28آذر

افکت افزودن رنگ به باکس

کافی است ماوس را روی باکس قرار دهید تا افکت جذاب اضافه شدن رنگ به باکس را مشاهده کنید

pr-sample21

17آذر

لورم ایپسوم متن ساختگی

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.

pr-sample23

08آذر

افکت افزودن رنگ به باکس

کافی است ماوس را روی باکس قرار دهید تا افکت جذاب اضافه شدن رنگ به باکس را مشاهده کنید

 

CSS چیست؟

در یک تعریف بسیار ساده و قابل فهم CSS ارتباط مستقیم با ظاهر، رنگ‌‌بندی، تغییرات فونت، نوع چینش المان‌های سایت دارد؛ یعنی شما با دانش و تسلط بر CSS می‌توانید سایت را زیبا کنید.

مثال‌های واقعی از اینکه CSS دقیقا چه کاری انجام می‌دهد را در همین صفحه می‌توانید مشاهده کنید.

  • راست‌چین بودن سایت یعنی ساختار سایت برای زبان فارسی سازگار است
  • افزودن فونت فارسی استاندارد به متن‌ها
  • چیدمان منظم بخش‌های سایت زیر هم و ایجاد تضاد بصری (اول منو، بعد سکشن رنگی، بخش محتوای متنی و…)
  • رنگ‌بندی کردن بخش‌های سایت (اختصاص طیف رنگی به سکشن اول، اختصاص رنگ‌های متنوع به دکمه‌ها و…)
  • ایجاد نظم به باکس‌ها و چیدمان چند ستونه
  • افزودن افکت‌های جذاب به دکمه‌های رنگی که در همین صفحه موجود است
  • ساخت یک تقویم جذاب و کاربردی
  • و خیلی دیگر از مواردی که شاید فکر کنید خلق آن‌ها خیلی سخت است و نیاز به دانش برنامه‌نویسی دارد اما بررسی که می‌کنید می‌بینید با CSS ایجاد شده است.


افزودن اسلایدر‌های متنوع به سایت

گاهی مدلی از اسلایدر مد نظر شما است که در امکانات قالب و المان‌های صفحه‌ساز‌ها وجود ندارد اما نمونه مورد پسند خود را در سایت دیگری دیده‌اید. باز هم تاکید می‌کنیم که کابوس محدود شدن به امکانات پوسته را برای همیشه فراموش کنید چون در این دوره به شما یاد می‌دهیم که چطور کدهای مربوط به یک اسلایدر را به سایت خودتان منتقل کنید. در این بخش یک اسلایدر مشاهده می‌کنید که ترکیب html، css و js است که فقط کدهای آن را با روش درست به سایت اضافه کردیم و آن را برای این صفحه شخصی‌سازی کردیم. اسلایدرها مدل‌های مختلفی دارند که شما می‌توانید برای سایت خود اضافه کنید.

  • اسلایدرهای نمایش محصولات
  • اسلایدرهای نمایش مقالات
  • اسلایدرهای نمایش نظرات مشتریان
  • اسلایدر نمایش گالری تصاویر
  • و …

 

دکمه‌های سایت خود را برای ترغیب بیشتر با انیمیشن‌های سی‌اس‌اس جذاب کنید

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


نحوه اضافه کردن فونت دلخواه به سایت و تغییرات ظاهری توسط CSS

در دو ویدیو زیر، محمدرضا عابدینی و احسان ملکی، مدرسین دوره نحوه اضافه کردن فونت دلخواه به سایت و تغییرات ظاهری با استفاده از CSS را توضیح می‌دهند.
در ویدیوی «نحوه اضافه کردن فونت دلخواه به سایت» یاد می‌گیرید برای تغییر دادن فونت سایت نیازی به نصب افزونه ندارید و بدون افزونه، فونت دلخواه را به سایت اضافه کنید.

 

در این دوره چه چیزهای یاد می‌گیرید؟

این دوره یک دوره عملی و مهیج برای افرادی است که می‌خواهند سایت خود را متحول کنند و محدود به تنظیمات قالب سایت نباشند. این دوره به‌طور کلی شامل سرفصل‌های زیر است.

مشخصات دوره فرانت‌اِند

مدت زمان دوره: 9 ساعت
فرمت ویدیو: MP4 با کیفیت HD
تعداد جلسات: 5 جلسه
مدرس‌ها: احسان ملکی، محمدرضا عابدینی
مبلغ990،000 تومان

مدرسین دوره فرانت‌اِند

احسان ملکی

  • مدیر باشگاه اپلیکیشن و باشگاه وردپرس
  • توسعه‌دهنده فرانت‌اِند و بک‌اِند
  • مجری و کارشناس طراحی وب در برنامه‌های تلویزیونی
  • مجری و مشاور ده‌ها کسب‌و‌کار اینترنتی فعال
  • مدرس ده‌ها کارگاه آموزشی در زمینه طراحی سایت و کسب‌وکارهای اینترنتی

محمدرضا عابدینی

  • مدرس دوره وب‌دیزاین واقعی مدیر سبز
  • طراح سایت تمام‌وقت تیم مدیر سبز
  • توسعه دهنده فرانت‌اِند
  • طراح رابط کاربری وب و اپلیکیشن (UI)
  • طراح سایت‌های وردپرسی
  • مجری و مشاور ده‌ها وب‌سایت فروشگاهی، املاک، آموزشی
آیا دوره به‌صورت زنده برگزار می‌شود یا فیلم‌های ضبط‌شده در اختیار ما قرار می‌گیرد؟

این دوره در بهمن 1399 برگزار شده است و در حال حاضر بعد از خرید، فیلم‌های دوره را می‌توانید دانلود کنید.

من خودم کار با CSS‌ را بلدم. آیا دوره برایم مفید است؟

اگر CSS‌ و استفاده از کدهای آماده را طوری بلد هستید که همین صفحه معرفی دوره فرانت‌اِند را بدون استفاده از امکانات قالب و صفحه‌ساز پیاده‌سازی کنید، نیازی به شرکت در این دوره ندارید.

در این دوره HTML هم آموزش داده می‌شود؟

قبل از شروع آموزش CSS معرفی اجمالی بر HTML خواهیم داشت. ساختار و برخی تگ‌های پرکاربرد HTML را معرفی می‌کنیم تا در بخش CSS دقیقا بدانید کار چطور پیش می‌رود.

آیا می‌توانیم رنگ دکمه‌ها و بخش‌هایمختلف سایت را بدون استفاده از تنظیمات قالب تغییر دهیم؟

بله، شما در این دوره یاد می‌گیرید چگونه با کمک CSS تغییرات ظاهری مانند تغییر رنگ دکمه‌ها، لینک‌ها، باکس‌ها و دیگر المان‌ها را در سایت اعمال کنید.

با وجود قالب‌های پیشرفته وردپرسی آیا نیاز به یادگیری CSS است؟

به جرات می‌گوییم که هیچ قالب پیشرفته‌ وردپرسی پیدا نخواهید کرد که تمام امکانات شخصی‌سازی را به شما بدهد. بهترین قالب‌ها را هم اگر استفاده کنید باز هم بخش‌هایی از سایت هستند که نیاز دارد تغییر کند و باید به‌صورت دستی اعمال کنید.

بنابراین اگر دانش CSS داشته باشید دیگر محدودیتی برای تغییر قالب سایت نخواهید داشت.

دوره فرانت‌اِند (زیباسازی سایت با CSS)

990،000 تومان

خرید دوره
عضویت | ورود
شماره موبایل یا ایمیل خود را وارد کنید
برگشت
کد تایید را وارد کنید
کد تایید برای شماره موبایل شما ارسال گردید
ارسال مجدد کد تا دیگر
برگشت
رمز عبور را وارد کنید
رمز عبور حساب کاربری خود را وارد کنید
برگشت
رمز عبور را وارد کنید
رمز عبور حساب کاربری خود را وارد کنید
برگشت
درخواست بازیابی رمز عبور
لطفاً پست الکترونیک یا موبایل خود را وارد نمایید
برگشت
کد تایید را وارد کنید
کد تایید برای شماره موبایل شما ارسال گردید
ارسال مجدد کد تا دیگر
ایمیل بازیابی ارسال شد!
لطفاً به صندوق الکترونیکی خود مراجعه کرده و بر روی لینک ارسال شده کلیک نمایید.
تغییر رمز عبور
یک رمز عبور برای اکانت خود تنظیم کنید
تغییر رمز با موفقیت انجام شد
ثبت‌نام دوره جدید سیستم سازی پیشرفته (غیرحضوری) با 2.000.000 تومان تخفیف
روز
ساعت
دقیقه
ثانیه