MarketingCollectible prompt

Image SEO with better names, alt text, sizes and loading

Rename, describe, resize and lazy-load your images so pages load fast and show up in image search.

Claude CodeCursorClaude

Curated by Nvoka

Nvoka wordmark logo
Nvoka wordmark logoMarketing

Image SEO with better names, alt text, sizes and loading

Act as an SEO specialist who also handles front-end performance. Improve every image on {{website_url}}, built with {{tech_stack}}, so images help search instead of slowing pages down. If you're in the codebase, read how images are stored and rendered first, and reuse the existing image component or optimizer. 1. Inventory: each image's page, file name, file size, pixel size, displayed size, format, alt text, and whether it's lazy-loaded. Flag anything over 200KB or more than twice its displayed size. 2. File names: short, lowercase, hyphenated, describing what's pictured, such as golden-retriever-bath-grooming.jpg rather than IMG_4031.jpg. Redirect old image URLs if they're indexed or linked. 3. Alt text: one short sentence on what's shown and why it's there; empty alt for purely decorative images; no keyword lists. Product and work photos say what makes them specific. 4. Sizes: responsive versions around 480, 800, 1200 and 1600px wide, served with srcset and a sizes value that matches the layout, plus width and height on every image so nothing shifts. 5. Formats: AVIF or WebP with a JPEG fallback where needed, quality around 70 to 80, and SVG for logos and icons. 6. Loading: lazy-load images below the fold; never lazy-load the main hero image, which should load eagerly with high fetch priority. 7. Search extras: meaningful images as real image elements in the server-rendered HTML rather than CSS backgrounds, captions where helpful, images in Product and Article structured data, key images in the sitemap, and a 1200 by 630px share image for each key page. Return the inventory table with each new name and alt text, then the code changes as a change list, and the page weight before and after.
Marketingnvoka.com/library/nvoka-image-seo-with-better-names-alt-text-and-sizesScan to open
Marketing

Image SEO with better names, alt text, sizes and loading

Rename, describe, resize and lazy-load your images so pages load fast and show up in image search.

Nvoka logo

Curated by Nvoka

Claude CodeCursorClaudeChatGPT
Add to my library

Make it yours

Fill in the blanks and change any word. Only your copy changes, never the card.

Fill in the blanks

0 of 2 filled

Your prompt

Act as an SEO specialist who also handles front-end performance. Improve every image on {{website_url}}, built with {{tech_stack}}, so images help search instead of slowing pages down. If you're in the codebase, read how images are stored and rendered first, and reuse the existing image component or optimizer. 1. Inventory: each image's page, file name, file size, pixel size, displayed size, format, alt text, and whether it's lazy-loaded. Flag anything over 200KB or more than twice its displayed size. 2. File names: short, lowercase, hyphenated, describing what's pictured, such as golden-retriever-bath-grooming.jpg rather than IMG_4031.jpg. Redirect old image URLs if they're indexed or linked. 3. Alt text: one short sentence on what's shown and why it's there; empty alt for purely decorative images; no keyword lists. Product and work photos say what makes them specific. 4. Sizes: responsive versions around 480, 800, 1200 and 1600px wide, served with srcset and a sizes value that matches the layout, plus width and height on every image so nothing shifts. 5. Formats: AVIF or WebP with a JPEG fallback where needed, quality around 70 to 80, and SVG for logos and icons. 6. Loading: lazy-load images below the fold; never lazy-load the main hero image, which should load eagerly with high fetch priority. 7. Search extras: meaningful images as real image elements in the server-rendered HTML rather than CSS backgrounds, captions where helpful, images in Product and Article structured data, key images in the sitemap, and a 1200 by 630px share image for each key page. Return the inventory table with each new name and alt text, then the code changes as a change list, and the page weight before and after.
See all