آموزش HTML و CSS: دوره جامع و سریع. در چند ساعت به متخصص طراحی وب تبدیل شوید! - آخرین آپدیت

دانلود HTML und CSS: Der ultimative Crashkurs. Website-Profi in wenigen Stunden!

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

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

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

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

سرفصل‌های آموزشی:

مباحث عمومی:

  • وظیفه و ساختار (سینتکس) HTML و CSS

  • مقایسه کوتاه بین HTML، CSS و JavaScript

  • نرم‌افزارها و پلتفرم‌های مهم: CodePen، Visual Studio Code (به همراه افزونه‌ها)

  • اینترنت و شبکه جهانی وب (World Wide Web)

  • تفاوت فرانت-اند (Frontend) و بک-اند (Backend)

  • ساخت وب‌سایت شخصی و انتشار سریع و رایگان آن!

  • نکات کاربردی و تجربی برای برنامه‌نویسان تازه‌کار

HTML:

  • المان‌های معنایی (Semantic) و نمایشی

  • المان‌های متنی (تیترها، پاراگراف‌ها، نقل‌قول‌ها و غیره)

  • المان‌های ساختاری (هدر، فوتر، Section، Article، منوهای ناوبری، خطوط جداکننده و شکست خط...)

  • تگ‌های تاکید و برجسته‌سازی متن

  • دسترس‌پذیری (Accessibility) و سازگاری فنی

  • المان‌های Inline و Block-level

  • مدل شیء سند (DOM)

  • لیست‌ها

  • جداول

  • فرم‌ها

  • تصاویر، فایل‌های صوتی و ویدئویی

  • لینک‌ها (اتصالات داخلی و خارجی)

  • جاسازی محتوای خارجی در وب‌سایت (مانند نقشه‌ها)

CSS:

  • قلم‌ها و خانواده‌های فونت

  • اندازه‌های فونت

  • رنگ‌ها (متن و پس‌زمینه، روش‌های مختلف تعریف رنگ)

  • اولویت انتخابگرها (Specificity)

  • متن‌های ایتالیک و ضخیم (Bold)

  • فرمت‌بندی متن (فاصله‌ها، ترازبندی، هایلایت؛ خطوط، کلمات و کاراکترها)

  • مباحث مربوط به خوانایی و برندینگ (شناخت برند و غیره)

  • طراحی واکنش‌گرا/Responsive Design (رویکرد Mobile First، تجربه کاربری UX/UI، کوئری‌های رسانه‌ای Media Queries، ویوپورت و فونت‌ها...)

#html #css #آموزش_برنامه_نویسی #برنامه_نویسی #کدنویسی #توسعه_وب #webdevelopment #ux #ui #mobilefirst #responsive_design #js #javascript #codepen #vscode #frontend #backend


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

درس‌ها Lessons

  • خوش آمدید! Willkommen!

  • نمای کلی HTML و CSS: اسکلت و آرایش برنامه شما Überblick zu HTML und CSS: Skelett und Make-up deiner Anwendung

  • CodePen: تمرین و آشنایی با پلتفرم CodePen: Übung und Einblick in die Plattform

  • فرانت-اند در مقابل بک-اند Frontend vs. Backend

  • اینترنت و شبکه جهانی وب Internet und World Wide Web

  • لایه‌های یک وب‌سایت HTML: ساختاردهی محتوا Die Ebenen einer HTML-Website: Inhalte strukturieren

  • المان‌ها، تگ‌ها، ویژگی‌ها و مقادیر: بلوک‌های سازنده HTML Elemente, Tags, Attribute und Werte: Die Grundbausteine von HTML

  • سلام دنیا! اولین برنامه شما (تمرین) Hello World! Dein erstes eigenes Programm (Übung)

  • VSCode: نصب VSCode: Installation

  • ذخیره خودکار در VSCode Automatisches Speichern in VSCode

  • ایجاد پروژه، ساختاردهی و تنظیمات VSCode Projekt erstellen, strukturieren und Einrichtung VSCode

  • ساختار سند HTML: بخش اول - Head Aufbau des HTML-Dokuments: I. Der Head

  • ساختار سند HTML: بخش دوم - Body Aufbau des HTML-Dokuments: II. Der Body

  • مدل شیء سند (DOM) Das DOM (Document Object Model)

  • جزئیات HTML: مقدمه بخش HTML im Detail: Intro zum Abschnitt

  • المان‌های Block level در مقابل Inline Block-level vs. Inline-Elemente

  • HTML و دسترس‌پذیری HTML und Barrierefreiheit

  • المان‌های متنی (بخش اول) Text-Elemente (Teil 1)

  • المان‌های متنی (بخش دوم) Text-Elemente (Teil 2)

  • المان‌های متنی (بخش سوم) Text-Elemente (Teil 3)

  • برجسته‌سازی متن (بخش اول) Textauszeichnung (Teil 1)

  • برجسته‌سازی متن (بخش دوم) Textauszeichnung (Teil 2)

  • لیست‌ها Listen

  • جداول Tabellen

  • فرم‌ها (بخش اول) Formulare (Teil 1)

  • فرم‌ها (بخش دوم) Formulare (Teil 2)

  • فرم‌ها (بخش سوم) Formulare (Teil 3)

  • رسانه‌ها (بخش اول) Medien (Teil 1)

  • رسانه‌ها (بخش دوم) Medien (Teil 2)

  • رسانه‌ها (بخش سوم) Medien (Teil 3)

  • رسانه‌ها (بخش چهارم) Medien (Teil 4)

  • CSS: قوانین، انتخابگرها، ویژگی‌ها و مقادیر: بلوک‌های سازنده CSS: Regeln, Selektoren, Eigenschaften und Werte: Die Grundbausteine

  • تعریف رنگ‌ها Farbangaben

  • اولویت انتخابگرها و بازنویسی مقادیر: تله‌های CSS Spezifität und Werte überschreiben: Ein Fallstrick in CSS

  • فونت‌ها: Serif، sans serif و monospace Schriftarten: Serif, sans-serif und monospace

  • اندازه فونت: نسبی و مطلق Schriftgrößen: Relativ und absolut

  • متن ایتالیک و ضخیم Kursiv- und Fettschreibung

  • رنگ‌ها: رنگ پس‌زمینه و رنگ متن Farben: Hintergrund- und Schriftfarben

  • ویژگی‌ها و فرمت‌بندی متن Text-Eigenschaften und -formatierungen

  • رویکرد Mobile First و UX/UI Mobile-First und UX/UI

  • Media Queries و Viewport Media Queries und Viewport

  • وب‌سایت شخصی شما! Deine eigene Website!

  • انتشار وب‌سایت Die Website veröffentlichen

  • نکات و ترفندها و خداحافظی Tipps & Tricks und Abschied

نمایش نظرات

آموزش HTML و CSS: دوره جامع و سریع. در چند ساعت به متخصص طراحی وب تبدیل شوید!
جزییات دوره
3h 46m
44
Skillshare (اسکیل شیر) Skillshare (اسکیل شیر)
(آخرین آپدیت)
7
- از 5
ندارد
دارد
دارد
Sinah
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Sinah Sinah

کدنویسی و هوش مصنوعی با سینا

خوش آمدید! :)

من سینا هستم، توسعه‌دهنده Full Stack وب. به زبان ساده: من عاشق برنامه‌نویسی مستقل هستم. همچنین سابقه فعالیت در بهینه‌سازی فرآیندها و مشاوره دیجیتال را دارم.
در دوره‌های من می‌توانید موضوعات متنوعی را بیاموزید: از برنامه‌نویسی تا هوش مصنوعی، چه برای اهداف شخصی و چه شغلی، از سطح مبتدی تا پیشرفته. ما با روشی تعاملی و بازی‌گونه به اهداف شما می‌رسیم؛ چه ساخت وب‌سایت، چه بازی‌های شخصی، طراحی ریسپانسیو یا Prompt Engineering حرفه‌ای.

#هوش_مصنوعی #پرامپت_انجینیرینگ #جاوااسکریپت #اتچ_تی_ام_ال #سی_اس_اس #برنامه_نویسی #کدنویسی #AI