نکته مهم: این دوره فقط برای دانشجویان دوره جامع وبمستر پلاس و به صورت هدیه در دسترس است و امکان ثبت نام مجزا در آن وجود ندارد. (با ثبت نام در دوره جامع وبمستر پلاس این دوره و تمامی دوره های دیگر وب سایت را به صورت هدیه و رایگان دریافت کنید.) ---> برو به دوره جامع وبمستر پلاس

آموزش HTML و CSS (پروژه محور)

باید لاگین کنید!

در این دوره آموزشی از صفر تا صد زبان‌های Html و Css را به‌صورت قدم به قدم و پروژه محور یاد می‌گیرید، همچنین یاد می‌گیرید که چگونه فریم‌ورک بوت‌استرپ (Bootstrap) را به‌صورت عملی و در یک پروژه واقعی استفاده کنید (طرحی که در دوره UI و UX طراحی کردیم را در این دوره به قالب Html و Css تبدیل می‌کنیم)

قیمت دوره:

1,95 میلیون تومان

هدیه دوره وبمستر پلاس

با کلیک روی دکمه زیر میتوانید پیشنمایش وبسایت طراحی شده را مشاهده کنید.

پیش نمایش سایت

توضیحات دوره

دوره جامع آموزش Html و Css

زبان‌های نشانه‌گذاری Html و Css، ابتدایی‌ترین زبان‌هایی است که باید برای طراحی وب‌سایت‌ها یاد بگیرید، در این دوره به صورت پروژه محور یاد می‌گیرید این زبان‌ها را یاد می‌گیرید، همچنین در عمل کار با دو فریم‌ورک جی‌گوئری (jQuery) و بوت‌استرپ (Bootstrap) را نیز از صفرتاصد یاد می‌گیرید.

ما در دوره آموزش UI و UX قالب یک وب‌سایت فروشگاهی را به صورت کامل با نرم‌افزار Adobe XD طراحی کردیم، حال در این دوره دقیقا همان قالب را به قالب Html و Css تبدیل می‌کنیم.

چه مواردی یاد می گیرید؟

در این دوره در ابتدا یاد می گیرید که به چه صورت یک صفحه وب ایجاد کنید، یعنی از صفر صفر کار را آغاز می‌کنیم و یک وب‌سایت فروشگاهی حرفه‌ای را با تمام صفحات آن طراحی می‌کنیم، صفحاتی مثل: صفحه‌اصلی، صفحه بلاگ، صفحه محصول، صفحه ورود و ثبت‌نام و …

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

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

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

شما اگر طراحی سایت با وردپرس را بلد هستید، با یادگیری زبان‌های فرانت‌اند سایت یعنی زبان‌های Html و Css و Js تقریبا دیگر هیچ محدودیتی در وردپرس نخواهید داشت! و دیگر هر نوع وب‌سایتی که نیاز داشته باشید را می‌توانید به سادگی طراحی کنید…

این دوره برای چه افرادی توصیه می شود؟

  • افرادی که می‌خواهد به صورت کامل و حرفه‌ای وارد حوزه طراحی سایت شوند
  • افرادی که می‌خواهند از طراحی سایت درآمدهای فوق‌العاده کسب کنند
  • افرادی که طراحی سایت با وردپرس را بلد هستند و می‌خواهند سایت‌های وردپرسی حرفه‌ای‌تری را طراحی کنند
  • افرادی که می‌خواهند در حوزه طراحی فرانت‌اند وب‌سایت فعالیت کنند
  • افرادی که می‌خواهند در یک شرکت معتبر به عنوان یک فرانت‌اند کار ماهر مشغول کار شوند
  • افرادی که می‌خواهند شرکت و کسب‌وکار اینترنتی خودشان را راه‌اندازی کنند
  • افرادی که می‌خواهند به صورت فریلنسری و در منزل خود از طراحی سایت به کسب درآمد بپردازند
این دوره برای چه افرادی توصیه نمی شود؟
  • افرادی که هیچ علاقه ای به طراحی سایت ندارند
  • افرادی که علاقه‌ای به کسب درآمد از طراحی سایت ندارند
  • افرادی که طراحان سایت ماهری هستند و می توانند با Html و Css سایت‌های جذابی طراحی کنند

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

آشنایی با نرم‌افزارهای برنامه‌ نویسی و انتخاب یک نرم‌افزار برای شروع کار

  1. اشنایی اولیه با زبان HTML و تگ‌های آن
  2. آشنایی اولیه با زبان HTML و CSS
  3. افزودن فایل‌های مورد نیاز به پروژه

آموزش ریسپانسیو در بوت‌استرپ و شروع طراحی هدر سایت

  1. افزودن فونت به سایت و تنظیم کلاس‌های رنگ‌بندی
  2. طراحی قسمت هدر سایت و اسلایدر اصلی
  3. ادامه طراحی اسلایدر اصلی + طراحی آیکون‌های فروشگاه
  4. طراحی بخش محصولات اختصاصی در صفحه اصلی
  5. ادامه طراحی بخش محصولات اختصاصی + طراحی بنرهای صفحه اصلی
  6. طراحی قسمت‌های اسلایدر محصولات، فید اینستاگرام، اسلایدر لوگو
  7. طراحی بخش بلاگ در صفحه اصلی
  8. طراحی فوتر سایت
  9. طراحی بخش شمارنده تاریخ و ریسپانسیو صفحه اصلی

ادامه ریسپانسیو صفحه اصلی

  1. طراحی زیر منو و مگامنوی حرفه‌ای
  2. ادامه طراحی مگامنو (ریسپانسیو مگامنو)
  3. طراحی منوی موبایل
  4. طراحی بخش مینی کارت (نمایش سبد خرید در منوی اصلی)

تنظیم رنگ بندی به صورت داینامیک و شروع طراحی صفحه محصول

  1. طراحی قسمت تب‌های صفحه محصول + ریسپانسیو صفحه محصول

طراحی صفحه بلاگ + ریسپانسیو صفحه بلاگ

  1. طراحی صفحات آرشیو بلاگ

طراحی صفحه آرشیو محصولات

  1. طراحی سایدبار صفحه آرشیو محصولات + ریسپانسیو صفحه

طراحی صفحات ورود، ثبت‌نام و 404

  1. طراحی صفحه سبد خرید و ریسپانسیو آن
  2. طراحی صفحات تسویه حساب و ثبت سفارش
نبی عبدی

نبی عبدی

مدرس دوره

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

دیدگاه و پرسش

  1. mkomeilm (خریدار محصول)

    با عرض سلام و خسته نباشید خدمت استاد محترم و اعضای تیم اموزشیتون
    من هر چی نسخه های متفاوت اتم و اخرین نسخه اون رو نصب میکنم هیچ پکیجی بالا نمیاره و اخطار searching for “Emmet”filed روبه رو میشم
    لطفا راهنمایی کنین با تشکر

    • پشتیبانی

      سلام، لطفا از حساب کاربری خود تیکت ارسال کنید تا در این رابطه راهنمایی های لازم انجام شود.

  2. علی عزیزی

    سلام
    این دوره برای کسایی که هیچ چیزی از Html و Css نمیدونند هم مناسبه؟ یعنی از پایه آموزش داده میشه؟
    و اینکه دوره ویژه کسایی هست که می خوان وردپرس کار بشن یا اینکه نه برای سایر افراد هم خوبه؟

    • پشتیبانی

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

  3. محمدرضا

    سلام وقت بخیر
    میخواستم بدانم آیا در این دوره تمام صفحات سایتی که در دوره ui-ux طراحی شده اند در این دوره با زبان های htmlوcss ساخته میشوند یا اینکه فقط بعضی از صفحات ساخته می شوند؟
    و همچنین در این دوره ابتدا زبان های html و css تدریس می شوند بعدش وارد ساخت پروژه می شود یا اینکه همزمان هستند؟

    • پشتیبانی

      درود، بله تمامی صفحات طراحی می‌شوند، در این دوره هدف یادگیری در طول پروژه است.

  4. امیرعلی

    سلام
    من تازه شروع به اموزش طراحی سایت کردم و خیلی علاقه دارم به طور حرفه ای طراحی سایت ب ویژه اموزش css و یاد بگیرم
    ایا اموزش های css , html و که گذاشتید برای منی که هیچ اطلاعاتی در این مورد ندارم مناسبه؟

    • پشتیبانی

      درود بر شما، بله آموزش ها کاملا از صفر شروع شده و تا حرفه‌ای ادامه می‌یابد.

آموزش HTML و CSS (پروژه محور)
آموزش HTML و CSS (پروژه محور)

هدیه دوره وبمستر پلاس