به احتمال بسیار زیاد برای شما هم پیش آمده که یک وب سایت را بر روی گوشی موبایل یا تب لت خود مشاهده کرده باشید. در این حال، اصلا دوست ندارید که برای دیدن محتوای سایت، یکسره اسکرول افقی را به حرکت درآورید و یا اینکه چیدمان عناصر صفحه را به همریخته مشاهده کنید.
تا چندی پیش برای نمایش یک وب سایت در موبایل، طراحی و برنامه نویسی مجزا تحت عنوان Mobile version یا سایت موبایل محور انجام می‌شد. در این نوع طراحی، سرور با توجه به شناسه مرورگر کاربر، تشخیص می داد که کاربر، سایت را با موبایل بازدید می کند در این حالت محتوای موبایل را در همان آدرس به او نشان می‌داد یا او را به URL مخصوص موبایل هدایت می نمود.
با طراحی سایت واکنش گرا (ریسپانسیو : Responsive ) دیگر نیازی نیست که برای هر گجت موجود در بازار یک سایت اختصاصی طراحی کرد.
در طراحی سایت واکنش گرا که به Responsive Web Design مشهور است، ساختار لایه‌های سایت به صورت شناور طراحی می‌شود که باعث تنظیم عرض صفحه، سایز متن و … در ابعاد مختلف می شود که این کار به صورت کاملاً خودکار انجام می‌شود و کاربران می توانند با خیال راحت با هر دستگاه دلخواهی از جمله گوشی های ویندوزی، اندرویدی، آیفون، تب لت و لپ تاپ و دسکتاپ با سایزهای مختلف و غیره ک سایت واحد را مشاهده نمایند.
در واقع سایت واکنش گرا برای واکنش سایت نسبت به تغییر دستگاه های مختلف مانند تبلت، موبایل، لپ تاپ، تلویزیون های هوشمند و همچنین تغییر رزولوشن ها مورد استفاده قرار می گیرد.
با توجه به این امکان بی نظیر کاربر تعامل بهتری با سایت برقرار کرده و این تکنیک تاثیر مثبت و جذب بیشتری روی کاربر خواهد داشت.
بعنوان یک مثال عینی، در بخش زیر صفحه ای از یک وب سایت از طریق سه دستگاه مختلف گوشی هوشمند، تب لت و لپ تاپ با اندازه های مختلف به نمایش درآمده است.
یک تکنیک جالب برای تست اینکه آیا یک وب سایت، ریسپانسیو یا واکنش گرا هست یا نه :
کافی است اندازه مرورگر خودرا تغییر دهید و ببینید آیا عناصر سایت شامل تصاویر و نوشته ها، شروع به جابجایی می کنند یا خیر؟ اگر جابجا شده و خودرا تطبیق دادند یعنی اینکه آن وب سایت، واکنش گراست.
