خانه وبلاگ آموزشی
مطالب بر اساس تگ‌ها
مطالب برگزیده
همه چیز درباره متای توضیحات سایت
متای توضیحات یا همان Meta Description یکی از مهمترین عوامل در بالابردن رنکینگ سایت‌ها و SEO نمودن آن‌ها می‌باشد. متای توضیحات قسمتی از کدهای HTML است که توضیحی در خصوص محتوای صفحه وب سایت ارایه می‌دهد. این توضی...
اطلاعات بیشتر
نرم افزار CRM نخرید!
اگر قصد خرید نرم‌افزار CRM را دارید دست نگهدارید. آمار نشان می‌دهد درصد بالایی از شرکت‌ها پس از خرید نرم‌افزار CRM دچار بحران در لایه‌های مختلف سازمان خود می‌شوند.
اطلاعات بیشتر
14
اسفند
1393
لاله قنبری
لاله قنبری
طراحی سایت سازگار با موبایل و تبلت
ریسپانسیو یا واکنش‌گرا

طراحی سایت سازگار با موبایل و تبلت

با رشد روز افزون استفاده از دستگاه‌هائی چون موبایل (تلفن همراه) و تبلت، دنیای وب‌سایت‌ها با اصطلاح جدیدی به نام نسخه‌ی واکنش‌گرا یا ریسپانسیو (Responsive) روبرو شده است.

دستگاه‌هائی با تفاوت‌های بسیار

تفاوت عمده‌ی دستگاه‌های امروزی در سیستم‌عامل‌ها و سایز نمایشگر یا همان Screen می‌باشد. شکی نیست که رقابت بین سیستم‌هائی چون ویندوز، OS و اندروید در کنار سایز LCDها باعث شده تا افراد بسته به سلیقه و کاربرد دستگاه مورد نظر خود را انتخاب نمایند. برای مثال ممکن است در محل کار از یک کامپیوتر با LCD بیست اینچی داشته، در منزل از یک تبلت سامسونگ 8 اینچی خریداری کرده و تلفن همراهتان را از نوع Apple 5s با سایز نمایشگر 4 اینچی انتخاب نموده باشید. این تفاوت‌ها باعث پیدایش نسخه‌ی ریسپانسیو سایت‌ها شده است.
سایزهای مختلف نمایشگرها

سایت‌های ریسپانسیو چگونه سایت‌هایی هستند؟

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

عدم ریسپانسیو در سایت ها
در نگاه اول ممکن است مشکلی را کشف نکنید، اما اگر کمی با سایت کار کنید متوجه می‌شوید که برای خواندن مطالب سایت باید آن را بزرگ‌تر یا Zoom نمود.
در مقابل سایت‌هایی وجود دارند که بدون نیاز به Zoom به سادگی می‌توان مطالب آن را مطالعه نمود. اینگونه سایت‌ها به محض اینکه Load می‌شوند، چیدمان و سایز فونت‌هایشان را مطابق با سایز نمایشگر تغییر می‌دهند. در واقع برخی از سایت‌ها به صورت خودکار خود را مسئول می‌دانند تا با توجه به سایز نمایشگر واکنش نشان داده و چیدمان‌ها را تغییر دهند. این نوع از وب‌سایت‌ها براساس Responsive طراحی شده‌اند.

نسخه ی ریسپانسیو سایت ها
برای مثال به وب‌سایت دالاهو به آدرس dalahoo.com سری بزنید. سپس صفحه اول آن را در سایزهای مختلف موبایل مشاهده نمایید. خواهید دید که در هر کدام چیدمان مختلف خواهد بود. همچنین سایت hipersia.com/en نمونه دیگری می‌باشد که در تمامی دستگاه‌ها و تمامی سایزها ریسپانسیو است.

لاله قنبری
لاله قنبری

کارشناس پشتیبان فنی شرکت همورا
مهندس نرم‌افزار، علاقمند به کتابخانه کوچک شخصی خود و وقت‌گذرانی با دوستان نزدیک

Laaleh Ghanbari Google+

انتشار مطالب فوق تنها با ذکر مرجع به همراه لینک وب‌سایت همورا مجاز می‌باشد.
لطفا به حقوق هم احترام بگذاریم.

بحث و تبادل نظر
نظر دهید
انصراف
ثبت‌نام در خبرنامه همورا
تلاش می‌کنیم ماهیانه اطلاعات خوبی را برای شما ارسال کنیم. نمونه خبرنامه
لبخند معاوضه کن با جان شهریار/ تا من به شوق این دهم و آن ستانمت (شهریار)