طراحی واکنش گرا

از آنجا که امروزه فناوری به یک بخش ضروری از زندگی روزمره تبدیل شده است در نتیجه می بایست طیف گسترده ای از دستگاه هایی که کاربران به واسطه آنها قادر به دسترسی به اینترنت هستند را در نظر گرفت. زیرا انعطاف پذیری، کلید موفقیت در کسب و کار ،به خصوص، کسب و کار آنلاین است.

امروزه کاربران از بیشمار نمایشگر در ابعاد بزرگ و کوچک برای دستیابی به صفحات اینترنت استفاده میکنند.

تا چندی پیش برای نمایش یک وب سایت در موبایل، طراحی و برنامه نویسی مجزا تحت عنوان Mobile version یا سایت موبایل محور انجام می‌شد. در این نوع طراحی، سرور با توجه به شناسه مرورگر کاربر تشخیص می داد که کاربر سایت را با موبایل بازدید می کند در این حالت محتوای موبایل را در همان آدرس به او نشان می‌داد یا او را به URL مخصوص موبایل هدایت می نمود.

در طراحی سایت واکنش گرا که  Responsive Web Design  مشهور است، ساختار لایه‌های سایت به صورت شناور طراحی می‌شود که باعث تنظیم عرض صفحه، سایز متن و ... در ابعاد مختلف می شود که این کار به صورت کاملا خودکار انجام می‌شود .

سایت واکنش گرا برای واکنش سایت نسبت به تغییر دستگاه های مختلف مانند تبلت، موبایل، لپ تاپ، تلویزیون های هوشمند و همچنین تغییر رزولوشن ها مورد استفاده قرار می گیرد .

یک شرکت پیشرو و موفق بایستی اطلاعات کسب و کار خود را به بهترین نحو ارایه ونسبت به تغییر دستگاه کاربران واکنش مناسب دهد .

با توجه به این امکان بی نظیر کاربر تعامل بهتری با سایت برقرار کرده و این تکنیک تاثیر مثبت و جذب بیشتری روی کاربر خواهد داشت .

مجموعه رادکام، همانند گذشته همگام با توسعه و پیشرفت تکنولوژی در راستای طراحی وب واکنش گرا از سال ها پیش قدم برداشته است و حضور پر رنگ وب سایت های بنام و واکنش گرای طراحی شده توسط این مجموعه در عرصه وب مثال زدنیست.

در راستای بهره گیری از طراحی واکنش گرا تیم UI این مجموعه فریم ورک Bootstrap را پس از بررسی های بسیار و با در نظر گرفتن فاکتورهای بسیار زیاد که در زیر به چند مورد آن اشاره می کنیم انتخاب نموده است:

1- قابلیت شخصی سازی تم گرافیکی

2- ثبات

3- سیستم Grid قدرتمند

4- واکنشگرایی

5- منبع باز

6- پشتیبانی

7- استفاده بسیاری از غول های تکنولوژی دنیا و ابر وب سایت ها از آن

8- و بسیاری دلایل ریز فنی دیگر ....

استفاده از این فریم ورک بسیار قانونمند، امکان طراحی واکنشگرا در چهاردسته زیر را ایجاد می نماید:

1- طراحی به صورت Container

در این نوع طراحی  محتوای سایت در مرکز صفحه مرورگر قرار می گیرد و با تغییر در اندازه مانیتورها تغییری در نسبت عناصر صورت نمی گیرد و تنها در Break Point ها (ابعادی که تعیین کننده نوع وسیله از قبیل تبلت و موبایل هستند) تغییر اتفاق می افتد.

مشاهده شبیه ساز طراحی به صورت Container

2- طراحی به صورت Wide

در این نوع طراحی از تمامی عرض صفحه مرورگر برای طراحی وب سایت استفاده می شود. لذا تمامی عناصر به صورت درصدی از نمایشگر کاربر در نظر گرفته می شود که با کوچک یا بزرگ شدن نمایشگرهای مختلف اندازه عناصر تغییر می یابد.

مشاهده شبیه ساز طراحی به صورت Wide

3- طراحی به صورت ترکیبی

در این نوع طراحی ترکیبی از موارد 1 و 2 اعمال می شود که پر واضح است که هر دو ویژگی بخش های یک ودو را با هم دارد و جلوه بصری بالایی نیز دارد.

مشاهده شبیه ساز طراحی به صورت ترکیبی

4- طراحی به صورت Offset

در این نوع طراحی اساس طراحی همان طراحی Wide می باشد به این معنی که عناصر به صورت درصدی از مرورگر کاربر نمایش داده می شود با این تفاوت که در این طراحی تمامی عرض مرورگر مورد استفاده قرار نمی گیرد وکاربر از سمت راست و چپ می تواند حاشیه هایی را برای نمایش بهتر سایت در نظر بگیرد.

مشاهده شبیه ساز طراحی به صورت Offset