skills.rest
mojwang
mojwangCOMMUNITY
Explore all skills by this author →
𝕏@MarvinIsHimGitHub

web-review

Detect frontend page quality issues from code changes.

Updated Aug 23, 2026
Search Tags:#performance#accessibility#frontend#nextjs#seo#core-web-vitals#web-review
One-click install
npx skills add https://github.com/mojwang/macbook-dev-setup --skill web-review
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-review
Source: https://github.com/mojwang/macbook-dev-setup/tree/main/config/skills/web-review
Command: npx skills add https://github.com/mojwang/macbook-dev-setup --skill web-review

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Run when changes affect page files (src/app/), components, or content. Checks accessibility (alt text, headings, focus), SEO (metadata, structured data), performance (next/image, lazy loading), and Core Web Vitals.

Core Features & Use Cases

  • Accessibility checks: alt text, labels, focus visibility, heading order, and responsive interactions.
  • SEO checks: metadata, titles, descriptions, landmark usage, canonical URLs, and internal linking practices.
  • Performance checks: proper image handling (next/image), lazy loading, and avoidance of render-blocking resources.
  • Core Web Vitals monitoring: assess LCP, CLS, and INP implications of changes.
  • Mobile & Social: viewport setup, touch target sizes, and social/meta tags validation.
  • Use Case: You introduce a new nav component; the skill flags missing alt text, incorrect headings, and missing og:title metadata.

Quick Start

Review recent changes to validate accessibility, SEO, and performance before deployment.

Frequently Asked Questions about web-review

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check frontend code changes for accessibility and SEO issues?▼

Frontend code changes are checked for accessibility and SEO issues by validating alt text, labels, focus visibility, metadata, and heading order within page files and components before deployment.

How do I validate Core Web Vitals when modifying Next.js components?▼

Core Web Vitals are validated for Next.js component changes by assessing LCP, CLS, and INP implications, ensuring proper image handling with next/image, and verifying lazy loading to prevent render-blocking resources.

What is the best way to automate frontend quality checks for page files?▼

Automating frontend quality checks for page files involves scanning changes in src/app to enforce checks for mobile viewport setup, touch target sizes, social meta tags, and structured data.

Can I use this to detect missing alt text and og:title metadata in new components?▼

Yes, you can detect missing alt text and og:title metadata in new components by applying automated checks that flag incorrect headings, missing labels, and absent social tags during code reviews.

Do I need a specific project structure to run frontend page quality checks?▼

Frontend page quality checks require a project structure where changes affect page files within src/app, components, or content directories to validate accessibility, SEO, and performance accurately.

Related Skills

Explore More Software Engineering Skills→
LiinkiingLiinkiing
6

frontend-guidelines

Standardize frontend component placement and reuse in a Next.js monorepo.

Community
Basic
luanrodriguesluanrodrigues
2

bee:dev-frontend-performance

Validate Core Web Vitals, Lighthouse scores, and bundle size against defined thresholds.

Community
Advanced
nanorepublicananorepublica
61

Global Commenting

Apply standardized file headers and module-level comments across codebases.

Community
Basic
smarmen86smarmen86

seo-unlighthouse

Run automated multi-page Lighthouse audits and generate aggregate JSON reports.

Community
Intermediate