Website · 2026
Solavelle Health Resort
SEO audit, website redesign and AI-assisted build · Client project, shown as Solavelle · 2026
Skilled nursing and rehabilitation in a boutique-hotel setting in Miami. I audited the old site at 44 out of 100, rebuilt it in Astro in three directions, with the White one in English and Spanish, and re-scored it at 80.
This project is shown under a showcase identity to protect the client.
Project story
The project
A client project for a skilled nursing and rehabilitation resort in Miami, shown here as Solavelle so the client stays private. On May 20, 2026 I audited the old site with Claude Code's seo-audit skill: 44 out of 100, with no structured data and no meta description on any of its 107 pages, and about 20 theme-demo pages indexed. The next day I crawled and archived all 141 pages and 235 assets.
I rebuilt it in Astro with Claude Code from that archive, then built three directions, with the White one in English and Spanish for its Miami families. Re-scored on the same rubric on June 25, it reached 80, with every Critical and High audit item fixed. The redesign blueprint sets out the work in twelve parts: what I did, what I used and why.
The identity
I designed three directions on one content structure: White, an editorial layout with magazine-style numbered inner pages, and Black and Gold, which change the type, atmosphere and emphasis over the same content.
Logo design
For this showcase I directed a new identity, Solavelle: a flowing S symbol with a serif wordmark and a widely spaced descriptor, in full, light and icon versions.
Supporting work
I wrote the audit and action plan, a score-comparison report and a proposal in six revisions, each rendered to a branded PDF. In September I added a content model with Zod schemas, a Supabase database with row-level security and Vitest tests, preparing the site for an editor without changing what visitors see.
Tools used
Astro, TypeScript, CSS, HTML, Vercel, Zod, Supabase, PostgreSQL
Tools listed here were used across the project. What each one was used for is set out in the redesign below.
The redesign, in twelve parts
May 20 to June 25, 2026. Original audit score 44 → 80.
A real client project, shown as Solavelle so the client stays private. Dates, tools, counts and scores come from the original work's records.
1. Research and planning
141 pages archived, audited at 44 out of 100
- What I did
- Ran a full SEO audit of the old site on a seven-category weighted rubric, with every finding ranked Critical, High, Medium or Low. It scored 44 out of 100.
- What I used
- Lighthouse, Chrome UX Report field data, Chrome DevTools, BeautifulSoup, Claude Code, Codex
- Why
- It turned the old site's problems into a ranked list of work and a baseline to prove the result.
- What I did
- Crawled and archived the whole old site, every page saved as HTML, text and metadata with its images, fonts and scripts: 141 pages and 235 assets.
- What I used
- Claude Code, site-clone-redesign skill, Codex
- Why
- The rebuild took its copy and photos from the archive, and nothing the business had written was lost.
2. Platform and build
WordPress replaced by a static Astro site
- What I did
- Replaced the WordPress site with a static Astro site: no CMS, no database and no plugins to patch.
- What I used
- Astro 5, @astrojs/sitemap, Claude Code, Codex
- Why
- There is far less to keep secure, the pages are faster, and hosting is simple.
- What I did
- Built three directions, White, Black and Gold, on one content structure, each with its own palette and type.
- What I used
- Astro layouts, CSS design tokens, Claude Code, Codex
- Why
- The client chooses a look without changing content or SEO.
- What I did
- Deployed each direction to its own Vercel address from one build, with a workflow that builds and deploys all three whenever the site changes.
- What I used
- Vercel, a deploy script, GitHub Actions, Claude Code, Codex
- Why
- Every change ships to every version the same way, with no manual step to forget.
3. Pages and content
Ten focused pages, the junk cleared out
- What I did
- Cleared out the junk: about 20 theme-demo pages, three overlapping services listings, duplicate copies of pages, an admin author archive and a 27-post blog from 2017.
- What I used
- The audit's crawl, Claude Code, Codex
- Why
- Search engines spend their time on real pages, and pages stop competing with each other.
- What I did
- Built ten focused pages in each direction from the archive's own copy: home, facility, team, services, all services, rehabilitation, careers, contact, emergency rules and visitation.
- What I used
- Astro, the archive, Claude Code, Codex
- Why
- Families find care, see the facility and call in fewer clicks.
- What I did
- Checked every fact in the copy against the archive and the audit: the city in the address, the main phone line and the fax number each in its own place, and every team bio on its own page.
- What I used
- The archive, the audit's contact data, Claude Code, Codex
- Why
- The same name, address and phone everywhere is a local-search factor, and every fact comes from the business itself.
- What I did
- Put trust signals on the home page: the accreditation and the Five-Star rating, with facts such as the bed count and the hours of therapy each day.
- What I used
- A statistics band on the home page, Claude Code, Codex
- Why
- Credibility for search engines (E-E-A-T) and reassurance for families.
4. Visual design and experience
White, Black and Gold, three ways to look
- What I did
- Designed three directions from the brand: White, an editorial magazine look with Volume, Issue and Chapter markers in bronze on white; Black, in ivory and gold on near-black; and Gold, in gold and cream with emerald.
- What I used
- CSS design tokens, Google Fonts, Claude Code, Codex
- Why
- A distinctive, premium look in place of a stock theme, and three real choices for the client.
- What I did
- Placed the full logo in the header, the mobile menu and the footer, with a transparent footer logo on White and the white wordmark on Gold.
- What I used
- Logo artwork, CSS, Claude Code, Codex
- Why
- The brand reads clearly on every background.
- What I did
- Replaced the autoplay YouTube video with a four-slide photo hero: the headline over crossfading slides, with slide dots.
- What I used
- CSS, Claude Code, Codex
- Why
- It loads far faster and sends no video or ad requests.
- What I did
- Built a mobile drawer that slides in and closes with Escape or a tap outside, and a sticky top bar on every direction that carries the language switch.
- What I used
- CSS, JavaScript, Claude Code, Codex
- Why
- Most families browse on a phone, and the menu and the language stay one tap away.
5. Language (English and Spanish)
The White direction in English and Spanish
- What I did
- Built the full Spanish site for the White direction: ten Spanish pages, with the services, the team and the testimonials translated, and a language switch.
- What I used
- Astro i18n routing, translated content files, Claude Code, Codex
- Why
- The resort is a Miami business, and the site reaches the many Spanish-speaking families it serves.
- What I did
- Chose each visitor's language from the browser's own settings, tested in 15 scenarios.
- What I used
- navigator.languages, JavaScript, Claude Code, Codex
- Why
- A browser set to Spanish arrives in Spanish, without looking for a switch.
- What I did
- Linked every page to its twin with hreflang tags, x-default included, and sized the Spanish menu and headings so long words fit.
- What I used
- hreflang link tags, CSS for Spanish pages, Claude Code, Codex
- Why
- Search engines can match each family with the right language, and long Spanish words fit.
6. Search (SEO)
Its own title and description on every page
- What I did
- Gave every page, in both languages, its own title, description and canonical address, with Open Graph and Twitter card tags.
- What I used
- Astro layouts, Claude Code, Codex
- Why
- Clearer search snippets, more clicks, and clean previews when a page is shared.
- What I did
- Led the home page with a keyword title naming the care, skilled nursing and senior rehabilitation, and the city.
- What I used
- On-page copy, Claude Code, Codex
- Why
- It tells Google exactly what the business is and where.
- What I did
- Produced a new robots.txt with a Sitemap line and no crawl delay, where the old one let a crawler read one page every 30 seconds, and generated a sitemap for each direction.
- What I used
- robots.txt, @astrojs/sitemap, Claude Code, Codex
- Why
- Search engines crawl the whole site quickly.
7. Structured data
Structured data score 8 → 70
- What I did
- Added MedicalBusiness JSON-LD to every page of every direction: the name, postal address, map coordinates, medical specialty and area served.
- What I used
- JSON-LD (schema.org), Claude Code, Codex
- Why
- Search engines read the business's facts without guessing, which supports local results and the map pack.
8. AI search
AI search score 30 → 82
- What I did
- Published llms.txt, a plain summary of the business and its care for AI assistants.
- What I used
- llms.txt, Claude Code, Codex
- Why
- AI assistants can read an accurate summary of the business.
- What I did
- Set explicit allow rules for GPTBot, ClaudeBot and PerplexityBot in robots.txt.
- What I used
- robots.txt, Claude Code, Codex
- Why
- The named AI crawlers are allowed to read the whole site.
9. Speed
Images score 25 → 92
- What I did
- Rebuilt the site as static pages, without the WordPress theme, its sliders and plugins, or the autoplay video that made more than 50 third-party requests on the home page.
- What I used
- Astro static build, Claude Code, Codex
- Why
- Faster pages keep visitors from waiting: Performance went from 72 to 85.
- What I did
- Ran every content image through one pipeline: WebP, responsive sizes, and a width and height on every image. The badges went from 96 kB to 3 kB, and the photographs came out 50 to 75% smaller.
- What I used
- Astro image pipeline, Claude Code, Codex
- Why
- Faster loading and no layout shift as the page arrives.
10. Accessibility
Skip link, labels and focus on every page
- What I did
- Built to the WCAG 2.1 AA basics: a skip link, a main landmark, labeled form fields, a titled map, visible keyboard focus and pinch zoom allowed.
- What I used
- Semantic HTML, ARIA labels, CSS focus styles, Claude Code, Codex
- Why
- Easier for older visitors and for keyboard and screen-reader users.
- What I did
- Wrote alt text for the images and turned the motion off for visitors who ask for reduced motion.
- What I used
- Alt attributes, prefers-reduced-motion, Claude Code, Codex
- Why
- Screen readers describe the photographs, and motion-sensitive visitors get a still page.
11. Privacy and security
No ad cookies or video trackers on load
- What I did
- Removed the autoplay YouTube hero, and with it the DoubleClick advertising cookies and the third-party requests it fired the moment the home page opened.
- What I used
- Self-hosted photo slides, Claude Code, Codex
- Why
- Visitors are not tracked by an ad network for opening the home page.
- What I did
- Replaced WordPress with static files: no login page, no database, no plugins, and no server or CMS version announced in the page.
- What I used
- Astro static build, Claude Code, Codex
- Why
- It removes the most common ways a small business's site is attacked.
- What I did
- Served every page over HTTPS with HSTS.
- What I used
- Vercel, Claude Code, Codex
- Why
- Browsers are told to connect only over HTTPS.
12. Testing and proof
Re-scored 44 → 80 on the same rubric
- What I did
- Re-scored the White build on the same seven-category rubric: 44 to 80, with every Critical and High finding resolved.
- What I used
- The audit rubric, Claude Code, Codex
- Why
- An apples-to-apples result the client and the portfolio can stand behind.
- What I did
- Tested the browser-language choice in 15 scenarios and ran a dry build of each direction, checking its pages and its sitemap, before deploying.
- What I used
- Scripted checks, staging builds, Claude Code, Codex
- Why
- Problems are caught before the client sees them.
Original audit score by category, before and after Category Before After Technical SEO 58 80 Content 42 74 On-page SEO 40 88 Structured data 8 70 Performance 72 85 Images 25 92 AI search 30 82 Overall 44 80 Scores use the audit's seven-category SEO rubric (Technical 25%, Content 25%, On-page 20%, Structured data 10%, Performance 10%, Images 5%, AI search 5%). It is not a Google score.
Before and after
The original site as its crawl archive recorded it, beside the redesigned pages captured from the live demo. Client identities were replaced for this public showcase; the original layout is preserved.
Home
The old home page autoplayed a YouTube video in its hero on every visit, which set cookies before visitors agreed. The redesign has no video and makes no third-party requests on load.
Our Facility
General Services
The old page, like every page of the old site, had no meta description and no structured data; the redesign gives every page a title, a description and structured data.
Rehabilitation
Careers
Contact
The work
