skills.rest
portermetricsample
portermetricsampleCOMMUNITY
Explore all skills by this author →
GitHub

image-optimizer

Convert images to WebP, downscale dimensions, and compress file sizes.

17|5|Updated Jun 25, 2026
Search Tags:#automation#accessibility#webp#web performance#seo#image optimization
One-click install
npx skills add https://github.com/portermetricsample/marketing-skills --skill image-optimizer-portermetricsample
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: image-optimizer
Source: https://github.com/portermetricsample/marketing-skills/tree/main/seo/image-optimizer
Command: npx skills add https://github.com/portermetricsample/marketing-skills --skill image-optimizer-portermetricsample

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires pillow, beautifulsoup4, and includes scripts (resource) components.

What problem does it solve?

This skill addresses slow landing page load times caused by unoptimized images while simultaneously automating the tedious process of writing SEO-friendly alt text and titles.

Core Features & Use Cases

  • Automated Optimization: Converts images to WebP, downscales oversized files, and compresses them to significantly reduce page weight.
  • SEO & Accessibility: Uses AI vision to generate descriptive alt text and titles, ensuring compliance and better search engine indexing.
  • Layout Stability: Automatically injects width and height attributes to prevent Cumulative Layout Shift (CLS).

Quick Start

Run the image optimizer on the assets folder to compress images and generate a manifest for alt text and title generation.

Frequently Asked Questions about image-optimizer

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

FAQPage Schema
How do I optimize images for web performance and SEO at the same time?▼

To optimize images for web performance and SEO together, convert them to WebP format, downscale dimensions, and compress file sizes, while generating descriptive alt text and titles for HTML tags.

Can I use Pillow and BeautifulSoup4 to automate image compression and HTML tag updates?▼

Yes, Pillow and BeautifulSoup4 can automate image compression by processing image binaries to WebP format, while BeautifulSoup4 manipulates HTML structures to inject width, height, alt text, and title attributes.

How does converting images to WebP format improve page load performance?▼

Converting images to WebP format improves page load performance by significantly reducing page weight through file size compression and dimension downscaling, resulting in faster loading landing pages.

How do I prevent Cumulative Layout Shift when adding images to a landing page?▼

Prevent Cumulative Layout Shift by automatically injecting width and height attributes into HTML image tags, ensuring layout stability during page rendering before the optimized images fully load.

How do I generate SEO-friendly alt text for multiple images automatically?▼

Generate SEO-friendly alt text automatically by using AI vision to analyze image content and create descriptive titles, ensuring better search engine indexing and accessibility compliance.

What is the best way to batch optimize web images and update HTML attributes?▼

The best way to batch optimize web images is running an automated script on the assets folder to compress images to WebP and generate a manifest for applying alt text and title attributes.

Related Skills

Explore More Marketing & Sales Skills→
aniketpanjwanianiketpanjwani
40

newsletter-events-research

Extract event data from Instagram, web aggregators, and Facebook URLs.

Community
Advanced
Zal4DWZal4DW
91

career-helper

Rewrite CVs for ATS and optimize LinkedIn profiles with interview preparation.

Community
Basic
createdbysaltcreatedbysalt

asset-audit

Audit Webflow site assets for missing alt text and non-SEO filenames.

Community
Advanced
jorgejaramillojorgejaramillo
1

seo-images

Analyze web page images for SEO and performance issues.

Community
Advanced