MaxxMini

Posted on Feb 23 • Edited on Mar 2

FAQPage Schema + Shareable URLs: Two Quick Wins for Web Tool SEO

#webdev #seo #javascript #tutorial

You built a web tool. It works. It's deployed. But nobody finds it on Google.

I recently applied two features to 15 of my micro-SaaS tools that took ~10 minutes each:

FAQPage structured data → Google rich snippets
Shareable URLs → Users share pre-configured tool states

Here's the exact code.

1. FAQPage Structured Data

Google shows FAQ rich snippets in search results — expandable Q&A boxes that take extra screen space. Free visibility.

The Schema

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "What does this tool do?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Plain text answer. Concise but informative."
      }
    }
  ]
}
</script>

Rules

5-7 questions max
Answer adjacent questions — not just "what does your tool do"
Include code snippets — developers want code
Validate with Rich Results Test

Good Questions

For a JSON formatter:

"How do I format JSON in the terminal?" → jq ., python -m json.tool

For a regex tester:

"How do I test regex in Python?" → re.match() example

2. Shareable URLs (Zero Backend)

When a user shares your tool URL, the recipient sees the exact same configuration.

Simple: URL Parameters

function shareState() {
  const params = new URLSearchParams({
    n: document.getElementById('count').value,
    t: document.getElementById('type').value
  });
  const url = `${location.origin}${location.pathname}?${params}`;
  navigator.clipboard.writeText(url);
}

function restoreFromURL() {
  const params = new URLSearchParams(location.search);
  if (params.has('n')) {
    document.getElementById('count').value = params.get('n');
    generate();
  }
}
window.addEventListener('DOMContentLoaded', restoreFromURL);

Complex: Base64

function shareState() {
  const state = { input: getText(), options: getOpts() };
  const encoded = btoa(unescape(encodeURIComponent(JSON.stringify(state))));
  navigator.clipboard.writeText(
    `${location.origin}${location.pathname}?d=${encoded}`
  );
}

Every shared URL is a backlink. A working demo link converts 10x better than a cold homepage link.

3. Visible FAQ with Native HTML

<details>
  <summary>Is my data sent to a server?</summary>
  <p>No. Everything runs in your browser.</p>
</details>

Native <details> — no JS, accessible, increases time-on-page.

Results

Applied to 15 tools in one day. ~3 min each after the first (which took 2 hours).

FAQPage validation passing ✅
Share URLs working ✅
15 tools × 14 cross-links = internal link network
Measuring: 36 visits/week baseline → checking in 72h

Building browser-only tools? DonFlow — a budget drift detector, zero backend. Same philosophy.

📘 Free Resource

If you are building with a $0 budget, I wrote a playbook about what works, what doesn't, and how to think about the $0 phase.

📥 The $0 Developer Playbook — Free (PWYW)

Want the deep dive? The Extended Edition ($7) includes a 30-day launch calendar, 5 copy templates, platform comparison matrix, and revenue math calculator.

DEV Community