Claude Code Tutorial Part 6: Things to Consider as You Build

Part 6 of 8 of Building a Website with Claude Code. See all parts.

Things to consider

Responsive and mobile-first design

In 2026 more than half of all web traffic comes from phones. Google ranks the mobile version of your site, not the desktop. So design for the phone first.

Tell Claude:

Design this page mobile-first. Show me what it looks like at 360 pixels wide, then at 768, then at 1024. Touch targets must be at least 44 by 44 pixels. Text must be readable without zooming.

Test on your own phone before declaring anything finished. Open the site in your phone's browser. Tap every button. Read every paragraph.

Accessibility (WCAG 2.2)

Accessibility is making your site usable by people with disabilities. As of January 2026 the WCAG 2.2 Level AA standard is the legal benchmark in much of the world.

The core principles are four:

• Perceivable. Visitors can perceive your content, regardless of how they're consuming it.
• Operable. Visitors can use your site with a keyboard, not just a mouse.
• Understandable. The content and the controls behave predictably.
• Robust. The site works in different browsers, including assistive technologies.

In practice, the four things that catch most teams out:

1. Colour contrast. Body text needs a contrast ratio of at least 4.5 to 1 against its background. Use https://webaim.org/resources/contrastchecker/ to check.
2. Keyboard navigation. Try going through your site using only the Tab, Enter, and arrow keys. Can you reach everything? Can you see what's focused?
3. Alternative text on images. Every image that conveys meaning needs an alt attribute describing it. Purely decorative images can have alt="".
4. Form labels. Every input field needs a visible label tied to it.

Tell Claude:

Audit the homepage for WCAG 2.2 Level AA. Tell me where I'm failing and propose specific fixes.

Performance

A slow site costs you traffic. Aim for:

• Largest Contentful Paint under 2.5 seconds. This is the time until the main image or headline shows up.
• Page weight under 1 MB if possible, definitely under 2 MB.
• No layout shift as the page loads. The dreaded jump when an ad pushes the content down.

Quick wins:

• Compress images.
• Don't auto-play videos.
• Use a content delivery network (Cloudflare's free tier is fine).
• Minify your CSS and JavaScript (Claude does this when it builds for production).

Test at https://pagespeed.web.dev/. Aim for a score above 90 on mobile.

SEO basics

Search Engine Optimisation is the practice of making your site easier for search engines to understand. Most of what matters in 2026 is the same as in 2016.

• Title tag: 50 to 60 characters. The most important keyword near the start. This appears in browser tabs and in Google's search results.
• Meta description: 150 to 160 characters. Doesn't directly affect ranking but does affect click-through. A miniature advertisement.
• One <h1> per page. Not three.
• A sitemap. A file called sitemap.xml that lists every page on your site.
• A robots.txt that tells search engines what they can and can't see.
• Fast pages: see Section 25.
• Mobile-friendly: see Section 23.
• Real content. Don't try to game it; write things that are genuinely useful.

After launch:

1. Set up Google Search Console at https://search.google.com/search-console. Free.
2. Submit your sitemap.
3. Wait two or three weeks for Google to crawl.

Tell Claude:

Add proper title and meta description tags to every page. Generate a sitemap.xml and a robots.txt. Make sure each page has exactly one <h1>. Show me where I'm currently breaking this.

Privacy and UK GDPR

If your visitors are in the UK or the EU, you must comply with UK GDPR and the Privacy and Electronic Communications Regulations (PECR). The basics:

• A privacy policy. A page explaining what data you collect, why, and what you do with it.
• Cookie consent. You must ask for opt-in consent before placing any non-essential cookies. That includes most analytics, advertising, and social media trackers. Strictly necessary cookies (for login sessions or shopping baskets) don't need consent.
• Equal prominence. The "reject all" button must be as easy to click as the "accept all" button.
• Consent records. Keep a record of who agreed to what, when, and to what version of your policy. The current ICO guidance asks for these records to be kept for at least 18 months.
• Consent expires. Re-ask every 6 months.

As of February 2026 the fines for breach match UK GDPR penalties: up to £17.5 million or 4% of global turnover, whichever is greater. You don't want this.

The Data (Use and Access) Act (DUAA) lets some low-risk analytics cookies be placed without prior consent provided you give clear information and an opt-out. The safer default for a small site is: still ask.

Practical advice:

• Use a hosted cookie consent tool if you have any non-essential cookies. CookieYes and Termly both have generous free tiers.
• Use Plausible or Fathom instead of Google Analytics if you'd like to skip the cookie banner entirely. Both are cookie-less analytics that comply with GDPR by default.
• Be honest in the privacy policy. Don't list data you don't actually collect, and don't omit data you do.

Tell Claude:

Generate a privacy policy template for a UK-based small business that uses Plausible analytics (no cookies) and a contact form (we store the message and email address for replies). Don't claim certifications we don't have.

← Part 5 of 8: Build the Website with Claude Code · All parts · Part 7 of 8: Going Live with Your Website →