SpeakableSpecification Schema Generator

Generate advanced Speakable JSON-LD schema markup with CSS Selectors and XPath support for voice search optimization, AI assistants, and modern SEO.

CSS Selector — Speakable Schema Rules (Google / Schema.org):

cssSelector property is used within the SpeakableSpecification. It points to the HTML elements on the webpage that Google TTS (Text-to-Speech) and voice assistants can read aloud.

✅ Valid — Recommended Selectors:
.entry-title — WordPress Default Post Title (Headline)
.entry-content p:first-of-type — WordPress Content First Paragraph
#speakable-summary — Unique ID selector
h1.post-title — Tag + class combo
article > p:first-of-type — First paragraph
[data-speakable="true"] — Custom attribute selector

❌ Avoid — These Violate Speakable Rules:
body, div, section — Too broad, Google ignores
.sidebar, .footer, .ads — Non-article content
.nav, .menu, .cookie-banner — Navigation/UI elements

Generated JSON-LD Output:
"cssSelector": [".article-title", ".article-summary"]
XPath — Speakable Schema Rules (Google / Schema.org):

The xpath property targets the exact node path of an HTML document. It is more precise than cssSelector and is useful for complex structures.

✅ Valid — Recommended XPath:
/html/body/article/h1 — Article heading
/html/body/article/p[1] — First article paragraph
//*[@id='speakable-summary'] — Element by ID
//*[@class='article-intro'] — Element by class
//*[@data-speakable='true'] — Custom data attribute

❌ Avoid — These Violate Speakable Rules:
/html/body — Entire body, too broad
//*[@class='sidebar'] — Sidebar content
//*[@class='footer'] — Footer content
//*[@class='nav'] — Navigation elements

Generated JSON-LD Output:
"xpath": ["/html/body/article/h1", "//*[@id='speakable-summary']"]
📌 Speakable Best Practices (Google Guidelines):

• Only headline aur article summary/intro make speakable.
• Speakable content concise audio should be — ideally 20–30 seconds.
• Do not include Footer, sidebar, ads, navigation.
• CSS Selectors are the best for beginners (simple and readable).
• XPath is best for advanced targeting (dynamic/complex pages).
• Test your CSS selector in the browser console using document.querySelector('.your-class').
• Both cssSelector and xpath can be used together — Google supports both formats.
Validate Schema
Best Practice:

Use only meaningful article content (headline + summary) as speakable sections for better voice search compatibility and cleaner structured data.
Schema Generator Magical Portal Button - Updated Hover
WhatsApp
Scroll to Top