Mobile Friendly Checker — free mobile usability audit for any page | GetAnythingPro

Mobile-Friendly Checker

A mobile friendly checker tells you whether your site actually works on phones — where most of your visitors are. Google indexes the mobile version of pages first, and a site that requires pinch-zooming bleeds visitors within seconds. The frustrating part is that most mobile problems are invisible on desktop: a fixed-width container, tiny tap targets, or 10-pixel text only reveal themselves on a phone screen.

This free mobile friendly checker audits your pasted HTML source for the eleven most common mobile-usability problems: viewport setup, tap targets, font sizes, images, tables, and more. No URL fetching, no signup — the audit runs entirely in your browser. Each check is scored and weighted by impact, so you get a clear 0–100 grade plus plain-language fixes ordered by what matters most.

Mobile-Friendly Checker

Paste your page's HTML source for an instant mobile-usability audit — viewport, tap targets, fonts, and images.

We never fetch URLs or visit websites. Paste the HTML source of your page (right-click → View page source, then copy) and the audit runs entirely in your browser.
–
–

🔒 100% private — everything runs in your browser, nothing is uploaded.

\n'; function addCheck(list,name,status,detail,pts,max){ list.push({name:name,status:status,detail:detail,pts:pts,max:max}); } function run(){ hideErr(); var src=html.value; if(!src.replace(/\s/g,'')){showErr('Paste some HTML first — right-click your page, choose "View page source", and copy it.');return;} var head=(src.match(/]*>([\s\S]*?)<\/head>/i)||[])[1]||''; var body=src; var checks=[],total=0,max=0; // 1. viewport var vp=head.match(/]+name=["']viewport["'][^>]*>/i); if(vp){ var content=(vp[0].match(/content=["']([^"']*)/i)||[])[1]||''; if(/width\s*=\s*device-width/i.test(content)){addCheck(checks,'Viewport meta tag','pass','Found '+esc(vp[0].slice(0,80))+'… with device-width. The page will scale correctly on phones.',15,15);} else{addCheck(checks,'Viewport meta tag','warn','Viewport tag exists but does not set width=device-width. Content: '+esc(content)+'',8,15);} }else{addCheck(checks,'Viewport meta tag','fail','No viewport meta tag found. Without <meta name="viewport" content="width=device-width, initial-scale=1"> mobile browsers render the desktop layout zoomed out.',0,15);} // 2. fixed widths var wide=[],re=/width\s*:\s*(\d+)px/gi,m; while((m=re.exec(src))!==null){if(parseInt(m[1],10)>480)wide.push(m[1]);} var wattr=0,re2=/\swidth=["'](\d+)["']/gi; while((m=re2.exec(src))!==null){if(parseInt(m[1],10)>480)wattr++;} if(wide.length===0&&wattr===0){addCheck(checks,'No fixed desktop widths','pass','No elements wider than 480px found in inline styles or width attributes. Layout should fit phone screens.',12,12);} else{addCheck(checks,'Fixed desktop widths','warn','Found '+(wide.length+wattr)+' fixed width(s) over 480px (e.g. '+esc(wide[0]||'')+'px). These can force horizontal scrolling — prefer max-width:100% or fluid layouts.',5,12);} // 3. tap targets var links=(src.match(/]/gi)||[]).length+(src.match(/]/gi)||[]).length; var tiny=0,m2; var reP=/padding\s*:\s*[0-3]px/gi; while((m2=reP.exec(src))!==null){tiny++;} var reF=/font-size\s*:\s*(\d+(?:\.\d+)?)px/gi; while((m2=reF.exec(src))!==null){if(parseFloat(m2[1])<12)tiny++;} if(links===0){addCheck(checks,'Tap targets','warn','No links or buttons detected in the pasted HTML — could not assess tap-target sizing.',6,10);} else if(tiny>0){addCheck(checks,'Tap targets','warn',links+' links/buttons found, but '+tiny+' suspiciously small text/padding declaration(s). Aim for tap targets at least 44×44 CSS px with comfortable spacing.',5,10);} else{addCheck(checks,'Tap targets','pass',links+' links/buttons found with no obviously tiny sizing. Keep tap targets ≥ 44×44 CSS px and well spaced on real devices.',10,10);} // 4. font sizes var smallFonts=0,re4=/font-size\s*:\s*(\d+(?:\.\d+)?)px/gi; while((m=re4.exec(src))!==null){if(parseFloat(m[1])<12)smallFonts++;} if(smallFonts===0){addCheck(checks,'Readable font sizes','pass','No inline font sizes below 12px. Body text at 16px+ is the mobile baseline.',10,10);} else{addCheck(checks,'Small font sizes','warn',smallFonts+' inline font-size declaration(s) below 12px. Tiny text forces pinch-zooming — use 16px minimum for body copy.',4,10);} // 5. iOS input zoom var inputZoom=0,re5=/<(input|select|textarea)[^>]*style=["'][^"']*font-size\s*:\s*(\d+(?:\.\d+)?)px/gi; while((m=re5.exec(src))!==null){if(parseFloat(m[2])<16)inputZoom++;} if(inputZoom>0){addCheck(checks,'iOS input zoom trap','warn',inputZoom+' form field(s) with font-size below 16px. iOS Safari auto-zooms into such fields, breaking the layout — set inputs to 16px.',3,8);} else{addCheck(checks,'iOS input zoom trap','pass','No form fields with sub-16px font sizes. iOS Safari will not force-zoom on focus.',8,8);} // 6. images alt + responsive var imgs=src.match(/]*>/gi)||[]; var noAlt=imgs.filter(function(t){return !/alt\s*=/i.test(t);}).length; var fixedImg=imgs.filter(function(t){return /\swidth=["']\d+["']/i.test(t)&&!/max-width/i.test(t);}).length; if(imgs.length===0){addCheck(checks,'Images','warn','No images found in the pasted HTML.',4,8);} else{ var d=imgs.length+' image(s) found. '; if(noAlt>0)d+=noAlt+' missing alt text (bad for accessibility and SEO). '; if(fixedImg>0)d+='Some use fixed width attributes without max-width — add img{max-width:100%;height:auto}.'; if(noAlt===0&&fixedImg===0){addCheck(checks,'Images','pass',d+'All have alt text and no fixed-width traps.',8,8);} else{addCheck(checks,'Images','warn',d,4,8);} } // 7. tables var tables=(src.match(/]/gi)||[]).length; if(tables===0){addCheck(checks,'Tables','pass','No tables — nothing to overflow horizontally.',7,7);} else{addCheck(checks,'Wide tables','warn',tables+' table(s) found. Tables are the #1 cause of horizontal scrolling on phones — wrap them in a horizontally scrollable container or restyle as stacked cards.',3,7);} // 8. title var title=(head.match(/]*>([\s\S]*?)<\/title>/i)||[])[1]||''; if(title.replace(/\s/g,'')){addCheck(checks,'Page title','pass','Title present: "'+esc(title.trim().slice(0,60))+'".',5,5);} else{addCheck(checks,'Page title','fail','No <title> found. Every page needs a descriptive title for tabs, bookmarks, and search.',0,5);} // 9. meta description if(/]+name=["']description["']/i.test(head)){addCheck(checks,'Meta description','pass','Meta description present — good for search snippets.',5,5);} else{addCheck(checks,'Meta description','warn','No meta description. Not a mobile-usability issue, but it hurts how your page looks in search results.',2,5);} // 10. touch icon if(/rel=["']apple-touch-icon["']/i.test(head)){addCheck(checks,'Touch icon','pass','Apple touch icon declared — nice home-screen icon on iOS.',5,5);} else{addCheck(checks,'Touch icon','warn','No apple-touch-icon link. Add one (180×180 PNG) so your site looks sharp when saved to a home screen.',2,5);} // 11. flash/frames if(/<(frame|frameset)[\s>]/i.test(src)||/\.swf/i.test(src)){addCheck(checks,'Legacy plugins/frames','fail','Frames or Flash content detected — unsupported on mobile and harmful to usability.',0,5);} else{addCheck(checks,'Legacy plugins/frames','pass','No frames or Flash detected.',5,5);} // render checks.forEach(function(c){total+=c.pts;max+=c.max;}); var score=Math.round(total/max*100); num.textContent=score; var g,v; if(score>=85){g='MOBILE FRIENDLY';v='Great — this page follows the core mobile-usability practices. Verify on a real device to be sure.';} else if(score>=60){g='NEEDS WORK';v='Usable, but the warnings above will hurt real visitors on phones. Fix the red items first.';} else{g='NOT MOBILE FRIENDLY';v='This page will frustrate phone visitors. Work through the failed checks top to bottom.';} grade.textContent=g; grade.className='gap-grade '+(score>=85?'g-good':(score>=60?'g-ok':'g-bad')); verdict.textContent=v; scoreBox.style.display='flex'; var htmlOut=''; checks.forEach(function(c){ var badge=c.status==='pass'?'PASS':(c.status==='warn'?'WARN':'FAIL'); htmlOut+='
'+badge+' '+esc(c.name)+'

'+c.detail+'

'; }); results.innerHTML=htmlOut; scoreBox.scrollIntoView({behavior:'smooth',block:'nearest'}); } $('mf-run').addEventListener('click',run); $('mf-sample').addEventListener('click',function(){html.value=SAMPLE;hideErr();html.focus();}); $('mf-clear').addEventListener('click',function(){html.value='';results.innerHTML='';scoreBox.style.display='none';hideErr();html.focus();}); })();

How to Use the Mobile-Friendly Checker

  1. Get your page’s HTML source: open the page in a browser, right-click, choose View page source, and copy everything (Ctrl+A, Ctrl+C).
  2. Paste it into the box above — or click Load sample to see the audit on a deliberately flawed page.
  3. Click “Run mobile audit.” You get a score out of 100 plus a verdict: Mobile Friendly, Needs Work, or Not Mobile Friendly.
  4. Work through the checklist top to bottom — red FAIL items first, then yellow WARN items. Each explains the problem and the fix.
  5. Re-paste and re-run after fixing to watch your score climb.

Features That Set This Tool Apart

  • 11-point audit — viewport, fixed widths, tap targets, font sizes, iOS input zoom, images, tables, title, meta description, touch icon, and legacy plugins.
  • Plain-language fixes — every check explains what failed and exactly how to fix it, with code snippets.
  • Weighted scoring — critical issues (viewport, fixed widths) move the score more than nice-to-haves.
  • No URL fetching — your pages are never visited, scraped, or stored anywhere.
  • Sample page included — learn what failures look like before auditing your own site.
  • Instant and private — the whole audit runs in JavaScript in your browser.

What the Mobile Friendly Test Checks

Each mobile friendly test run examines eleven signals. The viewport meta tag is the foundation — without width=device-width, phones render the desktop layout shrunk to fit. Fixed desktop widths over 480px in inline styles or attributes are the classic cause of horizontal scrolling. Tap targets should be at least 44×44 CSS pixels; cramped links frustrate thumbs.

Font sizes below 12px force pinch-zooming, and form fields under 16px trigger iOS Safari’s infamous auto-zoom. Images are checked for missing alt text and fixed widths without max-width:100%. Tables get flagged because they are the number-one horizontal-scroll offender. The audit also verifies your title, meta description, touch icon, and the absence of frames or Flash. Google’s own mobile-sites guidance covers the same fundamentals.

How to Make Your Site Mobile-Friendly: 7 Fixes

  1. Add the viewport tag: <meta name="viewport" content="width=device-width, initial-scale=1"> in your <head>. This single line fixes most “site looks tiny on phones” complaints.
  2. Go fluid: replace fixed pixel widths with percentages and max-width. Add the global rule img{max-width:100%;height:auto}.
  3. Size up touch targets: minimum 44×44 CSS px for buttons and links, with at least 8px spacing between adjacent targets.
  4. Set readable type: 16px minimum for body text; never below 12px anywhere; 16px+ on all form inputs.
  5. Tame your tables: wrap them in overflow-x:auto containers, or restyle as stacked cards on small screens.
  6. Use responsive breakpoints: a couple of media queries (e.g., at 640px and 1024px) cover the vast majority of devices.
  7. Test on a real phone: no audit replaces holding the device — check with both Android and iOS if you can.

Why This Tool Never Fetches URLs

Most mobile-friendly checkers ask for your URL and fetch the page from their servers. That design has real downsides: it cannot audit pages behind logins, staging sites, or local development servers; it sends your HTML to a third party; and it can be blocked by firewalls or bot protection.

This mobile friendly checker takes the opposite approach: you paste the HTML, the audit runs locally. It works on localhost, intranets, password-protected staging, and drafts that are not public yet. Your source code never leaves your browser, so there is nothing to leak and nothing to block. The tradeoff is one extra copy-paste step — a small price for auditing anything, anywhere, privately.

Mobile Friendly Test Scoring: How Your Grade Is Calculated

Every mobile friendly test run scores your pasted HTML out of 100 across eleven checks. The points are weighted by impact: the viewport meta tag (15 points) and fixed desktop widths (12 points) carry the most weight, because each single-handedly decides whether a page is usable on a phone. Tap targets, font sizes, and images sit in the middle, while nice-to-haves like the touch icon contribute a few points each.

Scores of 85 and above earn the Mobile Friendly grade — the page follows the core practices. Scores from 60 to 84 get Needs Work, meaning visitors can cope but the warnings will cost you engagement. Below 60 is Not Mobile Friendly: the page will actively frustrate phone users, and fixing it should be a priority.

When improving a low score, fix in this order: viewport first, then fixed widths, then tap targets and fonts. Re-run the mobile friendly test after each round of fixes — watching the score climb is the fastest way to confirm each change worked. Remember that each mobile friendly test audits static HTML only; visual bugs and broken media queries still deserve a real-device check before you call the page done.

Mobile-Friendly Checker: Frequently Asked Questions

How do I check if my website is mobile friendly?

Open your page in a browser, right-click and choose View page source, copy the HTML, and paste it into the checker above. Click Run mobile audit to get a score out of 100 and a checklist of exactly what passes, what warns, and what fails — each with a fix. Re-run after making changes to confirm your score improved.

Why does this tool ask for HTML instead of a URL?

Pasting HTML keeps the audit fully private and lets it work on pages no server could reach: localhost, staging sites, intranets, and password-protected drafts. Your source code never leaves your browser, so there is nothing to leak, store, or block. Copy-paste takes five seconds and works everywhere.

What is the most common mobile-usability mistake?

A missing or wrong viewport meta tag. Without width=device-width, mobile browsers render the desktop layout zoomed out and tiny. It is a one-line fix in the page head, and it alone can take a page from unusable to readable on phones. The audit flags it first because nothing else matters much until it is right.

Does a good score guarantee my site looks perfect on phones?

No. This is a static source-code audit — it catches structural problems like missing viewports and fixed widths, but it cannot see visual bugs, broken media queries, or awkward layouts. Treat a high score as a strong foundation, then verify on a real phone (or browser device emulation) before calling it done.

Is my pasted HTML uploaded or stored anywhere?

No. The audit runs entirely in JavaScript inside your browser. Your HTML is never sent to a server, stored, logged, or shared — which is exactly why this tool can safely audit private staging sites and unreleased pages. Everything stays on your device, and the checker keeps working offline once the page has loaded.

Phones are the web’s front door. Run this mobile friendly test on every template you ship, fix what it flags, and your visitors — and Google — will thank you.