SEO check skill
Check headings, metadata, image descriptions, and internal links before publishing a new page. Fix gaps and duplicates so visitors and search engines can understand the page.
# SEO Check Verify that a selected page’s on-page SEO is implemented correctly. ## Instructions - Inspect the existing page and available Framer settings without rewriting the content. - Check the rendered title, meta description, slug, canonical URL, and search visibility. - Check whether the page is allowed to be indexed by its settings, robots directives, canonical URL, and published status. - When verifiable, check whether the live URL is actually indexed. Otherwise, mark it for manual review. - Clearly distinguish between indexable, crawled, and indexed. - Check for one clear H1 and a logical heading structure. - Check heading, paragraph, navigation, main-content, header, footer, and section tags where relevant. - Check the page-language setting. - Check images for descriptive alt text or correct decorative treatment. - Check links and buttons for descriptive labels. - Check whether the title, description, H1, and visible page topic agree. - Check for missing, duplicated, conflicting, or placeholder metadata. - For CMS pages, check dynamic metadata mappings, fallbacks, and empty or duplicated values. - Do not perform a full accessibility audit, write new copy, audit structured data, or suggest visual changes. - Do not apply fixes unless explicitly requested. ## Report to the User Mark each item as passed, issue found, needs manual review, or not applicable. Explain the impact and recommended next step.
How to apply skills to your project
Keep new pages consistent with your project’s typography, colors, spacing, and components.
Skill copied
# Design system
Use this skill when you add pages or sections to a site that already has a look. You extend the system the team built. You don’t invent a new one.
## Before you start
- Open the home page and two pages close to the new one.1. Copy the skill
Use the Copy button above the skill to copy this skill’s instructions to your clipboard.
/skills
Turn these instructions into
a reusable skill:
GPT 6 Sol
2. Add it in agent chat
Type
/skillsin your agent chat and paste the skill, or add it in Settings / Skills.Use
/design-system
to build a new
Careers page. Include a couple job openings and a form.
GPT 6 Sol
3. Use it in chat
Type the skill’s command, such as
/design-system, in your agent to use it.Title
design-system
Description
Use components, styles, spacing, and layouts to create new
Content
Design system
Use dark color scheme. Reuse existing styles and components; never invent new colors or text styles.
Pages
Apply the Base layout template to every new page.
Set a meta title and meta description on every new page.
Sections fill the screen width (
1fr) and contain an inner wrapper withmaxWidth="1200px"that holds the content.
Colors
Container backgrounds: Color/Black.
Text:
Primary headings: Color/White
Secondary/body text: Color/White 60
Accent: Color/Red is the only accent. Use it very sparingly (one highlight per section at most).
Borders and dividers: Color/Border Solid or Color/Border Transparent.
Typography
Always use these text styles, never inline type styles:
Set Text Balance to Yes for text layers.
Use sentence case; do not use all caps.
Do not use eyebrow text (small text above a heading).
In heroes, use Text/Body L for supporting text.
For every paragraph, adjust its text-box width to produce 50–75 characters per line, targeting 65. Round the width up to the nearest 5 or 10 pixels. If that width is wider than the parent container, set the text box to Fill. Verify at every breakpoint before finishing.
Text/H0: jumbo headings and hero treatments
Text/H1: blog post titles and secondary page titles
Text/H2, Text/H3, Text/H4, Text/H5, Text/H6: all other headings, in hierarchy order
Text/Body L: sub heads
Text/Body: main body text
Text/Body M: small supporting text
Text/Button: button labels only
4. Edit your skill
Open Settings / Skills whenever you want to make changes.
