دوره CSS for Service Design همراه با فلش‌کارت آموزشی — ارائه روی فلش مموری

🎓 دوره آموزشی جامع

📚 اطلاعات دوره

عنوان دوره: دوره CSS for Service Design

موضوع کلی: برنامه نویسی

موضوع میانی: CSS

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

• 1. مبانی CSS و اهمیت آن در طراحی سرویس
• 2. مقدمه ای بر CSS و نقش آن در وب
• 3. تاریخچه و تکامل CSS
• 4. ساختار و نحو CSS
• 5. انتخابگرها (Selectors) در CSS: انواع و کاربردها
• 6. کاسکید (Cascading) در CSS: اولویت و ترتیب اعمال استایل
• 7. ارث بری (Inheritance) در CSS
• 8. واحدها در CSS: px, em, rem, %, vh, vw
• 9. کار با رنگ ها در CSS: انواع فرمت ها (hex, rgb, rgba, hsl, hsla)
• 10. متن و فونت در CSS: font-family, font-size, font-weight, font-style
• 11. تراز بندی متن و فاصله گذاری: text-align, letter-spacing, word-spacing, line-height
• 12. کار با Background در CSS: color, image, repeat, position, size
• 13. مدل جعبه (Box Model) در CSS: Margin, Border, Padding, Content
• 14. اندازه و ابعاد در CSS: width, height, max-width, min-width
• 15. شناخت Block و Inline Elements
• 16. Display Properties: block, inline, inline-block, flex, grid, none
• 17. شناخت Position Properties: static, relative, absolute, fixed, sticky
• 18. شناخت Z-index و کاربرد آن در لایه بندی
• 19. شناخت Float و کاربرد آن در چیدمان
• 20. Clear و کاربرد آن در پاکسازی Float
• 21. مقدمه ای بر Flexbox: مفاهیم و مزایا
• 22. Flexbox: تنظیمات Container (flex-direction, flex-wrap, justify-content, align-items, align-content)
• 23. Flexbox: تنظیمات Item (flex-grow, flex-shrink, flex-basis, order, align-self)
• 24. مقدمه ای بر Grid: مفاهیم و مزایا
• 25. Grid: تنظیمات Container (grid-template-columns, grid-template-rows, grid-template-areas, grid-gap)
• 26. Grid: تنظیمات Item (grid-column, grid-row, grid-area)
• 27. انیمیشن ها و ترنزیشن ها در CSS: مقدمه و کاربردها
• 28. ترنزیشن ها (Transitions) در CSS: تنظیمات و استفاده
• 29. انیمیشن ها (Animations) در CSS: تنظیمات و استفاده
• 30. CSS Variables (Custom Properties): تعریف و استفاده
• 31. Responsive Design: مفهوم و اهمیت
• 32. Media Queries: استفاده از آنها برای طراحی واکنش گرا
• 33. Mobile-First Approach: طراحی برای موبایل و سپس دسکتاپ
• 34. ساختارهای Responsive Images
• 35. استفاده از viewport meta tag
• 36. CSS Preprocessors: معرفی و مقایسه (Sass, Less, Stylus)
• 37. Sass: نصب و تنظیمات اولیه
• 38. Sass: متغیرها (Variables) و توابع (Functions)
• 39. Sass: Mixins و Extend
• 40. Sass: Import و Partials
• 41. CSS Frameworks: معرفی و مقایسه (Bootstrap, Tailwind CSS, Materialize)
• 42. Bootstrap: نصب و استفاده
• 43. Bootstrap: Grid System
• 44. Bootstrap: Components (Buttons, Forms, Navbars, etc.)
• 45. Tailwind CSS: نصب و استفاده
• 46. Tailwind CSS: Utility Classes و Customization
• 47. Materialize: نصب و استفاده
• 48. Materialize: Components و Grid System
• 49. طراحی تعاملی و رابط کاربری با CSS
• 50. شناخت و طراحی فرم ها با CSS
• 51. اعتبارسنجی فرم ها با CSS
• 52. افکت های Hover و فعال (Active)
• 53. ایجاد منوهای ناوبری با CSS
• 54. ایجاد کارد (Cards) با CSS
• 55. طراحی جداول با CSS
• 56. طراحی وب سایت های تک صفحه ای (Single-Page Websites)
• 57. طراحی UI/UX با استفاده از CSS
• 58. CSS و دسترسی پذیری (Accessibility)
• 59. استفاده از CSS برای بهینه سازی سرعت وب سایت
• 60. CSS و SEO (Search Engine Optimization)
• 61. بهینه سازی CSS برای مرورگرهای مختلف
• 62. Cross-Browser Compatibility
• 63. CSS and JavaScript: تعامل و ارتباط
• 64. DOM manipulation با استفاده از CSS و JavaScript
• 65. انتخابگرهای CSS در جاوا اسکریپت
• 66. استفاده از کتابخانه های انیمیشن CSS (Animate.css, etc.)
• 67. طراحی سیستم های طراحی (Design Systems) با CSS
• 68. مدیریت و سازماندهی کدهای CSS
• 69. استفاده از BEM (Block, Element, Modifier)
• 70. Code Style Guide برای CSS
• 71. CSS Linter و Code Formatting
• 72. تست کدهای CSS
• 73. CSS in Service Design: کاربردها و اهداف
• 74. شناخت نیازهای کاربران در طراحی سرویس
• 75. استفاده از CSS برای ایجاد تجربه کاربری مطلوب
• 76. طراحی رابط کاربری (UI) مناسب برای سرویس
• 77. ایجاد یکپارچگی بصری در طراحی سرویس
• 78. طراحی تعاملی و واکنش گرا برای سرویس
• 79. استفاده از CSS برای نشان دادن وضعیت های مختلف سرویس
• 80. استفاده از CSS برای راهنمایی کاربران در استفاده از سرویس
• 81. استفاده از CSS برای ایجاد حس اعتماد و اطمینان
• 82. طراحی فرم های تعاملی و جذاب برای سرویس
• 83. ایجاد انیمیشن ها و جلوه های بصری برای بهبود تجربه کاربری
• 84. طراحی اجزای رابط کاربری قابل استفاده مجدد
• 85. ایجاد سیستم های طراحی برای سرویس های بزرگ
• 86. مدیریت و نگهداری کدهای CSS در پروژه های طراحی سرویس
• 87. CSS و استانداردهای طراحی سرویس
• 88. بهترین شیوه ها (Best Practices) در CSS برای طراحی سرویس
• 89. رابطه CSS و سایر ابزارهای طراحی سرویس
• 90. CSS و prototyping
• 91. CSS و user testing
• 92. مستندسازی کدهای CSS
• 93. آینده CSS و طراحی سرویس
• 94. چالش ها و فرصت های پیش رو در CSS و طراحی سرویس
• 95. مدل باکس در CSS: حاشیه، پدینگ، مرز و محتوا
• 96. Flexbox برای طراحی چیدمان‌های انعطاف‌پذیر
• 97. CSS Grid برای ساختاردهی چیدمان‌های پیچیده
• 98. طراحی واکنش‌گرا (Responsive Design) با Media Queries
• 99. شبه‌کلاس‌ها (Pseudo-classes) و شبه‌عناصر (Pseudo-elements) برای تعاملات کاربر
• 100. متغیرهای CSS (Custom Properties) و نقش آن‌ها در سیستم‌های طراحی