فلش‌کارت‌های آموزشی CSS for Government Websites

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

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

عنوان دوره: دوره CSS for Government Websites

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

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

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

• 1. مبانی CSS و ساختار سند
• 2. نمایش RTL و پشتیبانی از زبان‌های راست‌به‌چپ
• 3. استفاده از متغیرهای CSS (Custom Properties) برای تم‌سازی
• 4. سیستم طراحی یکپارچه برای سایت‌های دولتی
• 5. طراحی ریسپانسیو با Media Queries و Container Queries
• 6. استفاده از Flexbox برای چیدمان‌های انعطاف‌پذیر
• 7. استفاده از Grid برای شبکه‌های پیچیده
• 8. تایپوگرافی رسمی: فونت‌های فارسی، اندازه‌ها و فاصله‌گذاری
• 9. رنگ‌بندی مطابق استانداردهای دسترسی (WCAG AA/AAA)
• 10. کنتراست رنگ و تست‌های دسترسی بصری
• 11. استفاده از prefers-color-scheme برای حالت تاریک/روشن
• 12. استفاده از prefers-reduced-motion برای کاهش انیمیشن
• 13. انیمیشن‌های امن و کم‌مصرف برای تجربه کاربری بهتر
• 14. استفاده از CSS Logical Properties برای پشتیبانی چندزبانه
• 15. استایل‌دهی فرم‌های ورودی: اعتبارسنجی بصری، پیام‌های خطا
• 16. دکمه‌ها و کنترل‌های تعاملی با تمرکز بر دسترسی
• 17. جدول‌های داده: استایل‌دهی، اسکرول افقی، قابلیت کپی
• 18. فهرست‌ها و منوهای ناوبری رسمی (Mega Menu، Breadcrumb)
• 19. کامپوننت‌های UI قابل Wieder استفاده: کارت، مودال، توست، تاپ‌بار
• 20. استفاده از CSS Modules / Scoped CSS برای ماژولاریت
• 21. مدیریت استایل‌ها در CMS‌های دولتی (WordPress، Drupal، Joomla)
• 22. استفاده از PostCSS، Autoprefixer و بهینه‌سازی خروجی
• 23. Minification، Critical CSS و استراتژی‌های بارگذاری
• 24. Cache Busting و نسخه‌بندی فایل‌های استایل
• 25. استفاده از Content Security Policy (CSP) برای استایل‌های ایمن
• 26. جلوگیری از CSS Injection و حملات XSS از طریق استایل
• 27. تست واحد (Unit Test) برای CSS با ابزارهایی مثل Stylelint
• 28. تست بصری (Visual Regression) با BackstopJS یا Percy
• 29. لینتینگ و استانداردهای کدنویسی (Stylelint، Prettier)
• 30. مستندسازی استایل‌گاید با Storybook یا Fractal
• 31. نسخه‌بندی و مدیریت تغییرات استایل (Semantic Versioning)
• 32. استفاده از Design Tokens برای یکپارچگی برند
• 33. پشتیبانی از چاپ (Print CSS) برای گزارش‌های رسمی
• 34. استایل‌دهی به PDF تولیدشده از HTML
• 35. دسترسی‌پذیری برای قارئ‌های صفحه (Screen Readers) با ARIA و CSS
• 36. Focus Management و ترتیب تب (Tab Order) با CSS
• 37. Skip Links و ناوبری با کیبورد
• 38. استفاده از prefers-contrast برای کاربران با نیاز به کنتراست بالا
• 39. Internationalization (i18n) و Localization (l10n) در CSS
• 40. مدیریت فونت‌های وب: WOFF2، Font Display، Subsetting
• 41. بهینه‌سازی فونت برای سرعت بارگذاری (preload، font-display)
• 42. استفاده از SVG و آیکون‌های سیستم‌فکتوری در CSS
• 43. Responsive Images با CSS (object-fit، srcset در background)
• 44. CSS Grid Layout برای داشبوردهای اداری پیچیده
• 45. Flexbox Fallback برای مرورگرهای قدیمی
• 46. Feature Queries (@supports) برای تدریج پیشرفت
• 47. CSS Houdini و Paint API برای افکت‌های پیشرفته (اختیاری)
• 48. استفاده از CSS Custom Highlight API برای جستجوی متنی
• 49. طراحی برای محیط‌های محدود پهنای باند (Low Bandwidth)
• 50. استفاده از CSS Containment برای عملکرد بهتر
• 51. Accessibility Audit با axe-core و لایه‌های CSS
• 52. استفاده از Design System Tokens در Figma و انتقال به کد
• 53. همگام‌سازی استایل‌ها بین فرانت‌اند و بک‌اند (Design Tokens JSON)
• 54. مدیریت Theme Switching در زمان اجرا (Runtime Theming)
• 55. استفاده از CSS Variables برای برندینگ چندسازمانی
• 56. تست عملکرد (Performance) با Lighthouse و Web Vitals
• 57. استفاده از Critical Path CSS برای First Contentful Paint
• 58. استراتژی‌های Progressive Enhancement در CSS
• 59. مدیریت Technical Debt در استایل‌های قدیمی
• 60. آموزش و انتقال دانش به تیم‌های توسعه داخلی
• 61. بررسی موارد قانونی و استانداردهای ملی (مثل استاندارد ۱۶۸۳۰)
• 62. استفاده از CSS برای امضای دیجیتال و نمادهای رسمی
• 63. استایل‌دهی به کامپوننت‌های Accessible Rich Internet Applications (ARIA)
• 64. بهینه‌سازی برای موبایل-first و Desktop-first
• 65. استفاده از CSS Grid برای Layout‌های Print-friendly
• 66. استفاده از CSS Logical Properties برای margin/padding در RTL/LTR
• 67. استفاده از @layer برای مدیریت اولویت لایه‌های استایل
• 68. استفاده از CSS Nesting (native) برای خوانایی بهتر
• 69. استفاده از Container Queries برای کامپوننت‌های خودمختار
• 70. استفاده از CSS Scroll Snap برای اسلایدرهای رسمی
• 71. استفاده از CSS Masking و Clipping برای برندینگ بصری
• 72. استفاده از CSS Variables در JavaScript برای تعامل داینامیک
• 73. استفاده از CSS Custom Properties برای مدیریت spacing system
• 74. استفاده از CSS Functions (calc, min, max, clamp) برای مقیاس‌پذیری