مرکز آموزش

قالب واکنش گرا یا ریسپانسیو چیست؟  پرینت این مقاله

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

بحث اصلی در قالب واکنش گرا بر سر “عرض” صفحه نمایش است

در اینجا (بحث قالب واکنش گرا) ارتفاع صفحه ی نمایش اهمیت چندانی ندارد و باز هم تاکید می کنم که “عرض” صفحه ی نمایش از اهمیت بالایی برخوردار است زیرا امروزه با ورود دستگاه های همراه مانند گوشی های تلفن همراه و تبلت ها به دنیای دستگاههای پیشمایش صفحات اینترنتی تنوع “عرض” این دستگاه ها بسیار زیاد شده است.

درباره ی طراحی یا قالب واکنش گرا

این تنوع عرض از دستگاههای موبایل کوچک با کمتر از چند صد پیکسل شروع می شود و تا کامپیوترهای رو میزی که گاه عرض مانیتور آنها به چند هزار پیکسل میرسد را شامل می شود.
در گذشته سایت ها به گونه ای طراحی می شدند که از یک عرض پرکاربرد به بالا را پاسخ دهند (مثال ده سال پیش عرض 800 در ارتفاع 600 پیکسل به بالا و پنج سال پیش عرض 1024 در ارتفاع  768 اهمیت بیشتری برای طراحان قالب داشت) و بدیهی است که زمانی که یک عرض به عنوان عرض پایه برای طراحی در نظر گرفته می شود آن قالب نباید برای عرض های بزرگتر مشکلی داشته باشد اما مشکل از زمانی شروع می شود که قصد داشته باشیم در یک دستگاه با عرض کمتر سایت را مشاهده کنیم. در این زمان برای استفاده از صفحه اسکرول افقی در صفحه به وجود خواهد آمد که به دلیل دشوار نمودن پیمایش صفحات اینترنتی برای کاربر یک نکته ی بسیار منفی در طراحی محسوب می شود.
طراحی ریسپانسیو یا واکنش گرا آمده است که این مشکل را برطرف نماید به این معنی که شما به همان راحتی که در کامپیوتر رومیزی یا به اصطلاح دسکتاپ صفحات اینترنتی را مشاهده و پیمایش می کنید بتوانید در دستگاه کوچک و قابل حمل خود نیز این کار را به وسیله امکان لمس (تاچ) انجام دهید.
مهمترین دستور Css مرتبط با این موضوع min-width می باشد که اگر با اچ تی ام ال آشنایی داشته باشید موضوع به سرعت دست گیرتان می شود اما بنده قصد ندارم در اینجا وارد مباحث طراحی سایت شوم بنابراین از توضیح بیشتر در این خصوص خودداری می کنم.
از مباحث مهم دیگر در مورد طراحی و قالب واکنش گرا این است که غیر از مبحث عرض دستگاههای مختلف مبحث لمس یا همان touch از ویژگی های اصلی دستگاههای جدید است که در طراحی بحث استفاده از جاوااسکریپت را در طراحی پر رنگتر می کند زیرا به طور معمول در اچ تی ام ال و سی اس اس این امکان جایگاه چندان خاصی ندارد.

آیا این پاسخ به شما کمک کرد؟

در همین زمینه

IPv6 چیست ؟
IP مخفف کلمات Internet Protocol به معنی “پروتکل اینترنت” می باشد. IP یا همان آدرس آی پی چه...
الکسا چیست ؟
این روزها خیلی صحبت از رتبه الکسا است. شاید کسانی که سر و کار چندانی با اینترنت هم ندارند گاها...
زبان برنامه نویسی پی اچ پی چیست
زبان برنامه نویسی پی اچ پی یک زبان اسکریپت نویسی تحت سرور وب به صورت متن باز است که امروزه به...
AJAX چیست
AJAX چیست؟ AJAX سرنام Asynchronous JavaScript and XML کلمات به معنی “ترکیب نامتقارن JavaScript و...
نکات خرید هاست ایران
در هنگام خرید هاست ایران باید به نکاتی توجه داشته باشید. (البته ما کمی جامع تر برسی خواهیم کرد...