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

طراحی واکنش گرا در مقایسه با طراحی adaptive

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

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

برای طراحی رسپانسیو باید به نکات زیر توجه نمود:

استفاده از سیستم گرید های شناور:اندازه ها در وب سایتی که در چنین سیستمی پیاده سازی می شود بر اساس درصد خواهد بود نه پیکسل. که به راحتی در دستگاههای مختلف اندازه ها تنظیم شوند.

استفاده از عکس ها و ویدئوهای رسپانسیو:

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

استفاده از media query ها :

 مدیا کوئری ها به CSS این امکان را می دهند که تنها زمانی اعمال شود که شرایط خاصی وجود داشته باشد. به عنوان مثال خط زیر:

برای مشخص نمودن استایل مشخص برای دستگاههایی است که حداکثر عرض آنها تا 600 پیکسل می باشد.  به همین ترتیب می توان دستگاههای مختلف را با مدیا کوئری کنترل نمود.

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

طراحی navigation  رسپانسیو:

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

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