آموزش HTML و CSS پیشرفته - پروژه محور

poster
پیش‌نمایش دوره

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

برگزارکننده:  مکتب‌خونه  مکتب‌خونه
مدرس دوره:
5 (2 رای)
سطح: پیشرفته
 پلاس
  
زمان مورد نیاز برای گذراندن دوره:  54 ساعت
مجموع محتوای آموزشی:  54 ساعت ویدئو
 (قابل دانلود می‌باشد)

آنچه در این دوره می‌آموزیم:

 آشنایی با سبک‌های مختلف طراحی نظیر Neumorphism و Glassmorphism در طراحی قالب

 پیاده‌سازی طرح‌ها و شبکه‌بندی‌های پیچیده قالب‌ها

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

 بالا بردن مهارت پیاده‌سازی انواع قالب‌های پیچیده و بیرون کشیدن الگوی قالب‌های بزرگ

پیش‌نیاز‌ها

برای گذراندن این دوره نیاز به آشنایی اولیه با HTML , CSS و Flexbox دارید.

سرفصل‌های دوره آموزش HTML و CSS پیشرفته - پروژه محور

پیاده‌سازی پروژه

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

  پروژه لودینگ سفارشی
مشاهده
"21:41  
  پروژه هاور در هاوایی
مشاهده
"23:05  
  پروژه لیست سفارشی - قسمت اول
مشاهده
"12:28  
  پروژه لیست سفارشی - قسمت دوم
"17:39  
  پروژه هاور سفارشی - بخش اول
"16:10  
  پروژه هاور سفارشی - بخش دوم
"13:57  
  پروژه هاور سفارشی - بخش سوم
"17:36  
  پروژه آیکن های شیشه ای (سبک Glassmorphism) - بخش اول
"11:28  
  پروژه آیکن‌های شیشه‌ای (سبک Glassmorphism) - بخش دوم
"16:24  
  پروژه آیکن‌های شیشه‌ای (سبک Glassmorphism) - بخش سوم
"23:52  
  پروژه ساعت آنالوگ
"23:38  
  پروژه منو سفارشی
"19:57  
  پروژه فنجان برنامه نویس - بخش اول
"25:02  
  پروژه فنجان برنامه نویس - بخش دوم
"22:16  
  پروژه لکه رنگ
"12:47  
  پروژه طراحی قالب - بخش اول
"12:41  
  پروژه طراحی قالب - بخش دوم
"15:55  
  پروژه طراحی قالب - بخش سوم
"25:10  
  پروژه طراحی قالب واکنشگرایی - بخش چهارم
"24:56  
پروژه‌ اسنپ

در این فصل به پیاده‌سازی قالب سایت اسنپ می‌پردازیم و بیشتر پروژه‌هایی را پیاده‎‌سازی می‌کنیم که در بازار کار و قالب‌های پیشرفته در انواع سایت‌های فروشگاهی مشاهده می‌شوند و همین طور درباره واحدهای REM و Em صحبت خواهیم کرد.

  پروژه شبیه‌سازی هندوانه
مشاهده
"24:32  
  پروژه هاور پیشرفته - بخش اول
"19:23  
  پروژه هاور پیشرفته - بخش دوم
"11:30  
  پروژه product hover - بخش اول
"21:30  
  پروژه product hover - بخش دوم
"13:47  
  پروژه product hover - بخش سوم
"15:07  
  پروژه لاگین سفارشی -بخش اول
"24:05  
  پروژه لاگین سفارشی -بخش دوم
"17:27  
  پروژه نمایش محصولات فروشگاه - بخش اول
"16:48  
  پروژه نمایش محصولات فروشگاه - بخش دوم
"11:24  
  پروژه سه بعدی (3ِD) شبیه سازی کتاب - بخش اول
"19:33  
  پروژه سه بعدی (3ِD) شبیه سازی کتاب - بخش دوم
"17:59  
  پروژه Progress Bar سفارشی - بخش اول
"13:02  
  پروژه Progress Bar سفارشی - بخش دوم
"24:21  
  پروژه باکس نئونی - بخش اول
مشاهده
"15:35  
  پروژه باکس نئونی - بخش دوم
"17:26  
  پروژه باکس نئونی - بخش سوم
"15:14  
  پروژه باکس نئونی - بخش چهارم
"15:18  
  پروژه پلن های سایت - بخش اول
"18:44  
  پروژه پلن های سایت - بخش دوم
"20:37  
  پروژه قالب اسنپ (معرفی پروژه)
"07:56  
  پروژه قالب اسنپ - بخش اول
"24:42  
  پروژه قالب اسنپ - بخش دوم
"19:40  
  پروژه قالب اسنپ - بخش سوم
"07:21  
  پروژه قالب اسنپ - بخش چهارم
"24:21  
  پروژه قالب اسنپ - بخش پنجم
"24:21  
  پروژه قالب اسنپ - بخش ششم
"16:33  
  پروژه قالب اسنپ - بخش هفتم
"21:57  
  پروژه قالب اسنپ - بخش هشتم
"18:52  
  پروژه قالب اسنپ - بخش نهم
"03:29  
  پروژه قالب اسنپ - بخش دهم
"15:53  
  پروژه قالب اسنپ - بخش یازدهم (واحدهای EM و REM)
"24:36  
  پروژه قالب اسنپ - بخش دوازدهم
"25:02  
  پروژه قالب اسنپ - بخش سیزدهم
"21:09  
  پروژه قالب اسنپ - بخش چهاردهم
"22:22  
  پروژه قالب اسنپ - بخش پانزدهم
"22:12  
پروژه باکس‌های محصولات و پلن‌های عضویت

در این فصل به پیاده‌سازی قالب دیوار می‌پردازیم و پروژه‌هایی نیز بیشتر در رابطه با باکس‌های محصولات و پلن‌های عضویت در وب سایت‌ها می‌باشند.

  معرفی پروژه ها
مشاهده
"05:06  
  پروژه دمو محصول - بخش اول
"12:01  
  پروژه دمو محصول - بخش دوم
"16:10  
  پروژه لاگین سفارشی -بخش اول
"17:08  
  پروژه لاگین سفارشی - بخش دوم
"16:05  
  پروژه پلن اعضای ویژه - بخش اول
"25:04  
  پروژه پلن اعضای ویژه - بخش دوم
"22:41  
  پروژه لوینگ سفارشی
"20:20  
  پروژه باکس دیجی کالا - بخش اول
"28:35  
  پروژه باکس دیجی کالا - بخش دوم
"10:02  
  پروژه لیست سفارشی - بخش اول
"17:51  
  پروژه لیست سفارشی - بخش دوم
"16:17  
  پروژه هاور سفارشی - بخش اول
"14:09  
  پروژه هاور سفارشی - بخش دوم
"18:04  
  پروژه محصولات دمو - بخش اول
"18:29  
  پروژه محصولات دمو - بخش دوم
"20:25  
  پروژه اسلایدر تصاویر - بخش اول
مشاهده
"16:34  
  پروژه اسلایدر تصاویر - بخش دوم
"15:03  
  پروژه قالب وب سایت دیوار - بخش اول
"03:18  
  پروژه قالب وب سایت دیوار - بخش دوم
"24:58  
  پروژه قالب وب سایت دیوار - بخش سوم
"25:02  
  پروژه قالب وب سایت دیوار - بخش چهارم
"19:14  
  پروژه قالب وب سایت دیوار - بخش پنجم
"17:26  
  پروژه قالب وب سایت دیوار - بخش ششم
"21:19  
پروژه اسنپ فود

در این فصل به پیاده‌سازی قالب اسنپ فود پرداخته و با دو موضوع مهم Timing Function و CSS Browser Support آشنا خواهیم شد.

  پروژه سرچ باکس - بخش اول
مشاهده
"13:24  
  پروژه سرچ باکس - بخش دوم
"15:11  
  پروژه سرچ باکس سفارشی
"18:18  
  پروژه navbar
"14:47  
  پروژه navbar سفارشی - بخش اول
"23:26  
  پروژه navbar سفارشی - بخش دوم
"12:30  
  پروژه dropdown menu - بخش اول
"19:12  
  پروژه dropdown menu - بخش دوم
"18:04  
  پروژه Form شیشه ای
"24:05  
  پروژه تم روشن و تاریک وب سایت
"10:23  
  پروژه لودینگ سفارشی - نوع اول
"21:14  
  پروژه لودینگ سفارشی - نوع دوم
"23:08  
  مفهوم CSS Browser Support
"13:09  
  مفهوم Timing Function
"11:18  
  پروژه قالب اسنپ فود - بخش اول
"21:41  
  پروژه قالب اسنپ فود - بخش دوم
"22:29  
  پروژه قالب اسنپ فود - بخش سوم
"22:29  
  پروژه قالب اسنپ فود - بخش چهارم
"14:39  
  پروژه قالب اسنپ فود - بخش پنجم
"23:52  
  پروژه قالب اسنپ فود - بخش ششم
"24:34  
  پروژه قالب اسنپ فود - بخش هفتم
"14:46  
  پروژه قالب اسنپ فود - بخش هشتم
"15:59  
  پروژه قالب اسنپ فود - بخش نهم
"20:46  
پروژه آپارات

در این فصل به پیاده‌سازی قالب سایت دیوار می‌پردازیم و وارد پیاده‌سازی طرح‌ها در قالب 3D می‌شویم و نحوه پیاده‌سازی این اشکال را یاد می‌گیریم.

  پروژه پنل سفارشی - بخش اول
مشاهده
"13:41  
  پروژه پنل سفارشی - بخش دوم
"14:14  
  پروژه باکس سفارشی
"19:18  
  پروژه کارد سفارشی - بخش اول
"19:30  
  پروژه کارد سفارشی - بخش دوم
"14:01  
  پروژه پلن عضویت ویژه
"25:04  
  پروژه لودینگ (به سبک neomorphism)
"12:57  
  پروژه باکس سه بعدی 3D
"20:04  
  پروژه کامنت سفارشی
"19:07  
  پروژه star box card - بخش اول
مشاهده
"17:59  
  پروژه star box card - بخش دوم
"13:55  
  پروژه ساخت آیکن همبرگر منو
مشاهده
"11:37  
  پروژه وب سایت آپارات - بخش اول
"24:52  
  پروژه وب سایت آپارات - بخش دوم
"21:53  
  پروژه وب سایت آپارات - بخش سوم
"13:43  
  پروژه وب سایت آپارات - بخش چهارم
"25:06  
  پروژه وب سایت آپارات - بخش پنجم
"22:31  
  پروژه وب سایت آپارات - بخش ششم
"18:21  
  پروژه وب سایت آپارات - بخش هفتم
"20:42  
  پروژه وب سایت آپارات - بخش هشتم
"21:13  
  پروژه وب سایت آپارات - بخش نهم
"22:43  
پروژه دیجی کالا

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

  پروژه چک باکس سفارشی با قابلیت timing function
مشاهده
"21:59  
  پروژه دکمه سفارشی
"14:33  
  پروژه کار با نقشه google map
"14:28  
  پروژه روبان تخفیف ویژه - نوع اول - بخش اول
"15:25  
  پروژه روبان تخفیف ویژه - نوع اول - بخش دوم
"17:13  
  پروژه روبان تخفیف ویژه - نوع دوم
"23:00  
  پروژه input Box سفارشی
"17:37  
  پروژه بک گراند هدر سفارشی - نوع اول
"14:44  
  پروژه بک گراند هدر سفارشی - نوع دوم
"16:51  
  پروژه بک گراند هدر سفارشی - نوع سوم
"13:14  
  قالب وب سایت دیجی کالا - بخش اول
مشاهده
"24:48  
  قالب وب سایت دیجی کالا - بخش دوم
"19:54  
  قالب وب سایت دیجی کالا - بخش سوم
"11:52  
  قالب وب سایت دیجی کالا - بخش چهارم
"24:20  
  قالب وب سایت دیجی کالا - بخش پنجم
"24:22  
  قالب وب سایت دیجی کالا - بخش ششم
"15:41  
  قالب وب سایت دیجی کالا - بخش هفتم
"16:03  
  قالب وب سایت دیجی کالا - بخش هشتم
"24:48  
  قالب وب سایت دیجی کالا - بخش نهم
"24:45  
  قالب وب سایت دیجی کالا - بخش دهم
"21:39  
  قالب وب سایت دیجی کالا - بخش یازدهم
"25:04  
  قالب وب سایت دیجی کالا - بخش دوازدهم
"16:52  
  قالب وب سایت دیجی کالا - بخش سیزدهم
"23:25  
  قالب وب سایت دیجی کالا - بخش چهاردهم
"18:07  
  قالب وب سایت دیجی کالا - بخش پانزدهم
"23:35  
  قالب وب سایت دیجی کالا - بخش شانزدهم
"12:52  
  قالب وب سایت دیجی کالا - بخش هفدهم
"22:00  
  قالب وب سایت دیجی کالا - بخش هجدهم
"10:38  
  قالب وب سایت دیجی کالا - بخش نوزدهم
"22:48  
  قالب وب سایت دیجی کالا - بخش بیستم
"24:38  
  قالب وب سایت دیجی کالا - بخش بیست و یکم
"17:48  
  قالب وب سایت دیجی کالا - بخش بیست و دوم
"12:25  
  قالب وب سایت دیجی کالا - بخش بیست و سوم
"24:29  
  قالب وب سایت دیجی کالا - بخش بیست و چهارم
"19:07  
  قالب وب سایت دیجی کالا - بخش بیست و پنجم
"24:43  
  قالب وب سایت دیجی کالا - بخش بیست و ششم
"16:15  
  قالب وب سایت دیجی کالا - بخش بیست و هفتم
"24:56  
  قالب وب سایت دیجی کالا - بخش بیست و هشتم
"23:45  
  قالب وب سایت دیجی کالا - بخش بیست و نهم
"21:30  
  قالب وب سایت دیجی کالا - بخش سی ام
"20:01  
  قالب وب سایت دیجی کالا - بخش سی و یکم
"01:52  
پروژه پنل مدیریت

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

  پروژه تایپینگ سفارشی
مشاهده
"14:43  
  پروژه باکس سه بعدی 3D - بخش اول
"20:16  
  پروژه باکس سه بعدی 3D - بخش دوم
"07:33  
  پروژه تب بار
"22:27  
  پروژه دکمه سفارشی - نوع اول
"16:06  
  پروژه دکمه سفارشی - نوع دوم
"18:56  
  پروژه دکمه سفارشی - نوع سوم
"16:16  
  پروژه لاگین دیجی کالا
"22:25  
  پروژه چک باکس سفارشی
"13:55  
  پروژه progress bar خطی
"12:33  
  پروژه داشبورد مدیریت - بخش اول
"23:32  
  پروژه داشبورد مدیریت - بخش دوم
"24:49  
  پروژه داشبورد مدیریت - بخش سوم
"22:15  

درباره دوره

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

 
هدف آموزش HTML و CSS پیشرفته

این دوره مناسب افرادی است که زبان HTML و CSS را فراگرفته‌اند و قصد دارند نحوه به‌کارگیری این دو زبان و نحوه ترکیب این دو را در قالب‌های تخصصی و رابط کاربری سطح بالا یاد بگیرند این دوره اختصاصاً به پیاده‌سازی قالب‌های حرفه‌ای و گرافیکی با استفاده از HTML و CSS می‌پردازد. پس اگر این دو زبان را به‌صورت کامل بلد هستید و قصد دارید مهارت خود را در پیاده‌سازی قالب‌های تخصصی بالا ببرید این دوره مناسب شما است.

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

اهداف آموزش CSS پیشرفته (پروژه محور) چیست؟

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

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

راه‌حل ما : ما این مشکل را برای همیشه حل کردیم. در این دوره که شامل ۷ فصل است و در هر فصل ۱۰ پروژه سطح بالا و کاربردی است که ۹ پروژه گرافیکی و یک پروژه طراحی کامل قالب وب‌سایت پرداختیم که عملیات رسپانسیو کردن را نیز در این دوره به‌صورت کامل بر روی پروژه‌ها اعمال می‌کنیم تا پس از این دوره آموزشی هنگام پیاده‌سازی یک وب‌سایت پیشرفته اصلاً مشکلی روبروی شما نباشد و باتکیه‌بر پروژه‌هایی که در این دوره انجام دادیم و مطالب آموزشی که در این دوره یاد گرفتید بتوانید هر طرح و یا هر پروژه بزرگ و سازمانی را انجام دهید.

آیا این دوره پروژه محور است؟

در واقع باید بگوییم شما از جلسه اول تا جلسه آخر این دوره  تعداد ۷۰ پروژه را پیاده‌سازی می‌کنید که این پروژه‌ها کاملاً تخصصی و کاربردی هستند، و در ابتدای هر پروژه توضیحات و موارد جدیدی که در آن جلسه و آن پروژه قرار است یاد بگیرید را به‌صورت کامل بررسی نموده و بعد وارد محیط برنامه‌نویسی شده و پروژه خود را به‌صورت مرحله‌به‌مرحله پیاده‌سازی خواهیم کرد.

 
آیا در این دوره از کدهای آماده استفاده شده؟

خیر. به‌هیچ‌وجه نه در این دوره و نه در باقی دوره‌های وب‌سایت آرتور ما از هیچ‌گونه کد آماده استفاده نخواهیم کرد.

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

 
نکته مهم : این دوره درواقع سطح بسیار پیشرفته‌تر و حرفه‌ای‌تری نسبت به دوره‌های HTML و CSS است و در پایان این دوره شما قادر خواهید بود به‌راحتی و با شجاعت و اعتمادبه‌نفس کامل پروژه طراحی سایت دریافت کنید و به درآمد برسید و یا برای استخدام در شرکت‌ها می‌توانید و به‌تمامی سؤالات فنی برای مصاحبه پاسخ دهید.

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

چگونه کیفیت آموزش تضمین می‌شود؟

قبل از شرکت در دوره آموزشی ما برای شما قسمت‌هایی از این دوره را به‌صورت رایگان قرار می‌دهیم تا با دانلودکردن و دیدن کیفیت آموزش بتوانید بهتر نسبت به شرکت در این دوره تصمیم بگیرید.

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

آموزش HTML و CSS پیشرفته - پروژه محور مناسب چه کسانی است؟

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

پروژه‌های مهم این دوره 

  • لندینگ‌پیج قالب وب‌سایت دیجی‌کالا 
  • لندینگ‌پیج قالب وب‌سایت اسنپ
  • لندینگ‌پیج قالب وب‌سایت دیوار 
  • لندینگ‌پیج قالب وب‌سایت اسنپ فود
  • لندینگ‌پیج قالب وب‌سایت آپارات
  • لندینگ‌پیج قالب پنل مدیریت 

درباره استاد

maktabkhooneh-teacher رضا کوهساری

رضا کوهساری، دانش آموخته مهندسی کامپیوتر گرایش نرم‌افزار از دانشگاه جهرم است و دارای تخصص در حوزه طراحی وب‌سایت به صورت فرانت‌اند و بک‌اند (Full Stack) مشغول به فعالیت هستند. ایشان با چهار سال تجربه در این حوزه و فعالیت به مدت دو سال در شرکت پایش به‌عنوان برنامه‌نویس وب و TA درس طراحی سایت فعالیت نموده و از سال ۱۴۰۰ تا هم اکنون با عنوان مدیر و مدرس، در وب‌سایت آموزش برنامه‌نویسی آرتور در این حوزه مشغول به فعالیت است. از سوابق آموزش ایشان می‌توان به بیش از ۲۰۰ ساعت آموزش حضوری و بیش از ۲۵۰ ساعت آموزش آنلاین در قالب بیش از 20 دوره آموزشی در زمینه طراحی وب اشاره نمود.

مشاهده پروفایل و دوره‌‌های استاد

نظرات کاربران

تا کنون نظری برای این دوره ثبت نشده است. برای ثبت نظر باید ابتدا در دوره ثبت نام کرده و دانشجوی دوره باشید.
1402-10-21
سلام فایل پیوست فصل دوم اسنب کجاست

دوره‌های پیشنهادی

سوالات پرتکرار

پس از سپری شدن زمان دوره، به محتوای دوره دسترسی خواهم داشت؟
بله؛ پس از سپری شدن مدت زمان دوره شما به محتوای دوره دسترسی خواهید داشت و می توانید از ویدئوها، تمارین، پروژه و دیگر محتوای دوره در صورت وجود استفاده کنید ولی امکان تصحیح تمارین توسط پشتیبان و دریافت گواهی نامه برای شما وجود نخواهد داشت.

دوره آموزش HTML و CSS پیشرفته

دنیای وب پر از وب‌سایت‌های خیره‌کننده و تعاملی است که کار با آن‌ها لذت بخش است؛ اما آیا تا به حال فکر کرده‌اید که چه چیزی باعث می‌شود این وب‌سایت‌ها به این زیبایی و کارآمدی برسند؟ پاسخ ساده است: HTML و CSS.

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

چرا آموزش HTML و CSS پیشرفته مهم است؟

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

با آموزش HTML و CSS پیشرفته، می‌توانید:

  • ایجاد طرح‌های پیچیده: از چیدمان‌های چند ستونی گرفته تا انیمیشن‌های ظریف، با تکنیک‌های پیشرفته می‌توانید وب‌سایت‌هایی با ظاهری کاملاً حرفه‌ای ایجاد کنید.
  • بهبود تجربه کاربری: وب‌سایت‌های پیشرفته نه‌تنها زیبا به نظر می‌رسند، بلکه با کاربر نیز تعامل بیشتری دارند. با انیمیشن های جذاب، منوها و فرم‌های تعاملی و طرح‌های پاسخگو، می‌توانید وب‌سایتی بسازید که کاربر از گشت‌وگذار در آن لذت ببرد.
  • وب‌سایت‌های با کارایی بالا ایجاد کنید: تکنیک‌های پیشرفته مانند پیش پردازنده‌های CSS و فریم ورک ها به شما کمک می‌کند کد تمیزتر و کارآمدتری بنویسید که باعث بارگذاری سریع‌تر وب‌سایت شما می‌شود.
  • از دیگران متمایز شوید: با استفاده از دانش پیشرفته خود در HTML و CSS، می‌توانید وب‌سایت‌هایی با ظاهری منحصربه‌فرد و چشمگیر بسازید که از وب‌سایت‌های رقیب متمایز شوند.

ویژگی‌های کلیدی آموزش HTML و CSS پیشرفته

حالا که اهمیت آموزش HTML و CSS پیشرفته را درک کردید، بیایید نگاهی به برخی از ویژگی‌های کلیدی این مباحث آموزشی بیندازیم:

HTML5 و ویژگی‌های جدید CSS3: در آموزش اچ تی ام ال و سی اس اس پیشرفته آخرین ویژگی‌های HTML5 و CSS3 را بررسی خواهیم کرد که به شما امکان می‌دهد وب‌سایت‌های مدرن و پویا بسازید.

پیش پردازنده‌های CSS: در مباحث پیشرفته اچ تی ام ال و سی اس اس یاد خواهید گرفت که از پیش پردازنده‌های قدرتمندی مانند SASS یا LESS برای سازمان‌دهی کد CSS خود، افزایش کارایی و نوشتن کد تمیزتر استفاده کنید.

فریم‌ورک‌های CSS: فریم‌ورک‌های CSS مانند Bootstrap به شما مجموعه‌ای از کلاس‌های از پیش تعریف شده ارائه می‌دهند که به شما کمک می‌کند تا به سرعت وب‌سایت‌های واکنش گرا و سازگار با دستگاه‌های مختلف ایجاد کنید.

انیمیشن های CSS: انیمیشن های CSS به شما این امکان را می‌دهند که به وب‌سایت خود روح وزندگی ببخشید. در این دوره، یاد خواهید گرفت که چگونه انیمیشن های صاف و جذاب برای عناصر وب‌سایت خود ایجاد کنید.

Responsive Design: وب‌سایت‌های واکنش گرا با اندازه صفحه‌نمایش دستگاه کاربر سازگار می‌شوند و اطمینان حاصل می‌کنند که وب‌سایت شما در همه دستگاه‌ها به خوبی به نظر برسد. در دوره آموزش HTML و CSS پیشرفته ما به شما اصول طراحی واکنش گرا را آموزش خواهیم داد.

بهینه‌سازی عملکرد: در آموزش پیشرفته HTML و CSS پیشرفته یاد خواهید گرفت که چگونه وب‌سایت خود را برای بارگذاری سریع بهینه کنید که برای تجربه کاربری و سئو (بهینه‌سازی برای موتورهای جستجو) بسیار مهم است.

مباحث مورد بحث در آموزش HTML و CSS پیشرفته

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

  • فرم‌های پیشرفته HTML5
  • اعتبارسنجی فرم با HTML5
  • ذخیره‌سازی وب با HTML5
  • ویژگی‌های جدید CSS3 مانند Flexbox و Grid
  • استفاده از پیش پردازنده‌های CSS مانند SASS یا LESS
  • کار با فریم‌ورک‌های CSS مانند Bootstrap
  • ایجاد انیمیشن های جذاب و کاربردی

فراتر از اصول اولیه: تکنیک‌های پیشرفته HTML و CSS

علاوه بر مباحث پایه‌ای که در بالا ذکر شد، آموزش HTML و CSS پیشرفته به شما تکنیک‌های پیشرفته‌تری را نیز آموزش می‌دهد که به شما کمک می‌کند تا وب‌سایت‌های حرفه‌ای‌تر و کارآمدتر بسازید. در اینجا چند نمونه از این تکنیک‌ها آورده شده است:

استفاده از Flexbox و Grid برای چیدمان: Flexbox و Grid دو روش قدرتمند برای چیدمان عناصر در صفحه هستند. با استفاده از این تکنیک‌ها می‌توانید چیدمان‌های پیچیده را به راحتی و به صورت انعطاف‌پذیر ایجاد کنید.

ایجاد وب‌سایت‌های تک‌صفحه‌ای (SPA): SPA ها وب‌سایت‌هایی هستند که از چندین صفحه HTML تشکیل‌شده‌اند اما فقط یک بار بارگذاری می‌شوند. این امر باعث ایجاد تجربه کاربری روان‌تر و سریع‌تری می‌شود.

استفاده از SVG برای گرافیک‌های برداری: SVG ها فرمتی از تصاویر هستند که مقیاس‌پذیر هستند و کیفیت خود را در هر اندازه‌ای حفظ می‌کنند. این آن‌ها را برای استفاده در وب ایده آل می‌کند.

بهینه‌سازی عملکرد وب‌سایت: با استفاده از تکنیک‌های مختلف مانند فشرده‌سازی کد و بهینه‌سازی تصاویر، می‌توانید سرعت بارگذاری وب‌سایت خود را افزایش دهید.

ایجاد وب‌سایت‌های امن: امنیت وب‌سایت بسیار مهم است. در این دوره، اصول امنیت وب را به شما آموزش خواهیم داد تا از وب‌سایت خود در برابر حملات محافظت کنید.

با آموزش HTML و CSS پیشرفته، به یک توسعه‌دهنده وب ماهر تبدیل شوید

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

دوره جامع آموزش ساخت سایت با HTML و CSS پیشرفته

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

سرفصل‌های دوره آموزش HTML و CSS پیشرفته

سرفصل‌های این دوره آموزشی به صورت موارد زیر است:

  • آشنایی با مفاهیم پایه وب: در این بخش با مفاهیم کلیدی مانند HTML، CSS، جاوا اسکریپت و نحوه عملکرد آن‌ها در کنار هم آشنا خواهید شد.
  • پیاده‌سازی پروژه: در این بخش، مهارت‌های خود را با انجام 7 پروژه عملی از جمله پروژه اسنپ، دیجی کالا، آپارات و ... به کار خواهید گرفت.
  • پروژه اسنپ: در این پروژه، گام‌به‌گام مراحل ساخت کپی وب‌سایت اسنپ را آموزش می‌بینید و با مفاهیمی مانند فرم‌ها، منوهای کشویی، نقشه و ... آشنا خواهید شد.
  • پروژه باکس‌های محصولات و پلن‌های عضویت: در این پروژه، نحوه ساخت باکس‌های جذاب برای نمایش محصولات و پلن‌های عضویت را فرا خواهید گرفت.
  • پروژه اسنپ فود: در این پروژه، با چالش ساخت کپی وب‌سایت اسنپ فود روبرو خواهید شد و مهارت‌های خود را در زمینه طراحی صفحات رستوران‌ها، منوها و سبد خرید ارتقا خواهید داد.
  • پروژه آپارات: در این پروژه، با الهام از وب‌سایت آپارات، نحوه طراحی صفحات ویدیو، بخش جستجو و پروفایل کاربری را آموزش می‌بینید.
  • پروژه دیجی کالا: در این پروژه، سفری جامع به دنیای تجارت الکترونیک خواهید داشت و با ساخت کپی وب‌سایت دیجی کالا، مفاهیمی مانند دسته‌بندی محصولات، فیلترها، سبد خرید و درگاه پرداخت را فرا خواهید گرفت.
  • پروژه پنل مدیریت: در این پروژه، نحوه طراحی و ساخت یک پنل مدیریت ساده برای وب‌سایت را آموزش می‌بینید.

دوره آموزش HTML و CSS پیشرفته برای چه کسانی مناسب است؟

این دوره برای افراد زیر مناسب است:

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

دانشجویان پس از پایان دوره آموزش اچ تی ام ال و سی اس اس پیشرفته چه چیزی می‌آموزند؟

کاربران پس از پایان دوره آموزش HTML و CSS پیشرفته با مفاهیم زیر آشنا خواهند شد:

  • تسلط بر زبان‌های HTML و CSS: در پایان این دوره، شما به طور کامل بر زبان‌های HTML و CSS مسلط خواهید شد و می‌توانید انواع مختلف وب‌سایت را طراحی و پیاده‌سازی کنید.
  • مهارت طراحی وب‌سایت: شما مهارت‌های لازم برای طراحی وب‌سایت‌های زیبا، پویا و واکنش گرا را به دست خواهید آورد.
  • آشنایی با مفاهیم کلیدی وب: شما با مفاهیم کلیدی وب مانند HTTP، HTTPS، دامنه، هاستینگ و ... آشنا خواهید شد.
  • توانایی انجام پروژه‌های عملی: شما با گذراندن 7 پروژه عملی، مهارت‌های خود را در دنیای واقعی به کار خواهید گرفت و می‌توانید نمونه کارهای قوی برای ارائه به کارفرمایان یا مشتریان خود داشته باشید.
  • آمادگی برای ورود به بازار کار: با گذراندن این دوره، شما برای ورود به بازار کار به عنوان طراح وب آماده خواهید شد و می‌توانید به طور مستقل یا در شرکت‌های مختلف مشغول به کار شوید.

این دوره، کلید ورود شما به دنیای پر رونق طراحی وب است. همین امروز در این دوره ثبت‌نام کنید و قدم در مسیر تبدیل شدن به یک طراح وب ماهر بگذارید!

آیا برای شرکت در این دوره به دانش قبلی HTML و CSS نیاز دارم؟

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

این دوره چه مدت طول می‌کشد؟

مدت‌زمان این دوره به سرعت یادگیری شما بستگی دارد. با این حال، به طور متوسط، می‌توانید انتظار داشته باشید که 6 تا 8 هفته طول بکشد تا دوره را کامل کنید.

آیا برای شرکت در این دوره به نرم‌افزار خاصی نیاز دارم؟

برای شرکت در این دوره به یک ویرایشگر متن ساده مانند Notepad++ یا Sublime Text و یک مرورگر وب مانند Chrome یا Firefox نیاز دارید.

 آیا پس از اتمام دوره گواهینامه‌ای دریافت می‌کنم؟

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

آموزش HTML و CSS با مکتب خونه

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

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

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

poster
پیش‌نمایش دوره
  
برگزار کننده:  مکتب‌خونه
  
زمان مورد نیاز برای گذراندن دوره:  54 ساعت
مجموع محتوای آموزشی:  54 ساعت ویدئو
 (قابل دانلود می‌باشد)