HAP image validation

What problem does it solve?

This Skill prevents the use of incorrect HAP character images, malformed Cloudinary URLs, and inappropriate emotional contexts in educational content. It ensures consistent visual storytelling, optimal image performance, and correct accessibility attributes, eliminating manual checks and visual errors.

Core Features & Use Cases

• Emotional Context Validation: Verifies that each HAP image's expression (e.g., confused, celebrating) matches the surrounding content's emotional tone.
• Cloudinary URL Verification: Automatically checks for correct Cloudinary URL patterns, image filenames (against a definitive inventory), and optimization parameters (f_auto, q_auto, w_).
• Alt Text & HTML Attribute Audit: Ensures all images have descriptive alt text and required HTML attributes like width, height, decoding="async", and loading="lazy" or fetchpriority="high".
• Use Case: After adding or updating HAP images in a learning station, run this Skill to automatically audit all image placements, ensuring they are emotionally appropriate, use valid and optimized Cloudinary links, and meet accessibility standards, saving significant review time.

Quick Start

Use the hap-image-validation skill to check all HAP images in the attached HTML file. Verify emotional context, Cloudinary URLs, alt text, and HTML attributes.