موقع واحد، شاشات متعددة. التصميم المتجاوب يجعل تخطيطًا واحدًا يتكيف مع أحجام واتجاهات الأجهزة المختلفة. صاغ هذا المصطلح إيثان ماركوت عام ٢٠١٠، مستندًا إلى أفكار سابقة حول الشبكات المرنة والصور الانسيابية. فبدلًا من إنشاء مواقع منفصلة لأجهزة سطح المكتب والهواتف المحمولة، يُنشئ المصممون قاعدة بيانات واحدة تُعيد ترتيب نفسها تلقائيًا بناءً على عرض نافذة العرض.

ثلاثة عناصر تقنية تُساهم في نجاح هذه التقنية. تستخدم الشبكات المرنة نسبًا مئوية بدلًا من وحدات البكسل الثابتة، مما يسمح بتمدد الأعمدة وانكماشها. كما تتكيف الصور المرنة مع أحجام الشاشات المختلفة. وتكتشف استعلامات الوسائط حجم الشاشة وتُطبق قواعد CSS مختلفة عند نقاط التوقف المُحددة. على سبيل المثال، قد يتحول تصميم سطح المكتب ذو الأعمدة الثلاثة إلى عمود واحد على الهاتف، مع انتقال شريط التنقل إلى قائمة جانبية. الهدف ليس التحكم الدقيق بالبكسل، بل التكيف السلس.

التقنيات الأساسية

• شبكات مرنة تعتمد على النسب المئوية.
• صور ووسائط مرنة.
• استعلامات الوسائط عند نقاط التوقف المحددة.
• تحديد أولويات المحتوى المتوافق مع الأجهزة المحمولة.

أصبح التصميم المتجاوب ممارسة معيارية الآن. يتوقع المستخدمون أن يعمل الموقع سواء فتحوه على هاتف أو جهاز لوحي أو حاسوب محمول أو تلفزيون.