Website · 2026
Valestra Nursing and Rehabilitation
SEO audit, website redesign and AI-assisted build · Client project, shown as Valestra · 2026
Post-acute nursing, rehabilitation and respiratory care in Miami. I audited the old site at 42 out of 100, rebuilt it in Astro in English and Spanish, and re-scored it at 83 six days later.
This project is shown under a showcase identity to protect the client.
Project story
The project
A client project for a post-acute nursing and rehabilitation facility in Miami, shown here as Valestra so the client stays private. On July 2, 2026 I crawled and archived the old site (87 pages, 171 assets) and audited it with Claude Code's seo-audit skill, Lighthouse and Playwright. It scored 42 out of 100: 79 of its 101 sitemap URLs were junk, nine menu pages were empty, and the mobile home page took 9.8 seconds to load its main image.
I rebuilt it in Astro with Claude Code the same day, from the archive's own copy and photographs, and kept improving it for six days: privacy controls, Spanish for its Miami families, structured data and security headers. Re-scored on the same seven-category rubric on July 8, it reached 83. The redesign blueprint sets out the work in twelve parts: what I did, what I used and why.
The identity
I designed four directions on one content structure: Red, Gold, Gilt and Crimson. Each is its own layout and set of design tokens over the same pages, content and search work, so the business could choose a look without changing anything else.
Logo design
For this showcase I directed a new identity, Valestra: a botanical symbol of rising leaves with a serif wordmark, in full, light and icon versions, with Spanish lockups for a Miami business. The live demo carries it in both languages.
Supporting work
Alongside the site I wrote the audit report, a visual SEO briefing, an action plan, a privacy report and the proposal. Before consent, the old site contacted 11 outside host families; on the rebuild the pages tested made no third-party requests on load, with self-hosted fonts, a static map and a consent banner.
Tools used
Astro, TypeScript, CSS, HTML, Vercel
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
July 2 to 8, 2026. Original audit score 42 → 83.
A real client project, shown as Valestra so the client stays private. Dates, tools, counts and scores come from the original work's records.
1. Research and planning
87 pages archived, audited at 42 out of 100
- What I did
- Crawled the old site and archived every public page as HTML, text and metadata, with its images, fonts and scripts: 87 pages and 171 assets, with no errors.
- What I used
- Claude Code, site-clone-redesign skill, Codex
- Why
- Nothing the business had written was lost: the rebuild took its copy and photos from the archive, and the archive set a fixed starting point to measure against.
- What I did
- Ran a full SEO audit: six specialist reviews (technical, content, schema, sitemap, performance and visual) weighted into one score, with every finding ranked Critical, High, Medium or Low. The old site scored 42 out of 100.
- What I used
- Claude Code seo-audit skill, Lighthouse 12.8, Playwright, Codex
- Why
- It turned "the site feels old" into a ranked list of work, set the scope of the rebuild and gave a baseline to prove the result.
- What I did
- Built a repeatable tracker test: a clean browser, no clicks, and a record of which ad and video requests fire before a visitor consents. It ran on the old site and on the new one.
- What I used
- Chrome DevTools, Playwright, Claude Code, Codex
- Why
- A plain pass or fail that any developer can rerun, with dated before and after results.
- What I did
- Wrote the proposal with the build's details measured page by page, and set it as a branded PDF.
- What I used
- Python, headless Chrome, Claude Code, Codex
- Why
- The client sees exactly what was built, counted on the build itself, and the PDF is generated the same way every time.
2. Platform and build
WordPress replaced by a static Astro site
- What I did
- Replaced the WordPress site with a static Astro site on Vercel: no CMS, no database and no plugins to patch.
- What I used
- Astro 5, Vercel, Claude Code, Codex
- Why
- There is far less to keep secure, the pages are much faster, and hosting is simple and low-cost.
- What I did
- Built four color directions, Red, Gold, Gilt and Crimson, on one shared content structure, each with its own design tokens.
- What I used
- Astro layouts, CSS design tokens, Claude Code, Codex
- Why
- The client chooses a look without touching content or SEO, and one change reaches every version.
- What I did
- Set up a script that builds each direction, gives it its own sitemap and deploys it to its own Vercel address.
- What I used
- Bash, Vercel CLI, Claude Code, Codex
- Why
- Every change ships to every version the same way, with no manual step to forget.
3. Pages and content
Nine real pages and a family FAQ
- What I did
- Kept only the real pages: 79 of the 101 addresses in the old sitemap were attachment pages, theme demos and archives, and the new site leaves them behind.
- What I used
- The audit's crawl, Claude Code, Codex
- Why
- Search engines spend their time on real pages, and visitors never land on a placeholder.
- What I did
- Built nine real pages from the archive's own copy, with its character encoding cleaned: Home, Our Facility, Our Team, Services, List of Services, Rehabilitation, Respiratory, Careers and Contact.
- What I used
- Astro, the archive, Claude Code, Codex
- Why
- Families find care, see the facility and call or book a tour in fewer clicks, and every word comes from the business itself.
- What I did
- Wrote a seven-question family FAQ in English and Spanish, on insurance, care, visiting and tours. The Medicare and Medicaid answer was checked against the federal CMS provider record.
- What I used
- CMS Care Compare data, Astro, Claude Code, Codex
- Why
- It answers what families ask before they call, marked up so search engines and AI tools can read it.
- What I did
- Added visitor and legal pages to every footer, in both languages: Visitor Policy, Emergency Rules, Privacy, Cookie Policy and Do Not Sell or Share.
- What I used
- Astro, Claude Code, Codex
- Why
- The information and disclosures families and regulators expect from a healthcare provider.
4. Visual design and experience
Royal red and gold, with an image hero
- What I did
- Took the brand system from the logo: royal red with gold details, Fondamento headings and gold frames in the Crimson direction, and the full logo in the header, the mobile menu and the footer.
- What I used
- CSS design tokens, Fontsource, Claude Code, Codex
- Why
- A distinctive, premium look that belongs to the brand instead of a stock theme.
- What I did
- Replaced the autoplay YouTube hero with photo slides: a headline, tour and call buttons, slide controls, and a pause when the pointer rests on it.
- What I used
- CSS, JavaScript, Claude Code, Codex
- Why
- It loads far faster, sends no video or ad requests, and puts the two main actions first.
- What I did
- Added motion with care: crossfading slides, scroll reveals, a sticky header and a slide-in mobile drawer, all switched off for visitors who ask for reduced motion.
- What I used
- CSS transitions, prefers-reduced-motion, Claude Code, Codex
- Why
- The site feels alive without hiding content or bothering motion-sensitive visitors.
- What I did
- Kept the phone number and the language switch in a sticky bar, one tap away on every page, in three zones that rearrange on a phone.
- What I used
- CSS, Claude Code, Codex
- Why
- Calling and switching language are the two actions families use most, and most of them browse on a phone.
5. Language (English and Spanish)
Every direction in English and Spanish
- What I did
- Built the full Spanish site in all four directions: every page and menu, the visitor and legal pages, the cookie banner and a language switch.
- What I used
- Astro i18n routing, translated content files, Claude Code, Codex
- Why
- The facility is a Miami business, and the site reaches the many Spanish-speaking families it serves.
- What I did
- Linked every English page to its Spanish twin with hreflang tags, x-default included.
- What I used
- hreflang link tags, Claude Code, Codex
- Why
- Search engines can match each family with the page in its own language.
6. Search (SEO)
A unique title and one H1 on every page
- What I did
- Gave every page its own title, description and canonical address, with Open Graph and Twitter 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
- Gave every page exactly one H1, 28 of 28 pages in each direction: the hero's other headlines became paragraphs styled the same way, so visitors see no change.
- What I used
- Astro, a computed-style check in a real browser, Claude Code, Codex
- Why
- One clear topic per page tells search engines what each page is about.
- What I did
- Generated the sitemap and robots.txt for every direction.
- What I used
- @astrojs/sitemap, Claude Code, Codex
- Why
- Search engines find and crawl every real page.
7. Structured data
Structured data score 35 → 90
- What I did
- Produced one JSON-LD graph for the whole site: the business as a MedicalBusiness with its address, map coordinates, logo, founding date, Facebook page and federal provider identifier; a WebSite; breadcrumbs on every page; the care team as people; and FAQ markup that matches the visible FAQ.
- What I used
- JSON-LD (schema.org), TypeScript, Claude Code, Codex
- Why
- Search engines read the business's facts without guessing, which supports the map pack, breadcrumbs and FAQ results.
- What I did
- Checked that the graph parses on every page of every direction, 28 pages in each of four.
- What I used
- Python, Claude Code, Codex
- Why
- Structured data only counts when it is valid everywhere.
8. AI search
AI search score 35 → 85
- What I did
- Published llms.txt, a plain summary of the business for AI assistants, and kept GPTBot, ClaudeBot and PerplexityBot allowed in robots.txt.
- What I used
- llms.txt, robots.txt, Claude Code, Codex
- Why
- AI assistants can read an accurate summary of the business.
- What I did
- Wrote the FAQ as short question-and-answer passages, marked up as an FAQ page.
- What I used
- FAQPage markup, Claude Code, Codex
- Why
- Short, complete answers an assistant can read.
9. Speed
Mobile home page 39 → 93 in Lighthouse
- What I did
- Left the heavy code behind: 32 render-blocking stylesheets, two slider frameworks and the YouTube embed, with the hero image loading at high priority.
- What I used
- Astro static build, fetchpriority, Claude Code, Codex
- Why
- The mobile home page went from 39 to 93 in Lighthouse and its main image from 9.8 to 2.7 seconds; Services reached 97 and Contact 98. Faster pages keep visitors from waiting.
- What I did
- Ran every image through one pipeline: WebP, responsive sizes, width and height on every image, its native ratio kept, lazy loading below the fold.
- What I used
- Astro image pipeline, Claude Code, Codex
- Why
- Faster loading and no layout shift: the home page's Cumulative Layout Shift is 0.
- What I did
- Self-hosted the fonts, with only the weights the design uses.
- What I used
- Fontsource, Claude Code, Codex
- Why
- Text appears sooner, and the page makes no request to Google.
10. Accessibility
198 of 198 images with alt text
- What I did
- Built to the WCAG 2.1 AA basics: a skip link, a main landmark, labeled form fields, visible keyboard focus, pinch zoom allowed and contrast set for older readers.
- What I used
- Semantic HTML, CSS, Claude Code, Codex
- Why
- Easier for older visitors and for keyboard and screen-reader users.
- What I did
- Gave all 198 images alt text, descriptive on the photographs and empty on the decorative ornaments, and a width and height on every one.
- What I used
- An HTML sweep in Python, Claude Code, Codex
- Why
- Screen readers describe what matters and skip what is only decoration.
- What I did
- Made the closed mobile drawer inert and gave the map image a label.
- What I used
- The inert attribute, ARIA labels, Claude Code, Codex
- Why
- Keyboard focus never lands in a hidden menu, and every element says what it is.
11. Privacy and security
11 outside host families before consent → 0
- What I did
- Added cookie consent that really blocks tracking: necessary cookies only by default; Accept, Reject and Manage; a preferences link in every footer; the banner in Spanish too.
- What I used
- Vanilla CookieConsent 3, Claude Code, Codex
- Why
- No tracking runs before the visitor agrees.
- What I did
- Replaced the embedded Google Map with a self-hosted map image that opens Google Maps only when clicked.
- What I used
- SVG, Claude Code, Codex
- Why
- The pages make no request to Google on load.
- What I did
- Tested it end to end: rejecting leaves one necessary cookie, the choice survives a reload, and the pages tested made no third-party requests on load. The old site contacted 11 outside host families before any consent.
- What I used
- Playwright, Claude Code, Codex
- Why
- Proof that the tracker problem found in research is gone.
- What I did
- Sent six security headers with every page: HSTS, a Content Security Policy, anti-framing, no MIME sniffing, a referrer policy and a permissions policy.
- What I used
- vercel.json headers, Claude Code, Codex
- Why
- It protects visitors from clickjacking and injected content, and it counts toward technical SEO.
12. Testing and proof
Re-scored 42 → 83 on the same rubric
- What I did
- Swept every built page for one H1, valid JSON-LD, unique titles, alt text and image sizes: 28 pages in each of the four directions.
- What I used
- Python HTML parser, Claude Code, Codex
- Why
- Problems are caught before the client sees them.
- What I did
- Took desktop and mobile screenshots, read the browser console and checked the status codes and headers of all four live sites.
- What I used
- Playwright, curl, Claude Code, Codex
- Why
- Every claim about the build has evidence behind it.
- What I did
- Re-scored the new site on the same seven-category rubric, with Lighthouse measured on the live builds: 42 to 83 in six days.
- What I used
- The audit rubric, Lighthouse, Claude Code, Codex
- Why
- An apples-to-apples result the client and the portfolio can stand behind.
Original audit score by category, before and after Category Before After Technical SEO 60 90 Content 24 65 On-page SEO 45 88 Structured data 35 90 Performance 39 93 Images 55 90 AI search 35 85 Overall 42 83 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 copy showed broken characters where apostrophes belonged; the rebuild repaired the encoding.
Rehabilitation
Respiratory
Contact
The old contact page embedded Google Maps; the redesign shows its own map and opens Google Maps only on a click.
The work
