Why SEO matters even for apps
"It's a web app, not a blog — why do I care about SEO?" Because search engines index your app. When someone searches for what your app does, you want to show up. Even if your traffic is mostly word-of-mouth, good SEO also means good sharing behavior: your og:image shows up when someone tweets your link, your title renders correctly in Slack previews, and Google doesn't mark you as "not mobile-friendly".
Getting this right takes 30 minutes if you know what to fix. The SEO Audit panel does the knowing for you.
Accessing the SEO Audit panel
First, publish your app (click the Publish button in the toolbar). Then click the SEO Audit icon in the sidebar (it looks like a magnifying glass with a chart). The panel fetches your published URL and runs the analysis.
The analysis takes about 15–30 seconds — it fetches your page, parses the HTML, checks your headers, and analyzes the DOM.
What the audit checks
Meta tags
— present and under 60 characters?— present and between 120–160 characters?— not accidentally set to "noindex"?- Canonical URL — set and pointing to your primary URL?
Open Graph and social sharing
og:title,og:description,og:image— all present?og:imagedimensions — at least 1200×630 pixels? (small images look bad in social previews)- Twitter card meta —
twitter:card,twitter:image?
Technical SEO
/robots.txt— exists and doesn't block all crawlers?/sitemap.xml— exists and lists your important pages?- HTTPS — your app is already on HTTPS by default via Spinini, so this always passes
- No broken internal links?
Mobile-friendliness
set correctly?- Text readable without zooming?
- Touch targets (buttons, links) large enough?
Page speed hints
- Are images unoptimized (very large files)?
- Render-blocking scripts in
? - Missing font-display: swap?
Reading the results
Each check is marked Pass, Warning, or Fail with a clear explanation. Failures and warnings include a "How to fix" section with the exact code change to make.
A typical result for a freshly built Next.js app:
| Check | Status |
| Title tag | Pass |
| Meta description | Fail — missing |
| og:image | Warning — image too small (800×400) |
| robots.txt | Fail — file not found |
| Viewport meta | Pass |
| Mobile touch targets | Warning — 3 buttons under 44px |
Fixing common issues
Missing meta description — add this to your :
<meta name="description" content="Your 120-160 character description here." />In Next.js, use the Metadata API:
export const metadata = {
description: 'Your description here.',
}Missing og:image — create a 1200×630 PNG (your logo on a colored background is fine) and add:
<meta property="og:image" content="https://yourapp.spinini.com/og-image.png" />Missing robots.txt — create /public/robots.txt:
User-agent: *
Allow: /
Sitemap: https://yourapp.spinini.com/sitemap.xmlMissing sitemap.xml — for a static site, create /public/sitemap.xml. For a Next.js app, install next-sitemap and configure it.
Re-running the audit
After making fixes, republish your app and click Re-run audit in the panel. The score updates to reflect your changes. Aim for all Passes — a clean audit means you've done the basics right.