Quality

SEO and metadata

Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked "fix SEO" or "why is this not indexed".

fe-seo-metadataevery web project10 rules93 tokens always loaded, 951 tokens when used, 1689 tokens in references on demand.

Install

init installs this skill when the project uses every web project. Pick your agent to see where its files land.

npx github:dawidolko/frontend-skills init

Not tested yet with this runner. npx and pnpm dlx are tested; if this one fails, use one of them.

Without --agents, init finds the agents from what the project already has, and asks when it finds none:

How init finds each of the 17 agents

Agent	Found by
Claude Code	`CLAUDE.md` `.claude` `CLAUDE.local.md`
OpenAI Codex	`.codex` `AGENTS.override.md`
Cursor	`.cursor` `.cursorrules`
GitHub Copilot	`.github/copilot-instructions.md` `.github/instructions` `.github/skills` `.github/prompts`
Gemini CLI	`GEMINI.md` `.gemini`
Antigravity CLI	`.agents/rules` `.agent/rules`
Devin / Windsurf	`.devin` `.windsurf` `.windsurfrules`
OpenCode	`opencode.json` `opencode.jsonc` `.opencode`
Cline	`.clinerules` `.cline`
Zed	`.rules` `.zed`
JetBrains Junie	`.junie`
Kiro	`.kiro`
Augment	`.augment` `.augment-guidelines`
Trae	`.trae`
Continue	`.continue`
Amazon Q Developer	`.amazonq`
Aider	`.aider.conf.yml` `CONVENTIONS.md`

Where fe-seo-metadata lands for Claude Code

.claude/skills/fe-seo-metadata/SKILL.mdskill
.claude/skills/fe-seo-metadata/references/seo.mdskill
.claude/rules/fe-seo-metadata.mdrule file
CLAUDE.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Planned by the installer itself for the example React project in the repository.

.claude/rules/fe-seo-metadata.md

---
paths:
  - "**/*.html"
  - "**/*.jsx"
  - "**/*.tsx"
  - "**/*.vue"
  - "**/*.svelte"
  - "**/*.astro"
  - "**/robots.txt"
  - "**/sitemap*.xml"
---

# SEO and metadata (frontend-skills)

Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked "fix SEO" or "why is this not indexed".

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.claude/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for OpenAI Codex

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

OpenAI Codex has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

The real file

Where fe-seo-metadata lands for Cursor

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
.cursor/rules/fe-seo-metadata.mdcrule file
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Planned by the installer itself for the example React project in the repository.

.cursor/rules/fe-seo-metadata.mdc

---
description: Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked "fix SEO" or "why is this not indexed".
globs: **/*.html, **/*.jsx, **/*.tsx, **/*.vue, **/*.svelte, **/*.astro, **/robots.txt, **/sitemap*.xml
alwaysApply: false
---

# SEO and metadata (frontend-skills)

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.agents/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for GitHub Copilot

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
.github/instructions/fe-seo-metadata.instructions.mdrule file
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Planned by the installer itself for the example React project in the repository.

.github/instructions/fe-seo-metadata.instructions.md

---
applyTo: "**/*.html,**/*.jsx,**/*.tsx,**/*.vue,**/*.svelte,**/*.astro,**/robots.txt,**/sitemap*.xml"
description: "Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked \"fix SEO\" or \"why is this not indexed\"."
---

# SEO and metadata (frontend-skills)

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.agents/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for Gemini CLI

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
GEMINI.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Gemini CLI: Gemini CLI was replaced by Antigravity CLI for unpaid tiers on 2026-06-18; choose "antigravity" too if you use it.

Gemini CLI has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

GEMINI.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

The real file

Where fe-seo-metadata lands for Antigravity CLI

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
.agents/rules/fe-seo-metadata.mdrule file
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Planned by the installer itself for the example React project in the repository.

.agents/rules/fe-seo-metadata.md

---
trigger: glob
globs: "**/*.html, **/*.jsx, **/*.tsx, **/*.vue, **/*.svelte, **/*.astro, **/robots.txt, **/sitemap*.xml"
description: "Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked \"fix SEO\" or \"why is this not indexed\"."
---

# SEO and metadata (frontend-skills)

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.agents/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for Devin / Windsurf

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
.devin/rules/fe-seo-metadata.mdrule file
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Devin / Windsurf: Devin CLI also reads .cursor/rules; with Cursor chosen too, the CLI sees both rule files of a skill.

Planned by the installer itself for the example React project in the repository.

.devin/rules/fe-seo-metadata.md

---
trigger: glob
globs: "**/*.html,**/*.jsx,**/*.tsx,**/*.vue,**/*.svelte,**/*.astro,**/robots.txt,**/sitemap*.xml"
---

# SEO and metadata (frontend-skills)

Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked "fix SEO" or "why is this not indexed".

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.agents/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for OpenCode

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

OpenCode has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

The real file

Where fe-seo-metadata lands for Cline

.claude/skills/fe-seo-metadata/SKILL.mdskill
.claude/skills/fe-seo-metadata/references/seo.mdskill
.clinerules/fe-seo-metadata.mdrule file
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Cline: If .clinerules is a single file rather than a folder, Cline rule files are not written; skills still are.

Planned by the installer itself for the example React project in the repository.

.clinerules/fe-seo-metadata.md

---
paths:
  - "**/*.html"
  - "**/*.jsx"
  - "**/*.tsx"
  - "**/*.vue"
  - "**/*.svelte"
  - "**/*.astro"
  - "**/robots.txt"
  - "**/sitemap*.xml"
---

# SEO and metadata (frontend-skills)

Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked "fix SEO" or "why is this not indexed".

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.claude/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for Zed

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
CLAUDE.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Zed: Zed reads only the first instruction file of its list; the block is placed in that file.

Zed has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

CLAUDE.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

The real file

Where fe-seo-metadata lands for JetBrains Junie

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

JetBrains Junie: Junie reads .agents/skills only in a trusted project.

JetBrains Junie has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

The real file

Where fe-seo-metadata lands for Kiro

.kiro/skills/fe-seo-metadata/SKILL.mdskill
.kiro/skills/fe-seo-metadata/references/seo.mdskill
.kiro/steering/fe-seo-metadata.mdrule file
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Planned by the installer itself for the example React project in the repository.

.kiro/steering/fe-seo-metadata.md

---
inclusion: fileMatch
fileMatchPattern: ["**/*.html", "**/*.jsx", "**/*.tsx", "**/*.vue", "**/*.svelte", "**/*.astro", "**/robots.txt", "**/sitemap*.xml"]
---

# SEO and metadata (frontend-skills)

Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked "fix SEO" or "why is this not indexed".

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.kiro/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for Augment

.agents/skills/fe-seo-metadata/SKILL.mdskill
.agents/skills/fe-seo-metadata/references/seo.mdskill
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Augment has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

The real file

Where fe-seo-metadata lands for Trae

.trae/skills/fe-seo-metadata/SKILL.mdskill
.trae/skills/fe-seo-metadata/references/seo.mdskill
.trae/rules/fe-seo-metadata.mdrule file
AGENTS.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Trae: Trae reads AGENTS.md only after it is enabled in its settings.

Planned by the installer itself for the example React project in the repository.

.trae/rules/fe-seo-metadata.md

---
description: "Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked \"fix SEO\" or \"why is this not indexed\"."
globs: **/*.html,**/*.jsx,**/*.tsx,**/*.vue,**/*.svelte,**/*.astro,**/robots.txt,**/sitemap*.xml
alwaysApply: false
---

# SEO and metadata (frontend-skills)

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.trae/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for Continue

.frontend-skills/skills/fe-seo-metadata/SKILL.mdskill
.frontend-skills/skills/fe-seo-metadata/references/seo.mdskill
.continue/rules/fe-seo-metadata.mdrule file

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Planned by the installer itself for the example React project in the repository.

.continue/rules/fe-seo-metadata.md

---
name: "SEO and metadata"
description: "Gets pages found and shared correctly - titles, meta descriptions, canonical URLs, robots and noindex, status codes, sitemaps, hreflang, Open Graph and JSON-LD structured data, with the metadata API of Next.js, Nuxt, Astro, SvelteKit and Angular. Use when adding a page or route, a layout head, social previews, structured data, i18n URLs, or when asked \"fix SEO\" or \"why is this not indexed\"."
globs: ["**/*.html", "**/*.jsx", "**/*.tsx", "**/*.vue", "**/*.svelte", "**/*.astro", "**/robots.txt", "**/sitemap*.xml"]
alwaysApply: false
---

# SEO and metadata (frontend-skills)

- Every page has its own title, topic first and site name last (seo/title-unique).
- Every indexable page has its own meta description (seo/meta-description).
- One absolute `rel="canonical"` per page, without a fragment (seo/canonical-valid).
- No `noindex` on pages that should rank; set robots per environment from configuration (seo/indexable).
- Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
- hreflang uses valid codes (`en-GB`, not `en_UK`), absolute URLs, every version listed, plus `x-default` (seo/hreflang-valid).
- JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
- Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
- Links are `<a href>` with real URLs and descriptive text; never script-only links (a11y/link-is-link).
- Metadata, canonical and robots are in the server HTML, not added by client script.
- Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Before larger changes, read the full skill: `.frontend-skills/skills/fe-seo-metadata/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

The real file

Where fe-seo-metadata lands for Amazon Q Developer

.frontend-skills/skills/fe-seo-metadata/SKILL.mdskill
.frontend-skills/skills/fe-seo-metadata/references/seo.mdskill
.amazonq/rules/frontend-skills.mdinstruction block

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Amazon Q Developer: Amazon Q Developer IDE plugins reach end of support on 2027-04-30; AWS points to Kiro.

Amazon Q Developer has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

.amazonq/rules/frontend-skills.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

### Skills

- `fe-seo-metadata` (SEO and metadata): when editing `**/*.html`, `**/*.jsx`, `**/*.tsx`, `**/*.vue`, `**/*.svelte`, `**/*.astro`, `**/robots.txt`, `**/sitemap*.xml`, first read `.frontend-skills/skills/fe-seo-metadata/SKILL.md`.

The real file

Where fe-seo-metadata lands for Aider

.frontend-skills/skills/fe-seo-metadata/SKILL.mdskill
.frontend-skills/skills/fe-seo-metadata/references/seo.mdskill
CONVENTIONS.mdinstruction block
.aider.conf.ymlconfig

For every agent also: .frontend-skills/profile.json, .frontend-skills/lessons.md and .frontend-skills/install.json.

Aider has no rule files scoped to file types; it reads the skills and the instruction block.

Planned by the installer itself for the example React project in the repository.

CONVENTIONS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

### Skills

- `fe-seo-metadata` (SEO and metadata): when editing `**/*.html`, `**/*.jsx`, `**/*.tsx`, `**/*.vue`, `**/*.svelte`, `**/*.astro`, `**/robots.txt`, `**/sitemap*.xml`, first read `.frontend-skills/skills/fe-seo-metadata/SKILL.md`.

The real file

How to use it

Once installed, the agent loads the skill by itself when a task matches its description. You can also ask for it in your own words, for example:

Phrases from the skill description that make the agent pick it:

fix SEO
why is this not indexed

And to check and fix the work:

Use the fe-seo-metadata skill on this file.
Run the front-end audit on what I changed and fix everything serious.
Explain seo/title-unique and fix it here.

Rules it teaches

seo/title-unique
Each page has its own descriptive title, page topic first and site name last, in the page's language.
minormanual
seo/meta-description
Each indexable page has its own meta description that summarises that page.
moderatestatic
seo/canonical-valid
A page has at most one rel="canonical", in the head, with an absolute URL of an indexable page and no fragment.
moderatestatic
seo/indexable
Pages meant to rank are crawlable and carry no noindex (meta robots or X-Robots-Tag) in production.
seriousbrowser
seo/http-status
Missing pages return 404 or 410, moved pages 301 or 308, and a client-rendered error view is not served with 200.
moderatebrowser
seo/hreflang-valid
hreflang values are ISO 639-1 language codes with an optional script and ISO 3166-1 region (or x-default), linking absolute URLs.
moderatestatic
seo/jsonld-valid
Every JSON-LD block is valid JSON with "@context" "https://schema.org" and a schema.org @type.
moderatestatic
seo/jsonld-type-supported
Structured data for rich results uses types in Google's current search gallery, not retired ones such as FAQPage or HowTo.
minorstatic
seo/og-absolute-url
Open Graph and social image and URL tags (og:image, og:url, twitter:image) use absolute https URLs.
minorstatic
a11y/link-is-link
An <a> is a real link with an href; an action is a <button>, never <a> without href, href="#" or javascript:.
seriousstaticWCAG 2.1.1, 4.1.2

The rule digest

This part is copied into each agent's scoped rule file, so it stands on its own:

Every page has its own title, topic first and site name last (seo/title-unique).
Every indexable page has its own meta description (seo/meta-description).
One absolute rel="canonical" per page, without a fragment (seo/canonical-valid).
No noindex on pages that should rank; set robots per environment from configuration (seo/indexable).
Missing pages return 404, moved pages 301 or 308; no soft 404s (seo/http-status).
hreflang uses valid codes (en-GB, not en_UK), absolute URLs, every version listed, plus x-default (seo/hreflang-valid).
JSON-LD is valid JSON with the schema.org context, describes only visible content, and uses supported types (seo/jsonld-valid, seo/jsonld-type-supported).
Social tags use absolute https URLs for images and URLs (seo/og-absolute-url).
Links are <a href> with real URLs and descriptive text; never script-only links (a11y/link-is-link).
Metadata, canonical and robots are in the server HTML, not added by client script.
Never claim a ranking result; say what was fixed and how to verify it in Search Console.

Steps the agent follows

Find where the head is built: root layout plus per-route metadata (Next.js metadata/generateMetadata, Nuxt useSeoMeta, Astro layout props, SvelteKit <svelte:head>, Angular Title/Meta and route title).
Set defaults once in the root layout (site name template, Open Graph defaults, canonical origin from config); override per route.
Generate sitemap.xml and robots.txt from the routes (Next.js app/sitemap.ts and app/robots.ts, @astrojs/sitemap, @nuxtjs/sitemap), with canonical URLs only.
For multilingual sites, generate hreflang from the i18n configuration, and keep <html lang> equal to the page language.
Add structured data as an object serialised with JSON.stringify (escape <), only for types in Google's current gallery.

How the agent checks the work

npx github:dawidolko/frontend-skills audit --changed finds missing descriptions in documents, bad canonicals, invalid hreflang, broken JSON-LD, retired rich-result types, relative social URLs and script-only links.
audit --url <page> runs Lighthouse SEO (crawlable, status code, title, description, link text, hreflang, canonical).
By hand: view the page source (not the DOM) for title, description, canonical and robots; test structured data with the Rich Results Test; inspect a URL in Search Console.

Checked by the audit

The static checks of these rules run in audit; this is a real session on the example project:

Terminal recording: audit lists findings by severity with rule ids and file:line, and fails at serious. — `audit`: counts by severity, each rule with its first location, the exit code.

Reference files

references/seo.md1689 tokens

SKILL.md on GitHub