पाठ 16 / 25

Responsiveness testing

Multiple breakpoints पर layouts को test करें, browser DevTools का उपयोग करें, और responsive design issues को catch करने के लिए real devices पर test करें।

Testing checklist

  1. DevTools device emulation का उपयोग करें। 2. 320px (smallest mobile) पर test करें। 3. Common breakpoints (375, 768, 1024, 1440px) पर test करें। 4. जब संभव हो real devices पर test करें। 5. Touch interactions और form inputs check करें। 6. Images properly load होते हैं verify करें। 7. Performance (Core Web Vitals) check करें।

DevTools का उपयोग करके test करें

DevTools खोलें → Toggle device toolbar (Ctrl+Shift+M)। एक preset device चुनें या drag करके resize करें। Narrow widths पर test करें। Network tab में, slow mobile को simulate करने के लिए 3G पर throttle करें।

Emulator बनाम real device

DevTools emulation तेजी है लेकिन real devices performance issues दिखाते हैं।