رایا اسکیلز

طراحی 0 تا 100 سایت با
هوش مصنوعی

AI

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

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

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

درخواست ثبت‌نام دوره

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

سطح دوره

مقدماتی تا پیشرفته

تعداد پروژه

۶ پروژه عملی

شیوه آموزش

ویدئویی و پروژه‌محور

دسترسی

دائمی

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

آشنایی با اینترنت و وب، نصب VS Code، ساخت اولین فایل HTML، ساختار سند، متن و عنوان‌ها، لینک‌ها، تصاویر، لیست‌ها، جدول‌ها، فرم‌ها و HTML معنایی.

اتصال CSS، انتخابگرها، رنگ‌ها، واحدهای اندازه‌گیری، فونت، Margin و Padding، Border، Background، Box Model، Display و Pseudo Class.

Position، Flexbox، CSS Grid، طراحی منو و هدر، کارت‌ها، چیدمان چندستونه، Overflow، Z-index، Stacking Context و نام‌گذاری BEM.

Responsive Design، Viewport، Breakpoint، Media Query، Mobile First، واحدهای نسبی، تصاویر واکنش‌گرا و سازگاری با موبایل و تبلت.

Transition، Transform، Animation، Keyframe، Hover Effect، Micro Interaction، فرم‌های کاربرپسند و اصول پایه دسترس‌پذیری.

Chrome DevTools، اشکال‌زدایی CSS، آشنایی مقدماتی با Git، اصول پایه سئو در HTML، پروژه‌های عملی و بهینه‌سازی پروژه پایانی.

آشنایی مقدماتی با تعاملات صفحه و مفهوم کتابخانه‌های JavaScript.

مشخصات دوره

پیش‌نیاز

بدون نیاز به دانش برنامه‌نویسی

پشتیبانی

رفع اشکال و بررسی تمرین

مدرک

گواهی پایان دوره

مسیر بعدی

JavaScript و فرانت‌اند
خروجی واقعی دوره

بعد از این دوره چه کارهایی می‌توانید انجام دهید؟

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

طراحی ساختار استاندارد صفحات وب

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

طراحی ظاهر حرفه‌ای با CSS

رنگ، تایپوگرافی، فاصله‌گذاری، پس‌زمینه، افکت‌ها و چیدمان عناصر را مدیریت می‌کنید.

ساخت سایت واکنش‌گرا

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

اجرای پروژه واقعی

چند صفحه و وب‌سایت واقعی می‌سازید و آن‌ها را به‌عنوان نمونه‌کار ارائه می‌دهید.

کار با ابزارهای توسعه وب

با VS Code، Chrome DevTools، Git مقدماتی و ابزارهای موردنیاز یک طراح وب آشنا می‌شوید.

آمادگی برای ادامه مسیر فرانت‌اند

بعد از تسلط بر HTML و CSS می‌توانید وارد مسیر JavaScript و توسعه فرانت‌اند شوید.

چرا یادگیری HTML و CSS اولین قدم ورود به طراحی سایت است؟

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

یادگیری HTML و CSS به شما کمک می‌کند منطق ساخت صفحات وب را درک کنید، سایت‌های آماده را بهتر ویرایش کنید و برای یادگیری JavaScript، React و سایر ابزارهای فرانت‌اند آماده شوید.
چرا یادگیری HTML و CSS
مسیر یادگیری

مسیر یادگیری شما در دوره HTML و CSS

قدم‌به‌قدم از مفاهیم پایه تا ساخت یک پروژه قابل ارائه.

۱

آشنایی با وب و HTML

ساختار صفحات، متن، تصویر، لینک، جدول، فرم و HTML معنایی.

۲

شروع طراحی با CSS

انتخابگرها، رنگ، فونت، فاصله‌گذاری، Border، Background و Box Model.

۳

چیدمان حرفه‌ای

پیاده‌سازی Layout با Flexbox، Grid، Position و روش‌های استاندارد.

۴

واکنش‌گرایی و انیمیشن

Media Query، Breakpoint، Transition، Transform و Animation.

۵

ساخت پروژه و نمونه‌کار

ترکیب مهارت‌ها برای ساخت صفحات و وب‌سایت‌های واقعی.
تمرین و نمونه‌کار

در این دوره فقط آموزش نمی‌بینید؛ پروژه می‌سازید

هر پروژه برای تمرین مجموعه‌ای از مهارت‌های واقعی طراحی شده است و از سطح ساده به حرفه‌ای پیش می‌رود.
پروژه ۱: صفحه معرفی شخصی

پروژه ۱: صفحه معرفی شخصی

ساختار HTML، تایپوگرافی، تصویر، لینک و چیدمان پایه
HTML
CSS
پروژه ۲: لندینگ‌پیج محصول

پروژه ۲: لندینگ‌پیج محصول

Hero Section، CTA، کارت ویژگی‌ها، فرم و طراحی واکنش‌گرا
HTML
CSS
پروژه ۳: صفحه وبلاگ

پروژه ۳: صفحه وبلاگ

Grid، کارت محتوا، Sidebar و ساختار معنایی HTML
HTML
CSS
پروژه ۴: گالری تصاویر

پروژه ۴: گالری تصاویر

CSS Grid، Hover، Transition و Responsive Design
HTML
CSS
پروژه ۵: داشبورد مدیریتی

پروژه ۵: داشبورد مدیریتی

Flexbox، Grid، جدول، فرم، منو و طراحی کامپوننت
HTML
CSS
پروژه ۶: پروژه پایانی

پروژه ۶: پروژه پایانی

ترکیب HTML5، CSS3، Responsive Design و Animation
HTML
CSS
مخاطبان دوره

دوره HTML و CSS برای چه کسانی مناسب است؟

برای شروع این دوره نیازی به تجربه برنامه‌نویسی ندارید؛ آشنایی عادی با کامپیوتر و اینترنت کافی است.

شروع از صفر

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

دانش‌آموز و دانشجو

دانش‌آموزان و دانشجویان علاقه‌مند به برنامه‌نویسی وب.

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

افرادی که قصد ورود به مسیر فرانت‌اند را دارند.

مدیران سایت

مدیران سایت و تولیدکنندگان محتوا که می‌خواهند ساختار صفحات را بهتر بشناسند.

طراحان UI

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

صاحبان کسب‌وکار

افرادی که می‌خواهند برای خود یا کسب‌وکارشان سایت طراحی کنند.
پشتیبانی دوره

در مسیر یادگیری تنها نمی‌مانید

یکی از دلایل رهاکردن دوره‌های آنلاین، بی‌پاسخ‌ماندن سؤال‌هاست. این بخش مسیر دریافت راهنمایی را شفاف می‌کند.

۱

سؤال یا تمرین را ارسال می‌کنید

از مسیر پشتیبانی دوره، سؤال و فایل تمرین خود را ثبت می‌کنید.

۲

تیم آموزشی بررسی می‌کند

مشکل، کد یا ساختار پروژه شما بررسی می‌شود.

۳

بازخورد دریافت می‌کنید

پاسخ و راهنمای اصلاح را دریافت می‌کنید.

۴

مسیر را ادامه می‌دهید

بدون گیرکردن و رهاکردن دوره، مرحله بعد را پیش می‌برید.

گواهی پایان دوره HTML و CSS

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

مدرس دوره HTML و CSS

مجید تجن جاری

مجید تجن جاری

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

هر چیزی که قبل از ثبت‌نام باید بدانید

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

HTML ساختار و محتوای صفحه را می‌سازد و CSS ظاهر، رنگ، فاصله‌گذاری و چیدمان آن را کنترل می‌کند.

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

در طول دوره ۶ پروژه عملی از سطح مقدماتی تا پروژه نهایی اجرا می‌کنید.

بله. دانشجویان می‌توانند سؤالات و مشکلات خود را مطرح کرده و برای تمرین‌ها و پروژه‌های دوره راهنمایی دریافت کنند.

پس از ثبت‌نام، دسترسی شما به محتوای دوره دائمی خواهد بود.

شرایط واقعی پرداخت اقساطی را پس از ایمپورت در همین پاسخ تکمیل کنید.

پیشنهاد می‌شود بعد از تسلط بر HTML و CSS، JavaScript، Git و سپس یکی از ابزارهای فرانت‌اند مانند React را شروع کنید.

4 1 رای
امتیازدهی به مقاله
اشتراک در
اطلاع از
2 نظرات
قدیمی‌ترین
تازه‌ترین بیشترین رأی

بعد از ثبت نام تا چه مدت به ویدیوها دوره دسترسی داریم؟

پیمایش به بالا

 مسیر یادگیری و ورود به بازار کار و نمی‌دونی؟

شمارت رو بذار تا برای یک مشاوره رایگانِ باهات تماس بگیریم و بهترین نقشه راه رو بهت پیشنهاد بدیم

میخوای خودت پیام بدی یا تماس بگیری؟
درخواست مشاوره رایگان
🎯 مسیر یادگیری مناسب هدف خودت رو پیدا کن 📞 مشاوره رایگان برای انتخاب بهترین مسیر 🚀 از یادگیری تا ورود به بازار کار 💻 آموزش پروژه‌محور و کاربردی 🧭 نمی‌دونی از کجا شروع کنی؟ راهنماییت می‌کنیم 👨‍🏫 پشتیبانی و همراهی در مسیر یادگیری 🔥 مسیرت رو با یک مشاوره رایگان شروع کن