طراحی واکنشگرا (ریسپانسیو) وب Responsive Web Design – RWD
طراحی واکنشگرا (ریسپانسیو) وب یا Responsive Web Design چیست؟
طراحی واکنشگرا یا ریسپانسیو وب (به اختصار RWD) رویکردی در طراحی وب میباشد که در آن صفحات وب به گونهای طراحی میشود که روی دستگاههای مختلف (اعم از رایانههای رومیزی و گوشیهای همراه) دارای ظاهری مناسب و کارآمد باشد.
در طراحی ریسپانسیو، طراح با بهرهگیری از روشهای مختلف سعی میکند متون، تصاویر، ویدیوها و سایر المانهای موجود در صفحات وب را به شکلی در کنار یکدیگر قرار دهد که دارای چینش و ظاهری متناسب با صفحه نمایش کاربر باشد.
به عنوان مثال، اگر کاربر تصویر بزرگی که در مرورگر یک صفحه نمایش رومیزی نمایش داده میشود را با همان اندازه در یک گوشی هوشمند 4 اینچی مشاهده کند مجبور خواهد شد برای تماشای تصویر، صفحه را اسکرول و یا کوچکتر کند. اما در طراحی ریسپانسیو (واکنشگرا) اندازهی تصویر متناسب با صفحهی گوشی تغییر میکند.
پیش از ظهور دستگاههای همراه، صفحات وب تنها براساس نمایشگرهای رایانهها طراحی میشدند اما با گسترش کاربرد تبلتها و گوشیهای هوشمند نیاز به نمایش مناسب محتوای وبسایتها روی دستگاههایی با نمایشگرهای کوچک و بزرگ از اهمیت بالاتری برخوردار شد.
در ابتدا برای حل مشکل نمایش محتوا روی دستگاههای همراه، مرورگر این دستگاهها کل محتوای یک صفحه وب را با مقیاس کوچکتر نمایش میدادند. این روش با اینکه مشکل را تا حدودی برطرف میکرد اما از کارایی مناسبی برخوردار نبود.
امروزه معمولا از CSS برای تغییر اندازه و محل قرارگیری محتوا استفاده میشود. به این منظور برای تعیین اندازهی متون و سایر المانها از واحدهای نسبی نظیر درصد به جای واحدهای ثابتی مثل پیکسل استفاده میشود. همچنین از Media query ها برای کنترل ظاهر المانها براساس مشخصات صفحهی نمایش کاربر و تعیین استایل صفحه برای چاپ استفاده میشود.
