React SPA SEO Crawlability Boost

Job ID: 40175595

Budget: £20 – £250 GBP

Project Summary
We have a website built with React + Vite + TypeScript, deployed on Netlify.
As a SPA, the site’s “View Page Source” currently shows very little HTML content.
We want a quick, safe SEO improvement that makes the site crawlable and indexable without converting the app or adding SSR.
This task is Option A: add structured, indexable fallback HTML content that is visible to crawlers but hidden once React loads.
Target site:
https://nationalremovalsandstorage.co.uk/

Current Stack
React + TypeScript
Vite
Netlify hosting
React Router
Supabase (used client-side; not required for this task)

Goals (Must Have)
1. Meaningful HTML visible in “View Page Source” on every public page
2. Content must:
Describe services
Include headings and internal links
Be readable and indexable by search engines
3. The fallback content must:
Be visible if JavaScript is disabled
Be hidden automatically once React loads
4. No visual changes for normal users
5. No SEO cloaking or deceptive behavior

Scope of Work
Add a global HTML fallback block to index.html
Include:
Company description
Services list
Internal navigation links
Contact/location text
Add minimal CSS to hide fallback after React hydration
Add a small hook in main.tsx to signal when React has mounted
Validate that:
View Source shows content
Google-friendly structure (H1, H2, lists, links)
No runtime errors
Do not change routing or app architecture

Out of Scope (Explicitly)
No SSR
No Next.js / Remix migration
No build-time prerendering
No paid prerender services
No portal/admin/auth pages

Acceptance Criteria
Open any public URL → View Page Source → see meaningful text
Normal users see no duplicate content or layout shift
Site continues to function as a SPA
Changes deploy cleanly to Netlify production

Deliverables
1. PR with:
Updated index.html
Small change to main.tsx
Optional CSS block
2. Short explanation of what was done and why
3. Screenshot(s) showing View Source contains content