Question about FAQ Toggle, H3 / HTML5 tags and AEO optimization

Shaking The Habitual
1

Hi Stuart,

I hope you’re doing well.

I am currently optimizing my website for AEO (Answer Engine Optimization) to ensure AI search engines like ChatGPT, Perplexity, and Gemini can easily read, comprehend, and cite my content.

At the moment, I am using plain Markdown (Source) for my FAQ section structured like this:

## Frequently Asked Questions (FAQ)

### Question

Answer

In my testing, AI tools are already picking up and understanding this Markdown structure perfectly. However, I would love to organize this content visually using your FAQ Toggle stack.

Before making the switch, I have a couple of quick technical questions:

  1. Does FAQ Toggle wrap the question titles in <h3> tags, or does it use native HTML5 <summary> and <details> tags?
  2. In either case, can I safely use FAQ Toggle for AEO without the risk of the hidden toggle text being missed by AI crawlers?

My primary goal is maintaining maximum AEO performance while improving user experience on mobile devices.

I also wanted to take a moment to truly thank you for all the wonderful stacks you’ve created for us over the years. Without you and your work, it’s just not the same!

Best regards,

1 Like
2

Hi @Gianluca -

The question text in the FAQ stack is just inside a button. It doesn’t use h3 or any other heading level. Nor does it use the summary/details approach.

The text in the FAQ stacks though is only hidden to the user - it is still always fully visible in the underlying code.

Hope that helps.

Thanks,
Stuart

3

Thank you so much for the explanation! Since the text is fully present in the underlying code, I’ll complement the stack’s structure with a custom JSON-LD Schema to cover the semantic hierarchy for AI search engines.

Thanks again for your support! :wave:

Quick update, Stuart:

I also tested wrapping the question text directly in <h3> tags inside the button text field (e.g., <h3>Question</h3>).

It works like a charm! It gives me the native H3 semantic hierarchy for AEO right out of the box without breaking the toggle functionality or layout. I just added a tiny bit of CSS (font-size: inherit; margin: 0; etc.) to keep the font styling completely identical to the original button style. Just thought I’d share!

Best,

1 Like