طراحی واکنش‌گرا (Responsive Design)
Responsive Design
تعریف کوتاه
روش طراحی وب که صفحه، خودش را با اندازه نمایشگر موبایل، تبلت و دسکتاپ هماهنگ می‌کند.
بیش از نیمی از بازدیدهای وب ایران از موبایل است و گوگل هم نسخه موبایل را ملاک رتبه‌بندی می‌کند؛ پس طراحی واکنش‌گرا اختیاری نیست. ابزار اصلی، CSS است: Media Query برای نقاط شکست، واحدهای نسبی به‌جای پیکسل ثابت، و چیدمان‌های Flex و Grid که خودشان جابه‌جا می‌شوند.
روش تمرین مدرن، mobile-first است: اول برای صفحه کوچک طراحی کنید و سپس به سمت صفحات بزرگ پیش بروید؛ این ترتیب هم ذهن شما را منظم می‌کند و هم کیفیت موبایل را قربانی دسکتاپ نمی‌کند. همیشه با حالت دستگاهِ مرورگر، خروجی را روی عرض‌های مختلف ببینید؛ طراحی واکنش‌گرا یعنی احترام به کاربرِ موبایل.
واژه‌های مرتبط
سی‌اس‌اس (CSS)
زبان استایل‌دهی وب که ظاهر، چیدمان و واکنش‌گرایی صفحه‌های HTML را تعیین می‌کند.
فرانت‌اند (Frontend)
بخش قابل‌مشاهده یک وب‌اپلیکیشن؛ هر چیزی که کاربر می‌بیند و با آن تعامل می‌کند.
مسیر یادگیری فرانت‌اند
نقشه گام‌به‌گام تبدیل‌شدن به توسعه‌دهنده فرانت‌اند؛ از HTML و CSS تا فریم‌ورک‌های مدرن.