طراحی سایت رسپانسیو چیست؟
سوالی که شاید ذهن خیلی از شما عیزان را حین مشاوره با شرکت های طراحی سایت درگیر میکند این است که طراحی سایت رسپانسیو چیست؟
درواقع رسپانسیو در پارسی به معنای واکنشگرا است، این یک لغت فنی است و در زمینهی طراحی وب دقیقترین معنی آن، واکنشگرا میباشد.
به هرحال همین اندازه کافی است که بدانید معنای واکشنگرا را میدهد تا بیشتر برای شما توضیح بدهیم.
از زمانی که گوشی های موبایل رو به توسعهی هوشمند رفتند و مرورگر ها در آن ها ارتقا پیدا کرد، تقریبا میتوان گفت طراحی وبسایت واکنشگرا معنا پیدا کرد.
گوگل که خود توسعهدهندهی سیستم عامل اندروید است این قابلیت را در مرورگر های خود گنجاند تا کاربران موبایل بتوانند وب سایت هایی که دارای فایل های CSS و JavaScript پیشرفته تر است را کاوش کنند.
از این رو صاحبین وب سایت (وبمسترها) را ملزم به واکنشگرا کردن وبسایت هایشان نمود.
امروز از دید گوگل وب سایتی که حالت واکنشگرا نداشته باشد هیچ امتیاز و هیچ شانسی برای دریافت رتبه خوب ندارد.
قبل از باز کردن مطلب بگوییم که علاوه بر حالت واکنشگرا که وب سایت شمارا در همه ی ابعاد تصویر به خوبی نمایش میدهد ، گوگل حالت Mobile Friendly نیز برایش مهم است.
درواقع اگر وب سایت شما واکنشگرا به تمام ابعاد تصویر باشد ، بایستی با موبایل بهترین نمایش و واکنش را داشته باشد و در اصل می توان گفت باید برای موبایل یک طرح اختصاصی داشته باشید!
این قضیه کمی کار طراحان را در یک برهه زمانی دشوار کرده بود.
واکنشگرا (رسپانسیو) چیست؟
فرض کنید وب سایتی که امروز طراحی کرده اید، در عرض 1200 پیکسل است و در نمایشگر (مانیتور) شما به خوبی نمایش داده میشود و همه چیز استاندارد و طبق طرح اولیه است.
اگر این وب سایت در یک مانیتور کوچک تر از مانیتور شما باز شود چه اتفاقی خواهد افتاد؟
اگر در یک مانتیور بزرگ تر (مثل آی مک اپل) باز شود چطور؟
وب سایتتان را در موبایل هم باز کرده اید ؟
خب خبر بد این است که هر روز دستگاه های هوشمند با ابعاد و Resolution های مختلفی به بازار عرضه میشود و شما نمیتوانید برای هر از این ها یک طراحی و کد نویسی انجام دهید.
پس باید طراحی خود را به گونه ای انجام دهید تا با یک بار انجام آن، در تمامی نسخه ها و ابعاد نمایشگر ها و موبایل به خوبی نمایش داده شود.
برای این کار کافی است کمی CSS بیشتر بلد باشید و تگ هایی که در نسخه جدید css برای رسپانسیو بوجود آمده آشنا شوید.
همچنین می توانید از چارچوب های طراحی (Freamworks) استفاده کنید.
یکی از این چارچوب ها که مختص زبان CSS است، بوت استرپ (BootStrap) میباشد.
اگر استایل های وب سایت خود را با بوت استرپ تنظیم کنید دیگر نیازی به طراحی و کد نویسی برای هر رزولوشن نخواهید داشت.
مزایای طراحی سایت رسپانسیو
طبق گفته های بالا، اگر وب سایت شما واکنشگرا نباشد قطعا در گوگل نیز امتیازی نخواهد گرفت ودر صفحات اول دیده نخواهید شد.
حالا اگر وب سایت رسپانسیو داشته باشید چه اتفاقی خواهد افتاد؟
- در موبایل بهترین نمایش را دارید
- کاربر به آسانی با وب سایت کار میکند
- عکس ها و مقالات در حالت استاندارد در هر رزولوشن نمایش داده می شوند
- ازنظر گوگل شما به وب سایت خود اهمیت زیادی داده اید و این یک امتیاز مثبت است
- در رزولوشن های بزرگ سایت شما فضای خالی نخواهد داشت (پرتی)
- در نسخه های موبایل و تبلت می توان از منو و بخش های متفاوت نیز استفاده کرد
قطعا موارد بیشتری در این میان هست که با انجام طراحی رسپانسیو آن هارا خواهید دید.