Works with · ChatGPT

ChatGPT · AI tool

Get feedback on pages ChatGPT writes

ChatGPT wrote you a page, a prototype or an email-style layout. Save the code as one HTML file, upload it, and send a link where people click what they mean, then give ChatGPT every change in one brief.

Free for 3 projects. Reviewers never need an account. Or upload an HTML file.

Why ChatGPT users use HTMLAnnotate

ChatGPT is quick at producing a working page, and its code blocks can preview HTML right in the chat. The trouble starts when someone else needs to weigh in. Your client or manager is not in your conversation, and asking them to scroll through a chat to find the latest version of a page is a lot to ask. So the page gets passed around as screenshots, and the details that matter, hover states, spacing on a phone, the exact wording, get lost.

Feedback by email or chat message is hard to act on. "Make the top part punchier" does not say which heading, at which screen size, or what the new words should be. A screen recording shows one person's path through the page. When you relay all of that to ChatGPT, you are rewriting vague notes into instructions, and ChatGPT fills the gaps with its own guesses. Each round takes longer than the build did.

Pinned comments fix the hand-off at both ends. Reviewers click the actual button, image or line of text and type, in the Desktop, Tablet or Mobile view they were looking at. Wording edits come in as suggested text you can preview. Then Copy for AI packs every open comment into a brief with the element, CSS selector, view and suggested wording, ready to paste back into ChatGPT.

How it works with ChatGPT

Three steps, about a minute.

Copy the code

In the chat, use the copy control on the code block that holds the page. Paste it into a plain text file and save it with a name ending in .html.

Upload it

Drop the file into HTMLAnnotate. It takes one self-contained HTML file (up to 1 MB on Free, 10 MB on Pro and Team) and gives you a review link in seconds.

Share and send back

Send the link to reviewers. When comments are in, press Copy for AI and paste the brief into the ChatGPT conversation that wrote the page.

A full review round, start to finish

What a typical round looks like on ChatGPT.

  1. Ask for one complete file

    Ask ChatGPT for the whole page as a single HTML file with CSS and JavaScript inline and images either embedded or loaded from public URLs. If it answers with a React component, ask for a plain HTML version instead, since the upload needs a page that runs on its own.

  2. Preview, then save

    Use Preview on the code block to check the page inside ChatGPT. Then copy the code, paste it into a text editor and save it as an .html file. Open it in your browser once to confirm it looks the same outside the chat.

  3. Create the review link

    Upload the file to HTMLAnnotate. Sign in first if reviewers need more than a day: links last 1 day without an account, up to 14 days on Free, and forever on Pro and Team. Turn on email digests to hear about new comments.

  4. Send it with a clear ask

    Tell reviewers what to focus on, for example the headline and the pricing table. They give a name and email once, switch to Comment mode and click what they mean. Ask at least one person to check the Mobile view, where generated layouts most often need work.

  5. Sort the feedback

    Add labels such as Bug, Copy or Design and set priorities so the important changes stand out. Reply to questions in the thread. Open suggested text changes to see them on the page, press Accept on the ones you want, and resolve anything you will not change.

  6. Hand the brief to ChatGPT

    Press Copy for AI and paste the brief into the same chat. Ask ChatGPT to return the full updated file, not just the changed lines. Save and upload it as the next round, and use Approve clicks as your sign-off.

ChatGPT's own tools and HTMLAnnotate

Use both. Here is what each is good at.

What you needChatGPTHTMLAnnotate
See the page renderedPreview on supported code blocks, inside your chatThe page runs live on a review link
Show it to someone elseShare the whole conversationShare just the page, no chat history
Comments from reviewersNot offeredPinned comments on any element
Notes per screen sizeNot offeredSeparate Desktop, Tablet and Mobile comments
Suggested wordingReviewer emails you, you retype itReviewer types new text, previewed live
Turn feedback into a briefYou write it yourselfCopy for AI with selectors, views and replies

What works

  • A review link for a page nobody else could open
  • Reviewers never see your ChatGPT conversation
  • Every comment pinned to an element, with its CSS selector
  • Desktop, Tablet and Mobile comments kept separate
  • Suggested wording previewed live on the page
  • One-click brief back to ChatGPT with Copy for AI

Good to know

  • Uploads must be one self-contained HTML file (up to 1 MB on Free, 10 MB on Pro and Team). If ChatGPT split the page into several files, ask it to inline the CSS, scripts and images.
  • A React component from a code block is not a full page. Ask ChatGPT to convert it to standalone HTML before uploading.
  • There is no direct connection to ChatGPT. You copy the brief and paste it into the chat yourself.
  • Each new version is a new upload, so start a fresh review link for each round.

Tips for better ChatGPT reviews

Ask for the full file every time

After each set of fixes, ask ChatGPT to output the complete updated HTML file. Pasting partial snippets into an old file is where most broken uploads come from.

Request readable class names

Copy for AI includes CSS selectors. If ChatGPT names things like hero-heading and plan-card instead of div > div:nth-child(3), the brief is clearer for both you and ChatGPT.

Check outside the chat first

Open the saved .html file in your own browser before uploading. If it looks right with no other files next to it, it will look right on the review link too.

Keep wording edits as suggestions

Ask reviewers to use suggested text for copy changes instead of describing them. You see the new words on the page, accept the good ones, and ChatGPT receives the exact wording.

Questions about ChatGPT

How do I get the HTML out of ChatGPT?

Use the copy control on the code block that contains the page, paste it into a text editor, and save the file with an .html ending. Ask ChatGPT for one complete file first so nothing is missing.

What happened to canvas, and does that matter?

OpenAI moved writing and coding into writing blocks and code blocks in chat, and canvas is no longer in current models. It does not change much here: you still copy the code into an .html file and upload it.

Can I share the ChatGPT conversation instead?

You can share a conversation, but reviewers then read your whole chat and have no way to pin notes to the page. A review link shows only the page and collects comments on each element.

Do reviewers need ChatGPT?

No. They only need the review link and a browser. They give a name and email once, the first time they comment, and they never see your ChatGPT conversation or account.

How long does the link last?

One day without an account, up to 14 days signed in on Free, and forever on Pro and Team. Sign in before you upload for anything longer than a quick check.

Will buttons and menus work on the review link?

Yes. The uploaded page runs with its own scripts, so menus, tabs, accordions and sliders work as they did in Preview. Forms on the reviewed copy cannot be submitted.

Other AI tools

HTMLAnnotate works with any page anyone can open in a browser.