طراحی وب واکنش‌گرا

از ویکی‌پدیا، دانشنامهٔ آزاد
پرش به ناوبری پرش به جستجو
"محتوا همانند آب است"، یک ضرب‌المثل که اصول RWD را نشان می‌دهد

طراحی وب واکنش‌گرا (به انگلیسی: Responsive web design) (سرواژه:RWD) یک روش طراحی وب است که هدف آن نمایش مطلوب صفحه در طیف گسترده‌ای از دستگاه‌ها از تلفن‌های همراه تا نمایشگر کامپیوترهای رومیزی است.[۱]

یک وب‌سایت طراحی شده به روش واکنش‌گرا تصاویر انعطاف‌پذیر و مدیا کوئری‌های CSS3 سازگار است.[۱][۲][۳]

  • مفهوم شبکه‌های انعطاف‌پذیر این است که در آن برای اندازه عناصر صفحه به جای واحدهای مطلق مانند پیکسل یا پوینت از واحدهای نسبی مانند درصد استفاده می‌کنیم.[۴]
  • اندازه تصاویر انعطاف‌پذیر نیز با واحدهای نسبی تعیین می‌گردد تا بیرون از عنصر نمایش‌دهنده خود نشان داده نشود.[۵]
  • مدیا کوئری‌ها امکان استفاده از CSSهای مختلف برای صفحه براساس ویژگی‌های دستگاه نمایش‌دهنده (معمولاً براساس عرض مرورگر وب) فراهم می‌کنند.
  • یکی از عوامل مهم در رتبه بندی سایت ها توسط موتورهای جستجو همانند گوگل و بینگ واکنش گرا بودن سایت می باشد.

مفاهیم مرتبط[ویرایش]

تقدم تلفن همراه، جاوااسکریپت محجوب، افزایش روزافزون[ویرایش]

تقدم تلفن همراه، جاوااسکریپت محجوب، افزایش روزافزون (استراتژی‌هایی موجود در هنگام بررسی طراحی یک وب‌سایت جدید) مفاهیم مرتبطی هستند که پیش از طراحی واکنش گرای وب واقع می‌شوند:مرورگرهای تلفن‌های همراه عمومی قادر به درک کدهای جاوااسکریپت یامدیا کوئری نیستند. پس چاره کار طراحی یک وب‌سایت جامع با قابلیت ارتقاء مفاهیم برای تلفن هوشمند و رایانه شخصی است بجای آنکه با افت شدیدی در طراحی یک وب‌سایت پیچیده و سنگین برای نوعی از تلفن هوشمند شویم.[۶][۷][۸][۹]

جستارهای وابسته[ویرایش]

منابع[ویرایش]

  1. ۱٫۰ ۱٫۱ Gillenwater, Zoe Mickley (Dec 15, 2010). "Examples of flexible layouts with CSS3 media queries". Stunning CSS3. p. 320. ISBN 978-0-321-72213-3.
  2. Gillenwater, Zoe Mickley (Oct 21, 2011). "Crafting quality media queries".
  3. "Responsive design—harnessing the power of media queries". Google Webmaster Central. Apr 30, 2012.
  4. خطای یادکرد: خطای یادکرد:برچسب <ref>‎ غیرمجاز؛ متنی برای یادکردهای با نام EM_FG وارد نشده‌است. (صفحهٔ راهنما را مطالعه کنید.).
  5. خطای یادکرد: خطای یادکرد:برچسب <ref>‎ غیرمجاز؛ متنی برای یادکردهای با نام EM_FI وارد نشده‌است. (صفحهٔ راهنما را مطالعه کنید.).
  6. Wroblewski, Luke (November 3, 2009). "Mobile First"
  7. Firtman, Maximiliano (July 30, 2010). Programming the Mobile Web. p. 512. ISBN 978-0-596-80778-8.
  8. Designing with Progressive Enhancement. March 1, 2010. p. 456. ISBN 978-0-321-65888-3.
  9. "Graceful degradation versus progressive enhancement". February 3, 2009.