Mobile optimization
Skill thisisAhsanIqbal/nextjs-seo-audit/skills/mobile-optimization
AI Agent Skills for SEO auditing , 11 SKILL.md files that teach Cursor, Claude Code, Copilot & more to perform comprehensive SEO audits. Zero dependencies.
npx -y skills add thisisAhsanIqbal/nextjs-seo-audit --skill mobile-optimizationAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 7 stars7 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Validates viewport meta configuration, responsive design, font sizes, touch target sizes, and mobile-hostile patterns. Use when checking mobile-friendliness or fixing mobile rendering issues.
The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.
SKILL.md
2.4 KB, as published. Nobody here has run it
Mobile Optimization
Audit the page for mobile-friendliness.
1. Viewport meta tag
| Check | Status |
|---|---|
Missing <meta name="viewport"> | ❌ FAIL "Page will not render correctly on mobile" |
Present but missing width=device-width | ⚠️ WARN |
Contains user-scalable=no or maximum-scale=1 | ⚠️ WARN "Disabling zoom hurts accessibility" |
| Properly configured | ✅ PASS |
2. Fixed-width elements
Scan all elements with inline style="..." for width: Npx:
- If any element has
width > 500px→ ⚠️ WARN "May cause horizontal scrolling on mobile" - Report the count of offending elements
3. Font sizes
Scan inline styles for font-size: Npx:
- If any element has
font-size < 12px→ ⚠️ WARN "Difficult to read on mobile" - Report the count
4. Touch target sizes
Check interactive elements (<a>, <button>, <input type="submit">, <input type="button">) with inline height style:
- If
height < 48px→ ⚠️ WARN "Too small for touch targets" - Minimum recommended: 48px × 48px (per Google's mobile-friendly guidelines)
5. Overflow detection
- Elements with
overflow-x: hiddenoroverflow: hidden→ ⚠️ WARN "Verify content is not clipped on mobile"
6. Responsive stylesheets
<link rel="stylesheet" media="...">found → ✅ PASS "Media-query-specific stylesheets found"
7. Tables
- If > 2
<table>elements → ⚠️ WARN "Tables can be difficult to read on mobile. Consider responsive table patterns"
Edge cases
- If no inline styles are present, skip fixed-width and font-size checks
- CSS-in-JS frameworks (styled-components, Emotion) embed styles at runtime — these cannot be audited from static HTML alone; note this limitation
- Elements with
display: noneorvisibility: hiddenshould be excluded from touch target checks - AMP pages have their own viewport rules — flag but do not fail if AMP boilerplate is detected
- PWA splash screens and app-shell patterns may intentionally use
user-scalable=no— flag as ⚠️ WARN but note context