سلام, من سید مصطفی موسوی هستم

عکاس، گرافیست و طراح رابط کاربری

طراحی واکنش گرا (ریسپانسیو) چیست ؟

طراحی واکنش گرا یا ریسپانسیو چیست !؟

 

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

 

 

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

 

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

 

آن سالها اهمیت چندانی هم نداشت زیرا وب گردی با موبایل فراگیر نشده بود و همان عده محدود به زوم کردن و سختی کشیدن در وب گردی با موبایل عادت کرده بودند! اما با رونق گرفتن بازار گوشی های هوشمند و پیشرفت صعودی وب گردان موبایل نیاز به روشی سبک تر، اصولی تر و در عین حال کم هزینه تر احساس شد، دیری نگذشت که CSS مانند همیشه خود را با تکنولوژی وفق داد و طراحی ریسپانسیو را ارائه داد، روشی که صرفا توسط HTML و CSS انجام می شود و هیچ نیازی به برنامه یا اسکریپتی خاص ندارد.

 

با استفاده از طراحی ریسپانسیو دیگر نیازی به استفاده از قالب های نسخه موبایل یا زوم کردن و… نیست، کاربران نسبت به صفحه نمایشی که در اختیار دارند و با آن وب گردی میکنند وب سایت شما را مشاهده میکنند، شما نه تنها با استفاده از یک قالب ریسپانسیو به کاربران خود اهمیت می دهید بلکه توسط الگوریتم گوگل با نام Mobile Friendly (مناسب موبایل) رتبه بهتری نسبت به وبسایت های غیر ریسپانسیو خواهید داشت، الگوریتم مناسب موبایل از نظر گوگل از اهمیت بالایی برخوردار است و امروزه چنانچه قصد اداره کردن یک وب سایت موفق با رتبه بالا را داشته باشید دیگر ریسپانسیو یک گزینه اختیاری نیست، شما ناچار به استفاده از طراحی ریسپانسیو هستید.

 

 

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

 

 

آیا تنها راه حل برای Mobile friendly کردن قالب ریسپانسیو است؟

 

پاسخ این سوال خیر است، به صورت کلی دو روش برای کسب شاخص GMF یا مناسب موبایل کردن قالب ها وجود دارد، اولین روش Responsive Design که در این مقاله آن را شرح دادیم و روش دیگر Adaptive Design که آن را انطباق پذیر نیز می گویند، تفاوت این دو روش در آن است که در روش Responsive وب سایت شما به تمامی سایز های صفحات واکنش نشان می دهد و مقادیر معمولا به صورت درصد می باشند اما در روش Adaptive وب سایت صرفا در چند سایز از پیش تعیین شده طراحی شده است و ممکن است در سایز های خارج از چارچوبی که تعریف شده به درستی نمایش داده نشود، مقایسه این دو کار صحیحی نیست زیرا هرکدام دارای مزیت ها و ضعف های خاصی هستند و یک طراح خوب میتواند از هر دو روش در کنار هم بهره ببرد، تصویر زیر شاید درک تفاوت این دو روش را برای شما ساده تر کند:

 

 

کلام پایانی

 

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

 

چنانچه قصد استفاده از قالب های آماده دارید دمو های آنلاین و بررسی آنها در موبایل یا ری سایز کردن پنجره مرورگر جهت بررسی ریسپانسیو بودن را فراموش نکنید و چنانچه قصد سفارش قالب اختصاصی دارید پیش از سفارش حتما با طراح خود در این رابطه به توافق رسیده و نمونه کار های ریسپانسیو ایشان را بررسی کنید.

 

روزگار به کامتان

آی مصطفی

نوشته شده در: مقالات, وبلاگ
< مطلب بعدی مطلب قبلی >