Site Builder

Editing: conversational-se2o.html

writable 0666

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Conversational SEO &amp; the Promptinator | BestDealOn</title>
<meta name="viewport" content="width=device-width,initial-scale=1">

<style>
:root{
  --brand:#0066ff;        /* primary accent */
  --bg:#f9fbff;           /* page background */
  --fg:#111;              /* body text      */
  --muted:#555;           /* secondary text */
  --radius:12px;          /* card rounding  */
  font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0}
body{background:var(--bg);color:var(--fg);line-height:1.55}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-weight:700;line-height:1.25;margin:.2em 0 .4em}
h1{font-size:clamp(1.9rem,4vw+1rem,2.7rem)}
h2{font-size:1.55rem}
h3{font-size:1.25rem}
p{margin:.75rem 0}
.container{max-width:920px;margin:auto;padding:0 1.2rem}

/* hero banner */
.hero{padding:3.5rem 1.2rem;text-align:center}
.hero h1{color:var(--brand)}
.hero p{max-width:640px;margin:.9rem auto 0;font-size:1.15rem;color:var(--muted)}

/* two‑column section */
.flex{display:flex;flex-wrap:wrap;gap:2.2rem;margin:2.5rem 0}
.flex > *{flex:1 1 420px}

/* cards */
.card{
  background:#fff;border-radius:var(--radius);
  box-shadow:0 6px 24px rgba(0,0,0,.08);padding:2rem
}

/* promptinator demo */
.demo select, .demo button{
  width:100%;padding:.65rem .75rem;font:inherit;border:1px solid #ccd2e2;
  border-radius:8px;margin-bottom:.9rem
}
.demo button{background:var(--brand);color:#fff;border:none;cursor:pointer;font-weight:600}
.demo button:hover{filter:brightness(1.07)}
.prompt-box{
  min-height:120px;border:1px solid #ccd2e2;border-radius:8px;
  padding:.9rem;background:#f6f8ff;white-space:pre-wrap
}
.tags{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}
.tag{background:#e9f0ff;padding:.35rem .7rem;border-radius:30px;
     font-size:.85rem;display:inline-flex;align-items:center;gap:.35rem}
.tag .del{cursor:pointer;font-weight:700;line-height:1;color:#d91c31}

/* responsive tweaks */
@media(prefers-color-scheme:dark){
  :root{--bg:#0d1117;--fg:#e6edf3;--brand:#2f81f7;--muted:#8899a8}
  .card{background:#161b22;box-shadow:0 4px 14px rgba(0,0,0,.6)}
  .demo select,.demo button,.prompt-box{border-color:#30363d;background:#0d1117;color:inherit}
  .prompt-box{background:#0d1117}
  .tag{background:#243056}
}
</style>
</head>
<body>

<header class="hero">
  <h1>Conversational&nbsp;SEO &amp; the <em>Promptinator</em></h1>
  <p>Turn every AI chat into a marketing opportunity – no complex SEO
     playbooks, just simple human‑friendly prompts that put <strong>your</strong>
     business at the centre of the conversation.</p>
</header>

<section class="flex">
    <article class="card">
      <h2>Why “Conversational SEO”?</h2>
      <p>
        Traditional SEO optimises for keywords; Conversational SEO optimises
        for <strong>answers</strong>.  When customers ask
        <em>“Who’s the best plumber in Tampa for emergencies?”</em> inside
        ChatGPT, Gemini or Bing Copilot, your microsite’s prompts help
        the AI answer <em>with your brand name included</em>.
      </p>
      <p>
        The <strong>Promptinator</strong> (embedded in every BestDealOn page)
        lets you publish ready‑made questions customers can fire directly
        into their favourite AI with a single click.
      </p>
    </article>

<article class="card">
      <h2>Speed &amp; structure<br>AI engines love</h2>
      <ul style="margin-left:1.2rem">
        <li>✅ &nbsp;100 % Google PageSpeed / Lighthouse scores</li>
        <li>✅ &nbsp;Sub‑1 s first paint (global edge delivery)</li>
        <li>✅ &nbsp;Rich&nbsp;Schema.org structured data</li>
        <li>✅ &nbsp;Static‑first, CDN‑cached micro‑pages</li>
      </ul>
      <p style="margin-top:1.1rem">
        Slow or bloated sites are skipped by AI crawlers.  BestDealOn stays
        lean, lightning‑fast, and easy for language models to parse.
      </p>
    </article>
  </section>

<section class="card">
    <h2 style="margin-bottom:1.2rem">Try the Promptinator ↓</h2>

<div class="demo">
      <select id="demoSel">
        <option value="">Choose a sample prompt…</option>
        <option value="plan">Keyword Research &amp; Marketing Plan</option>
        <option value="pitch">Elevator Pitch for [Business&nbsp;Name]</option>
        <option value="faq">Generate FAQ for [Service&nbsp;Type]</option>
      </select>
      <button id="demoBtn" disabled>Insert prompt</button>

<div id="promptBox" class="prompt-box"></div>

<div class="tags" id="aiBtns" style="display:none">
        <span class="tag"><strong>ChatGPT</strong></span>
        <span class="tag"><strong>Perplexity</strong></span>
        <span class="tag"><strong>Copilot</strong></span>
      </div>
    </div>
  </section>

<section class="card" style="margin:2.8rem auto 3.5rem;text-align:center">
    <h2>Ready to join the conversation?</h2>
    <p style="max-width:520px;margin:.9rem auto 1.8rem">
       List your business on BestDealOn for <strong>$100 / year</strong>
       and turn every AI chat into free, perpetual exposure.
    </p>
    <a href="/members/register.php" style="display:inline-block;padding:.9rem 2.1rem;background:var(--brand);color:#fff;border-radius:8px;font-weight:600">Create my page</a>
  </section>

</div>

<script>
/* copy deck – replace / extend with real templates later */
const DEMO = {
  plan:`Keyword Research & Marketing Plan Template – You are a market strategist for [Apple Roof Cleaning] offering [Roof Cleaning] in [Seminole]. Reference [Pick a site], then build a plan with [15] primary keywords, [8] long‑tail phrases, segments [Local Residents], channels [Email Campaigns], in a [Data‑Driven] tone mapping keywords to channels with milestones.`,

pitch:`Craft a concise 60‑second elevator pitch positioning [Business Name] as the go‑to specialist in [Service], focusing on [Unique Benefit] and targeting [Audience].`,

faq:`Generate 7 customer FAQ pairs for a company providing [Service Type] in [City], answers should be 40‑60 words each, friendly and authoritative.`
};

const sel = document.getElementById('demoSel'),
      btn = document.getElementById('demoBtn'),
      box = document.getElementById('promptBox'),
      ai  = document.getElementById('aiBtns');

sel.addEventListener('change', ()=> btn.disabled = !sel.value);

btn.addEventListener('click', ()=>{
  const key = sel.value;
  box.textContent = DEMO[key] || '';
  ai.style.display = key ? 'flex' : 'none';
});
</script>

</body>
</html>

Site Builder

Editing: conversational-se2o.html

Site Builder