How Website Designers Can Show Clients How Their Sites Appear in AI Answers

Why are clients asking how their site reads to AI?

Clients hear that customers now ask ChatGPT or Google's AI results for recommendations, and they want to know whether their new or existing site helps. For a designer, this is an opportunity: the build decisions you make, such as rendering, structure, content placement and bot settings, directly affect whether engines can use the site. Being able to show it, not just claim it, is a strong differentiator in proposals and handovers.

How do you show clients what AI crawlers see?

Many AI crawlers do not run JavaScript, so the most revealing view is the page as raw HTML:

1. Fetch the page without JavaScript. Use a command-line fetch such as curl with a common AI crawler's user agent, a browser with JavaScript disabled, or a text-only view of the source.
2. Strip it to text and show the client the result next to the designed page.
3. Point out what is missing: service descriptions, prices, locations, opening hours, testimonials or FAQs that appear on screen but not in the text.
4. Check the status code the crawler receives. A 403 or a challenge page means the crawler is blocked before it reads anything. A curl request with a crawler's user agent is not the real crawler, though: it comes from your IP, so a CDN that verifies bots may block it while letting the real bot through, or the reverse. Treat a 403 from your test as a lead, and confirm in the CDN's bot log or the server log what the real crawler received.

A client who sees their homepage reduced to a menu and a cookie notice understands the problem immediately. For the full list of checks, see how to audit a website for AI visibility gaps from its URL.

How do you show clients what AI engines say about them?

Run a short live demo, ideally in the meeting:

1. Prepare five to ten questions the client's customers ask: "best [service] in [town]", "[service] for [type of customer]", "how much does [service] cost in [area]".
2. Ask them in ChatGPT, Perplexity and Google, in clean sessions: logged out or in a temporary chat, with the right location.
3. Show who is recommended, whether the client appears, and how they are described.
4. Open the cited sources and show whether any are the client's pages, or a competitor's, or a directory.
5. Ask each engine about the client by name to see whether the facts are right.

Run each question more than once before the meeting, because answers vary; show the pattern, not a single lucky or unlucky answer.

Which design and build choices help or hide a site in AI answers?

Accordions and tabs are usually fine, as long as their content is in the HTML when the page loads. The issue is content that only exists after a script runs or a user acts.

What should a pre-launch AI readiness check include?

Add these to your launch checklist:

• key content present in the raw HTML of every main page;
• robots.txt and CDN or firewall settings reviewed for AI crawlers, since some security services offer settings that block them, sometimes enabled by default;
• one page per main service, with the service, area, typical price range and who it suits stated in the opening paragraph;
• an about page that states plainly who the business is, where it operates and what it does; see what an about page should say for AI visibility;
• contact details, address and hours in text, matching the client's business listings;
• structured data that matches the visible content;
• redirects from old URLs, so engines and links do not hit dead pages.

How do you present findings to a non-technical client?

Keep it visual and short:

• One slide per view: "What customers see", "What AI reads", "What AI says about you".
• Three findings, each with a screenshot: for example, "Your prices are invisible to AI", "ChatGPT recommends two competitors for your main service", "Your hours are wrong in Perplexity".
• Three fixes, with effort and cost.
• A re-check date after launch, when you will run the same questions again.

Avoid scores the client cannot interpret. "Recommended in 0 of 15 answers before, 4 of 15 after" is clearer than a readiness percentage.

What does a before-and-after comparison look like?

A simple table at handover shows the value of the build. The figures below are illustrative for a small service business:

The first three rows are fully within the designer's control and can be shown on launch day. The last row depends on more than the site and may take weeks to move, so set the re-check date accordingly.

How can designers turn this into a service?

• Pre-sale: a short AI visibility snapshot as part of your proposal, showing the current state.
• During the build: AI-readable rendering, structure and content as standard practice.
• At launch: the readiness check above, with a before/after comparison.
• After launch: an optional quarterly re-check of the same questions, or a handover to an SEO or GEO partner.

Be clear about limits. A well-built site makes a business readable and citable, but recommendations also depend on reviews, listings and third-party coverage outside the site. For those parts, point clients to which third-party sites brands should use to earn AI citations and related guidance.

What do people ask about showing clients AI visibility?

Can a redesign make a site disappear from AI answers?

It can make the site harder for AI systems to read if it moves key content into scripts, changes URLs without redirects, or turns on bot protection that blocks AI crawlers. Check before and after launch.

Do website builders produce AI-readable sites?

Many produce readable HTML for main text, but check each site. Some templates load key sections with scripts, and add-ons like booking widgets often hide prices and availability.

Should designers promise AI visibility?

No. Promise an AI-readable site and a measured before/after check. Recommendations depend on factors beyond the website.

How long does a demo like this take to prepare?

About an hour: twenty minutes for the crawler view, thirty for running questions several times, and ten for screenshots.