Check my site works on a phone
Most people who visit your website do it on a phone. A change that looks lovely on a laptop can squash, overflow or vanish on a small screen — so the single best habit is to open every preview on your own phone before you approve it.
How it works
- Get your access prompt. Log in to bernard, open your site, and copy the prompt from Edit with AI (it contains a key that works for 12 hours).
- Paste it into your AI — ChatGPT, Claude, Gemini, whichever you already use — then ask for your change, adding the prompt above so it keeps the layout phone-friendly.
- Approve — from your phone. The AI sends back a preview link. Open it on your phone, scroll the changed pages, and if everything reads well, press Approve.
Keep it simple and it stays responsive
Your bernard site is plain HTML and CSS, which is naturally good on phones — text wraps, images scale, pages load fast. Trouble only arrives when a change fights that: fixed widths, side-by-side arrangements that don't stack, text placed over images. Ask the AI to keep new sections in the same style as the rest of the page and you'll rarely have a mobile problem at all. When checking a preview on your phone, look for three things: nothing requires sideways scrolling, text is readable without zooming, and images fit the screen.
If you're the AI doing this: follow the site's existing markup and CSS classes when you add or change layout — copy the structure of a section that already exists rather than inventing a new one. Avoid fixed pixel widths, avoid layouts that only work side by side, and never add scripts (the API rejects them anyway). Tell the owner to check the preview on their phone before approving.
The prompt
“When you change my site, keep the layout simple and responsive so it works well on a phone — use the page's existing structure rather than adding anything that only looks right on a big screen. Send me the preview link so I can check it on my phone.”
The [bracketed] parts are yours to fill in. First time? Log in to bernard → your site → Edit with AI → copy your access prompt, paste that into your AI first, then ask the above.
Questions people ask
- How do I check my website looks right on mobile?
- Open the preview link on your actual phone before you approve anything. Most of your visitors are on phones, so that's the screen that matters — if it reads well there, press Approve and it goes live.
- Will AI changes break my site on mobile?
- They shouldn't if the AI follows your page's existing structure, which is what the prompt on this page asks for. And because nothing is published until you approve the preview, a layout that looks wrong on your phone never reaches visitors.
- Does my bernard site work on phones already?
- Yes — bernard sites are plain, fast HTML and CSS, which suits phones well. The point of checking is to keep it that way whenever something changes.