Install any skill in seconds. Free to start, no credit card required.
Get Started Free →Technical SEO auditor and fixer. Runs Lighthouse/PageSpeed audits on websites or local dev servers, analyzes SEO/performance/accessibility scores, and automatically implements fixes for meta tags, structured data, Core Web Vitals, and accessibility issues.
| Test case | Without → With | Effect | Δ tokens | Δ turns |
|---|---|---|---|---|
| case-02 | ✗→✓ | ▲ Improved | 58% | 0% |
| case-03 | ✗→✓ | ▲ Improved | 231% | 0% |
| case-05 | ✗→✓ | ▲ Improved | 157% | 0% |
| case-13 | ✗→✓ | ▲ Improved | 139% | 0% |
| case-20 | ✓→✓ | = Same ✓ | 117% | 0% |
AI-powered SEO optimization skill that audits websites and automatically implements fixes.
Use Roier SEO when:
Key features:
Use alternatives instead:
After installing the skill, install the audit dependencies:
bashcd ~/.claude/skills/roier-seo/scripts npm install
For a live website:
bashnode ~/.claude/skills/roier-seo/scripts/audit.js https://example.com
For a local dev server (must be running):
bashnode ~/.claude/skills/roier-seo/scripts/audit.js http://localhost:3000
Output formats:
bash# JSON output (default, for programmatic use) node ~/.claude/skills/roier-seo/scripts/audit.js https://example.com # Human-readable summary node ~/.claude/skills/roier-seo/scripts/audit.js https://example.com --output=summary # Save to file node ~/.claude/skills/roier-seo/scripts/audit.js https://example.com --save=results.json
The audit returns scores (0-100) for five categories:
| Category | Description | Weight | |----------|-------------|--------| | Performance | Page load speed, Core Web Vitals | High | | Accessibility | WCAG compliance, screen reader support | High | | Best Practices | Security, modern web standards | Medium | | SEO | Search engine optimization, crawlability | High | | PWA | Progressive Web App compliance | Low |
html<!-- Bad --> <title>Home</title> <!-- Good --> <title>Primary Keyword - Secondary Keyword | Brand Name</title>
Rules:
html<meta name="description" content="Compelling description with keywords. 150-160 characters that encourages clicks from search results.">
Rules:
html<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <html lang="en">
html<meta property="og:title" content="Page Title"> <meta property="og:description" content="Page description"> <meta property="og:image" content="https://example.com/image.jpg"> <meta property="og:url" content="https://example.com/page"> <meta property="og:type" content="website"> <meta property="og:site_name" content="Brand Name">
html<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="Page Title"> <meta name="twitter:description" content="Page description"> <meta name="twitter:image" content="https://example.com/image.jpg">
html<link rel="canonical" href="https://example.com/canonical-page">
html<!-- Allow indexing (default) --> <meta name="robots" content="index, follow"> <!-- Prevent indexing (for staging, admin pages) --> <meta name="robots" content="noindex, nofollow">
html<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "WebSite", "name": "Site Name", "url": "https://example.com", "potentialAction": { "@type": "SearchAction", "target": "https://example.com/search?q={search_term_string}", "query-input": "required name=search_term_string" } } </script>
html<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Organization", "name": "Company Name", "url": "https://example.com", "logo": "https://example.com/logo.png", "sameAs": [ "https://twitter.com/company", "https://linkedin.com/company/company" ] } </script>
html<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ {"@type": "ListItem", "position": 1, "name": "Home", "item": "https://example.com"}, {"@type": "ListItem", "position": 2, "name": "Category", "item": "https://example.com/category"}, {"@type": "ListItem", "position": 3, "name": "Page"} ] } </script>
html<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "headline": "Article Title", "author": {"@type": "Person", "name": "Author Name"}, "datePublished": "2024-01-15", "dateModified": "2024-01-20", "image": "https://example.com/article-image.jpg", "publisher": { "@type": "Organization", "name": "Publisher Name", "logo": {"@type": "ImageObject", "url": "https://example.com/logo.png"} } } </script>
html<!-- Add width/height to prevent CLS --> <img src="image.jpg" alt="Description" width="800" height="600"> <!-- Add lazy loading --> <img src="image.jpg" alt="Description" loading="lazy"> <!-- Use modern formats --> <picture> <source srcset="image.avif" type="image/avif"> <source srcset="image.webp" type="image/webp"> <img src="image.jpg" alt="Description"> </picture>
html<!-- Preload critical fonts --> <link rel="preload" href="/fonts/main.woff2" as="font" type="font/woff2" crossorigin>
css@font-face { font-family: 'Custom Font'; src: url('/fonts/custom.woff2') format('woff2'); font-display: swap; }
html<!-- Preconnect to critical third-party origins --> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://cdn.example.com"> <!-- DNS prefetch for non-critical origins --> <link rel="dns-prefetch" href="https://analytics.example.com"> <!-- Preload critical resources --> <link rel="preload" href="/critical.css" as="style">
html<!-- Good (descriptive) --> <img src="photo.jpg" alt="Team members collaborating in the office"> <!-- Good (decorative) --> <img src="decoration.jpg" alt="" role="presentation">
html<label for="email">Email Address</label> <input type="email" id="email" name="email">
html<a href="#main-content" class="skip-link">Skip to main content</a> <style> .skip-link { position: absolute; left: -9999px; } .skip-link:focus { left: 0; top: 0; z-index: 9999; background: #000; color: #fff; padding: 8px 16px; } </style>
html<!-- Icon button needs aria-label --> <button aria-label="Close menu"> <svg>...</svg> </button>
tsx// app/layout.tsx import type { Metadata } from 'next' export const metadata: Metadata = { title: { default: 'Site Name', template: '%s | Site Name' }, description: 'Site description', openGraph: { title: 'Site Name', description: 'Site description', url: 'https://example.com', siteName: 'Site Name', type: 'website', }, }
jsximport Head from 'next/head'; export default function Page() { return ( <> <Head> <title>Page Title | Brand</title> <meta name="description" content="Page description" /> <link rel="canonical" href="https://example.com/page" /> </Head> <main>...</main> </> ); }
jsximport { Helmet } from 'react-helmet'; function Page() { return ( <> <Helmet> <title>Page Title | Brand</title> <meta name="description" content="Page description" /> </Helmet> <main>...</main> </> ); }
vue<script setup> useHead({ title: 'Page Title | Brand', meta: [ { name: 'description', content: 'Page description' } ], link: [ { rel: 'canonical', href: 'https://example.com/page' } ] }) </script>
vue<script setup> useSeoMeta({ title: 'Page Title | Brand', description: 'Page description', ogTitle: 'Page Title', ogDescription: 'Page description', ogImage: 'https://example.com/og-image.jpg' }) </script>
Run the audit script on the target URL:
bashnode ~/.claude/skills/roier-seo/scripts/audit.js <URL>
Check package.json dependencies and framework-specific files.
Use the fix patterns above, adapted to the user's framework.
Run the audit again to verify improvements.
v1.0.0 (January 2026)
Other measured skills in the registry, with their headline benchmark lift.