Common sizes to test
| Device | Viewport |
|---|---|
| iPhone SE | 375 × 667 |
| iPhone 14 / 15 | 390 × 844 |
| Typical Android | 412 × 915 |
| iPad (portrait) | 768 × 1024 |
| Laptop | 1366 × 768 |
| Full HD desktop | 1920 × 1080 |
These are CSS pixels (viewport sizes), not physical screen pixels — a modern phone has 2–3 physical pixels per CSS pixel.
What to look for
- Text readable without zooming (at least 16 px body text on mobile).
- No horizontal scrolling — content must fit the width.
- Tap targets (buttons, links) at least 44 × 44 px and not too close together.
- Navigation that collapses into a usable menu.
- Images and tables that shrink or scroll inside their container.
Limitations
Many sites send X-Frame-Options or a CSP frame-ancestors rule that blocks being shown in frames — they appear blank here (check with the HTTP Headers Checker). A frame also does not emulate touch or the mobile user agent. For full emulation use your browser's device mode (F12 → toggle device toolbar).
Mobile-friendliness also depends on a correct viewport tag — the SEO Audit checks it. Find your own screen's resolution with the Screen Resolution Detector.
Frequently asked questions
How do I test my website on different screen sizes?
Enter your URL, choose a device size and the site loads in a frame of that width and height. For deeper testing use your browser's device mode.
Why is the preview blank?
The site blocks being displayed in frames with X-Frame-Options or a Content-Security-Policy frame-ancestors rule.
What is the most common mobile screen size?
Most modern phones have viewports between 360 and 430 CSS pixels wide, with 390 and 412 being very common.
Is this the same as a mobile-friendly test?
It shows the layout at a given size. A full mobile test also checks the viewport tag, font sizes and tap targets.