ClawHub

Website

Build fast, accessible, and SEO-friendly websites with modern best practices.

MIT-0 · Free to use, modify, and redistribute. No attribution required.
⭐ 7 · 2.9k · 12 current installs · 17 all-time installs
byIván@ivangdavila
MIT-0
Security Scan
VirusTotalVirusTotal
Benign
View report →
OpenClawOpenClaw
Benign
high confidence
✓
Purpose & Capability
The name and description promise website best practices and the SKILL.md contains only guidelines for performance, accessibility, HTML/CSS patterns, and launch checks — all directly relevant to building websites. There are no unrelated requirements (no credentials, binaries, or config paths).
✓
Instruction Scope
The runtime instructions are prose-only guidelines and do not direct the agent to read files, access environment variables, call external endpoints, run shell commands, or transmit data. They stay within the stated scope of advising on website development.
✓
Install Mechanism
There is no install spec and no code files; this is the lowest-risk pattern (instruction-only). Nothing will be downloaded or written to disk by the skill itself.
✓
Credentials
The skill declares no required environment variables, credentials, or config paths. The guidance does not reference any secrets or external service tokens — requested access is proportional (none).
✓
Persistence & Privilege
The skill is not always-included (always: false) and uses normal autonomous invocation defaults. It does not request persistent system presence or modify other skills' configurations.
Assessment
This skill is a lightweight, instruction-only set of web-development best practices and does not request secrets or install software. It appears safe and coherent for advisory use. Note that the source is unknown — because the skill contains only text it cannot perform actions itself; if you need automated tooling (builders, linters, or deployers) prefer well-known packages or skills from verified sources and avoid granting credentials unless clearly required and justified.

Like a lobster shell, security has layers — review code before you run it.

Current versionv1.0.0
Download zip
latestvk972nkv931y2d4vsccg1p61pq980t4zf

License

MIT-0
Free to use, modify, and redistribute. No attribution required.
Termshttps://spdx.org/licenses/MIT-0.html

Runtime requirements

🌐 Clawdis
OSLinux · macOS · Windows

SKILL.md

Website Development Rules

Performance

  • Images are the #1 cause of slow sites — use WebP/AVIF, lazy-load below-the-fold, and set explicit width/height to prevent layout shift
  • Render-blocking CSS delays first paint — inline critical CSS in <head>, defer the rest
  • Third-party scripts (analytics, chat widgets) often add 500ms+ — load them with async or defer, audit regularly
  • Fonts cause invisible text flash (FOIT) — use font-display: swap and preload critical fonts
  • Measure with Lighthouse in incognito mode — extensions skew results

Mobile First

  • Start CSS with mobile styles, add complexity with min-width media queries — easier to scale up than strip down
  • Touch targets need 44x44px minimum — fingers are imprecise, small buttons frustrate users
  • Test on real devices, not just browser DevTools — throttling simulation misses real-world jank
  • Horizontal scroll is a critical bug — test every page at 320px width minimum
  • viewport meta tag is required: <meta name="viewport" content="width=device-width, initial-scale=1">

Accessibility

  • Every <img> needs alt text — empty alt="" for decorative images, descriptive text for meaningful ones
  • Color contrast ratio 4.5:1 minimum for body text — use WebAIM contrast checker
  • Form inputs must have associated <label> elements — placeholders alone are not accessible
  • Keyboard navigation must work — test every interactive element with Tab key
  • Screen readers announce heading hierarchy — use H1-H6 in logical order, never skip levels

HTML Structure

  • One <h1> per page only — it's the page title, not a styling tool
  • Use semantic elements: <nav>, <main>, <article>, <aside>, <footer> — they communicate structure to browsers and assistive tech
  • <button> for actions, <a> for navigation — don't use divs with click handlers
  • External links should have rel="noopener" — prevents security vulnerability with target="_blank"
  • Validate HTML — broken markup causes unpredictable rendering across browsers

CSS Patterns

  • Avoid !important — it breaks cascade and makes debugging painful. Fix specificity instead
  • Use relative units (rem, em, %) over fixed px for text — respects user font size preferences
  • CSS custom properties (variables) reduce repetition — define colors and spacing once, use everywhere
  • Flexbox for 1D layouts, Grid for 2D — don't force one to do the other's job
  • Test without CSS loading — content should still be readable in plain HTML

Common Mistakes

  • Missing favicon causes 404 spam in server logs — always include one, even a simple PNG
  • Not setting <html lang="en"> breaks screen reader pronunciation
  • Hardcoded http:// links break on HTTPS sites — use protocol-relative // or always https://
  • Assuming JavaScript is available — core content should work without JS (progressive enhancement)
  • Forgetting print styles — add @media print for pages users might print (receipts, articles)

Before Launch

  • Test all forms actually submit — broken contact forms lose leads silently
  • Check 404 page exists and is helpful — default server 404 looks unprofessional
  • Verify social sharing previews with Open Graph tags — test in Facebook/Twitter debuggers
  • Submit sitemap to Google Search Console — speeds up indexing
  • Set up uptime monitoring — know when your site goes down before users tell you

Files

1 total
Select a file
Select a file to preview.

Comments

Loading comments…