آموزش جامع طراحی رابط کاربری واکنش‌گرا (Responsive UI) برای توسعه مدرن وب - آخرین آپدیت

مقدمه‌ای بر طراحی وب واکنش‌گرا Introduction to Responsive Web Design

• معرفی دوره Introduction to the Course

• آشنایی با مدرس Meet your Instructor

• مبانی طراحی واکنش‌گرا Fundamentals of Responsive Design

• طراحی واکنش‌گرا چیست؟ What is Responsive Design?

• مزایای طراحی واکنش‌گرا Benefits of Responsive Design

• مفاهیم کلیدی و اصطلاحات Key Concepts and Terminology

• مبانی HTML و CSS Basics of HTML and CSS

• مقدمه‌ای بر HTML Introduction to HTML

• مقدمه‌ای بر CSS Introduction to CSS

• ساختاردهی به یک صفحه وب ساده Structuring a Basic Web Page

• تکنیک‌های چیدمان واکنش‌گرا Responsive Layout Techniques

• استفاده از Flexbox برای چیدمان Using Flexbox for Layouts

• استفاده از CSS Grid برای چیدمان‌های پیشرفته CSS Grid for Advanced Layouts

• Media Queries و Breakpoints Media Queries and Breakpoints

تکنیک‌های پیشرفته طراحی واکنش‌گرا Advanced Responsive Design Techniques

• طراحی اول-موبایل: نمای کلی Mobile-First Design : Overview

• طراحی اول-موبایل چیست؟ What is Mobile-First Design?

• پیاده‌سازی طراحی اول-موبایل Implementing Mobile-First Design

• اشتباهات رایج و نحوه اجتناب از آن‌ها Common Pitfalls and How to Avoid Them

• تایپوگرافی و تصاویر واکنش‌گرا Responsive Typography and Images

• تایپوگرافی مقیاس‌پذیر Scalable Typography

• تصاویر واکنش‌گرا با srcset Responsive Images with srcset

• بهینه‌سازی تصاویر برای عملکرد بهتر Optimizing Images for Performance

• ساخت رابط‌های کاربری قابل دسترس (Accessible UI) Building Accessible UIs

• اهمیت قابلیت دسترسی (Accessibility) Importance of Accessibility

• نقش‌ها و ویژگی‌های ARIA ARIA Roles and Attributes

• تست قابلیت دسترسی Testing for Accessibility

فریم‌ورک‌ها و کتابخانه‌های طراحی واکنش‌گرا Frameworks and Libraries for Responsive Design

• نمای کلی از مبانی Bootstrap Overview of Bootstrap Basics

• مقدمه‌ای بر Bootstrap Introduction to Bootstrap

• استفاده از سیستم گرید Bootstrap Using Bootstrap Grid System

• اجزای (Components) و ابزارهای Bootstrap Bootstrap Components and Utilities

• نمای کلی از تکنیک‌های پیشرفته Bootstrap Overview of Advanced Bootstrap Techniques

• ساخت ناوبری (Navigation) واکنش‌گرا Building Responsive Navigation

• فرم‌ها و جداول واکنش‌گرا Responsive Forms and Tables

• استفاده از Tailwind CSS برای توسعه سریع Tailwind CSS for Rapid Development

• مقدمه‌ای بر Tailwind CSS Introduction to Tailwind CSS

• مقایسه Bootstrap و Tailwind Bootstrap vs Tailwind

• پایان دوره - با سپاس از شما! Course Closure - Gratitude !