Awesome Agent Skills

repository·main·Indexed 41 days ago

https://github.com/littleben/awesomeagentskills

A curated collection of reusable prompts and workflows (skills) for Claude Code and other AI agents. Includes official Anthropic skills for Notion, document manipulation (DOCX, PDF, PPTX, XLSX), and creative design, as well as community skills for web development, SEO, and deployment. Also features the doc-sync-tool v1.0.0 for synchronizing agent documentation files.

Tokens
106.1K
Snippets
247
Records
453
Agent score
74%

What's inside Awesome Agent Skills

  1. Overview of Claude Official Skills categories

    main

    Anthropic provides several categories of official skills designed to extend Claude's capabilities:

    • Creative & Design: Includes Algorithmic Art (p5.js), Canvas Design (HTML5 Canvas/PDF.js), and Slack GIF Creator.
    • Development & Technical: Includes Artifacts Builder (React/Tailwind/shadcn/ui), MCP Builder (Model Context Protocol), and Webapp Testing (Playwright).
    • Enterprise & Communication: Includes Brand Guidelines, Internal Comms, and Theme Factory.
    • Meta Skills: Includes Skill Creator (best practices) and Template Skill (starter templates).
    • Document Skills: A suite for programmatic manipulation of DOCX, PDF, PPTX, and XLSX formats.
    • Notion Skills: Specialized workflows for Notion, such as Meeting Intelligence, Research & Documentation, Knowledge Capture, and Spec to Implementation.
  2. Use the Shipany Skill for SaaS development

    main

    The Shipany skill provides comprehensive assistance for developing with the Shipany framework. It is specifically designed for projects using:

    • Next.js 15
    • TypeScript
    • Drizzle ORM
    • NextAuth
    • Payment integration

    Trigger this skill when implementing Shipany solutions, debugging Shipany code, or asking about its specific APIs and features.

  3. Browse the Google Search Documentation Index

    main

    The Google Search Documentation Index provides a categorized directory of official Google Search documentation. Use the following categories to find specific technical guides and references:

    • Apis: Documentation regarding Google Search APIs.
    • Appearance: Information on how your site appears in search results.
    • Crawling: Details on how Googlebot discovers and crawls your content.
    • Fundamentals: Core concepts of how search works.
    • Guides: Step-by-step instructional documentation.
    • Indexing: Information on how Google adds your pages to its index.
    • Other: Miscellaneous search-related documentation.
    • Specialty: Niche or specialized search topics.
  4. Understand and optimize Page Experience

    main

    Google's core ranking systems reward content that provides a good overall page experience. Page experience is evaluated on a page-specific basis, though some site-wide assessments may occur.

    Key Components

    • Core Web Vitals: These are specific signals used by ranking systems. While achieving good Core Web Vitals scores (monitored via Search Console or third-party tools) is recommended for success, it does not guarantee top rankings.
    • Overall Experience: Beyond Core Web Vitals, focus on making the site satisfying and easy to use. Google seeks to show the most relevant content even if the page experience is sub-par, but a great experience contributes to success in competitive queries.

    Self-Assessment

    To align with Google's goals, ask if your pages provide:

    • Fast loading speeds.
    • Interactive elements that respond quickly.
    • Visual stability (elements don't jump around during loading).
    • Mobile-friendly layouts.
    • Secure connections (HTTPS).
  5. Understand Google crawlers and fetchers (user agents)

    main

    Google uses two main types of agents to interact with websites:

    1. Crawlers (Robots/Spiders): Programs used to automatically discover and scan websites.
    2. Fetchers: Programs (similar to wget) that make single requests on behalf of a user.

    Technical Specifications

    • Protocols: Supports HTTP/1.1 and HTTP/2. To opt out of HTTP/2, have your server respond with a 421 HTTP status code. It also supports FTP and FTPS (though rare).
    • Content Encodings: Supports gzip, deflate, and Brotli (br). The supported encodings are advertised in the Accept-Encoding header of the request.
    • IP Addresses: Google's clients are distributed globally. While they primarily egress from US IP addresses, they may use international IPs if US-based requests are blocked.
  6. Understand Google Search Visual Elements

    main

    Visual elements are the UI components of a Google Search results page. Understanding these helps in optimizing how your site appears in search results.

    Common Result Types:

    • Text result: Based on the textual content of the page.
    • Structured data result: Relies on markup to display graphical elements or interactive experiences.
    • Image result: Based on an embedded image; more likely for image-seeking queries.
    • Video result: Based on an embedded video; more likely for video-seeking queries.
    • Exploration features: Tools that help users expand or refine their search.

    Attribution Elements: Attribution describes the source of a result and can include:

    • Favicon: The small icon associated with the site.
    • Site name: The name of the site (can be provided via structured data).
    • Visible URL: The readable URL, consisting of the Domain (the site address) and the Breadcrumb (the path trail).
  7. Understand how Google processes JavaScript

    main

    Googlebot processes JavaScript-powered web applications in three distinct phases. Understanding this lifecycle is critical for ensuring your app is discoverable:

    1. Crawling: Googlebot fetches the URL and checks robots.txt. If the URL or the JavaScript files are disallowed, Googlebot skips them. It then parses the initial HTML for links (href attributes) to add to the crawl queue.
    2. Rendering: Googlebot queues pages for rendering unless a robots meta tag or header instructs it not to index the page. A headless Chromium instance executes the JavaScript to generate the final rendered HTML.
    3. Indexing: Googlebot parses the rendered HTML for new links and uses the content to index the page.

    Best Practice: Use server-side rendering (SSR) or pre-rendering. This makes the site faster for users and ensures compatibility with bots that cannot execute JavaScript.

  8. Understand the purpose and limits of robots.txt

    main

    A robots.txt file is used to manage crawler traffic and prevent search engines from overloading your server. It is not a security mechanism to hide pages from Google Search.

    Key usage scenarios:

    • Managing crawl traffic to avoid overwhelming your server.
    • Preventing unimportant or duplicate pages from being crawled.
    • Preventing media files (images, video, audio) from appearing in search results.

    Critical Limitations:

    • Does not hide URLs from Search: If other sites link to a page blocked by robots.txt, the URL can still appear in search results (though without a description).
    • Does not provide privacy: To truly hide a page from Google, use noindex tags or password protection.
    • CMS Note: If using a CMS like Wix or Blogger, you may need to use their built-in search settings instead of editing robots.txt directly.
  9. Understand the three stages of Google Search

    main

    Google Search operates in three distinct stages. Understanding these helps in troubleshooting crawling and indexing issues:

    1. Discovery (URL Discovery): Google finds new or updated pages. This happens via:
      • Visiting previously known pages.
      • Extracting links from known pages (e.g., a category page linking to a new blog post).
      • Processing submitted sitemaps.
    2. Crawling: Once a URL is discovered, Googlebot (the crawler/bot/spider) visits the page to see what is on it. Googlebot uses algorithms to decide how often to crawl and avoids overloading your server (e.g., it will slow down if it encounters HTTP 500 errors).
    3. Indexing: After crawling, Google processes the page content (including rendering JavaScript via a recent version of Chrome) to add it to the search index.
  10. Diagnose PageSpeed Insights Accessibility '!' Error

    main

    If PageSpeed Insights (PSI) shows an exclamation mark ('!') instead of a numeric score in the Accessibility section, it indicates a measurement failure rather than a low score. This is typically caused by the color-contrast audit failing to execute because it cannot sample pixel data (often due to getImageData() errors in Canvas).

    Symptoms

    • PageSpeed Insights: Accessibility score shows "!".
    • Chrome DevTools/Lighthouse: Accessibility audit shows "Error" or "Incomplete".
    • Console: Errors related to getImageData.

    Common Root Causes

    1. CSS Filters (Most common): backdrop-blur, filter: brightness(), filter: contrast(), or mix-blend-mode prevent pixel sampling.
    2. OKLCH/OKLAB Color Spaces: New color models causing calculation errors in axe-core or unstable sRGB conversions.
    3. Low Opacity: Background opacity < 0.4 (e.g., /10, /20) makes sampling unreliable.
    4. Complex Gradients/Masks: mask-image combined with low opacity or cross-origin images.
  11. Understand Canonicalization and deduplication

    main

    Canonicalization is the process where Google selects a single representative (canonical) URL from a set of duplicate pages. This process, often called deduplication, helps Google show only one version of duplicate content in search results.

    How Google Chooses a Canonical URL

    Google identifies the 'centerpiece' or primary content of a page. If multiple pages have very similar primary content, Google chooses the most complete and useful version as the canonical page. The canonical page is crawled more frequently, while duplicates are crawled less often to save resources.

    Signals used in Canonicalization

    While Google treats canonicalization as a hint rather than a strict rule, you can influence the choice using these signals:

    • rel="canonical" link annotations: Explicitly marking a URL as the preferred version.
    • Redirects: Using redirects to point to the preferred URL.
    • Sitemaps: Including the preferred URL in your sitemap.
    • Protocol: Whether the page is served over HTTP or HTTPS.

    Language Versions

    Different language versions of a page are only considered duplicates if the primary content is in the same language. If only the header, footer, and non-critical text are translated while the body remains the same, they are treated as duplicates.