Trình tạo Landing Page SEO
Tạo, kiểm định và sửa landing page HTML tĩnh hướng tới điểm PageSpeed 100/100 với JSON-LD, ảnh AVIF và không phụ thuộc bên thứ ba.
Marketing · SEOTrung cấp★ 131⑂ 11Điểm AI 9/10Cập nhật lần cuối: 30 thg 8, 2026
Skill này làm gì
- Từ một bản brief (domain, từ khóa mục tiêu, CTA, thông tin liên hệ...), tạo landing page HTML tĩnh một trang: critical CSS inline, bộ ảnh AVIF/WebP/JPEG, dữ liệu có cấu trúc JSON-LD, không tải thư viện ngoài.
- Xuất ra cả một thư mục dự án:
index.html,robots.txt,sitemap.xml,favicon.png,images/,ASSETS.md(nguồn gốc & bản quyền ảnh) vàSERVER-SETUP.md(cấu hình hosting, nén, security headers). - Ba chế độ rõ ràng: generate (tạo mới), audit-only (chỉ đọc, không sửa file), fix-existing (sửa đúng lỗi được nêu).
- Quy trình kiểm định bắt buộc: W3C validator, kiểm tra mọi file cục bộ được tham chiếu có thật, parse JSON-LD, screenshot 320/768/1280/1920px, Lighthouse chạy 3 lần lấy trung vị, và kiểm tra accessibility thủ công. Không được báo con số nào chưa thực đo.
Phù hợp với ai
- Marketer, chủ doanh nghiệp nhỏ, freelancer cần một trang landing nhanh và thân thiện SEO.
- Lập trình viên frontend phải tuân thủ ngân sách hiệu năng (LCP < 2.5s, CLS < 0.1, JS ≤ 15 KB).
- Người muốn audit landing hiện có kèm bằng chứng đo lường thay vì phỏng đoán.
Ví dụ sử dụng
- "Tạo landing cho phòng khám nha khoa theo brief này" → skill hỏi bổ sung domain, từ khóa, địa chỉ/điện thoại rồi sinh dự án kèm JSON-LD
Dentist/LocalBusiness. - "Audit https://example.com theo checklist hiệu năng" → báo cáo pass/fail từng mục kèm lệnh đã dùng, mục nào không chạy được thì ghi BLOCKER, không sửa file.
- "Ảnh hero làm layout nhảy khi tải, sửa giúp" → chỉ sửa phần liên quan, sau đó kiểm định lại và báo số đo thật.
· · · Hướng dẫn cài đặt · · ·
Dùng thử ngay, không cần cài
Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.
Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình: https://raw.githubusercontent.com/aleksandr-alhoff/seo-landing/HEAD/SKILL.md Mình muốn: (viết việc bạn cần ở đây)
Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.
↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.
Cài vào ứng dụng Claude (không cần terminal)
- Tải tệp ZIP bằng nút bên dưới.
- Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
- Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
Cài vào Claude Code
Để Claude làm — dán câu dưới đây vào Claude Code
Hãy cài skill mình tìm thấy trên Claude Skill Mart. Copy thư mục SKILL.m từ repo GitHub aleksandr-alhoff/seo-landing vào ~/.claude/skills/seo-landing/ của mình. Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.
Cài bằng lệnh thủ công
git clone https://github.com/aleksandr-alhoff/seo-landing.git ~/.claude/skills/seo-landing⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.
- Mở Terminal.
- Tạo thư mục skill nếu chưa có:
mkdir -p ~/.claude/skills - Clone repo vào đó:
git clone https://github.com/aleksandr-alhoff/seo-landing.git ~/.claude/skills/seo-landing - Kiểm tra tồn tại
~/.claude/skills/seo-landing/SKILL.mdvà thư mụcreferences/(nếu SKILL.md nằm trong thư mục con, hãy di chuyển nội dung lên cấp trên). - Khởi động lại Claude Code, rồi yêu cầu: "tạo landing page SEO..." hoặc "audit trang này".
- (Nên làm) Cài Node.js và Lighthouse (
npm i -g lighthouse) cùng công cụ chuyển ảnh (cwebp,avifenchoặc ImageMagick) để chạy đủ bước kiểm định.
Xem mã nguồn trên GitHub ↗Giấy phép: MIT