دوره جامع طراحی وب با HTML و CSS (وبسایتهای مدرن و واکنشگرا)
مدرس: علی کاظمی | سطح: مبتدی | مدت دوره: 30 ساعتمعرفی دوره
آیا تا به حال به این فکر کردهاید که وبسایتهای زیبا و حرفهای چگونه ساخته میشوند؟ HTML و CSS الفبای دنیای وب هستند و بدون یادگیری آنها، ورود به هر حوزه دیگری در توسعه وب غیرممکن است. این دوره کاملاً از صفر طراحی شده و شما را قدمبهقدم با اصول طراحی وب آشنا میکند.
در این دوره، ابتدا با HTML (زبان نشانهگذاری ابرمتن) آشنا میشوید و یاد میگیرید که چگونه ساختار و محتوای صفحات وب را ایجاد کنید. سپس با CSS (برگههای سبک آبشاری) آشنا شده و به صفحات خود رنگ، طرح، فونت، انیمیشن و زیبایی میبخشید. در ادامه با مفاهیم پیشرفتهتری مانند Flexbox، Grid، انیمیشنهای CSS و طراحی واکنشگرا (Responsive) آشنا میشوید تا وبسایتهایی بسازید که در تمامی دستگاهها (موبایل، تبلت، لپتاپ و دسکتاپ) بهخوبی نمایش داده شوند.
روش تدریس این دوره پروژهمحور است و در هر جلسه یک پروژه کوچک را تکمیل میکنیم. در پایان دوره، شما قادر خواهید بود یک وبسایت کامل و حرفهای شامل صفحات اصلی، درباره ما، تماس با ما و وبلاگ را از صفر تا صد طراحی و پیادهسازی کنید. تمامی جلسات ضبط شده و به همراه فایلهای تمرینی در اختیار شما قرار میگیرد.
پیشنیازها
- هیچ پیشنیازی لازم نیست! این دوره از ابتداییترین مفاهیم شروع میشود.
- آشنایی بسیار مقدماتی با کار با کامپیوتر (ایجاد پوشه، ذخیره فایل، کار با مرورگر)
- یک لپتاپ یا کامپیوتر شخصی با سیستمعامل ویندوز، مک یا لینوکس
- یک ویرایشگر کد ساده (مانند Notepad++، VS Code یا Sublime Text) – ما در طول دوره نصب و راهاندازی VS Code را با هم انجام میدهیم.
- اشتیاق برای یادگیری و خلاقیت 😊
مدرس دوره
علی کاظمی
مدرس دوره
سرفصل دوره
تاریخچه وب، تفاوت وبسایت و وباپلیکیشن، نحوه کار مرورگرها، آشنایی با Client-Server Architecture. نصب و راهاندازی VS Code و افزونههای مفید. ایجاد اولین فایل HTML و مشاهده در مرورگر.
ساختار اصلی یک سند HTML (Doctype، html، head، body). تگهای heading (h1 تا h6)، پاراگراف (p)، متنهای پررنگ و کج (strong, em)، خطوط افقی (hr) و شکست خط (br). ایجاد یک صفحه ساده با محتوای متنی.
ایجاد لینکهای داخلی و خارجی با تگ a (anchor). افزودن تصاویر با تگ img و تنظیم alt، width و height. ایجاد لیستهای مرتب (ol) و نامرتب (ul). ساخت یک صفحه ساده شامل منوی لینکها و تصاویر.
ایجاد جداول با تگهای table، tr، td، th و کاربردهای آن. ساخت فرمهای تعاملی با تگ form و عناصر input (متن، ایمیل، شماره تلفن، رمز عبور، دکمهها، رادیو باتن، چکباکس و سلکتباکس). اعتبارسنجی ساده با required و placeholder. ساخت فرم ثبتنام و تماس با ما.
سه روش اتصال CSS به HTML (Inline، Internal و External). سینتکس CSS (Selectors، Properties و Values). انواع سلکتورها (تگ، کلاس، آیدی، جهانی و فرزندی). رنگها (نامها، HEX، RGB، RGBA و HSL). فونتها و استایلدهی متون (font-family، font-size، font-weight، text-align، color، line-height).