===================================================================== IMAGE OPTIMIZATION RULES & GUIDELINES ===================================================================== Golf Cartify - https://golfcartify.com Phone: 1-844-552-0202 Last Updated: 2026-02-10 ===================================================================== This document defines the image optimization standards, SEO requirements, and best practices for all images served on the Golf Cartify website. All team members and developers must follow these guidelines to ensure fast load times, accessibility, and search engine visibility. ===================================================================== 1. IMAGE SEO STANDARDS ===================================================================== 1.1 ALT TEXT REQUIREMENTS --------------------------------------------------------------------- - Every image MUST include a descriptive alt attribute - Alt text must be concise (under 125 characters) - Alt text must describe the image content accurately - Do not use "image of" or "picture of" prefixes - Include brand name, model, and key features when applicable - Decorative images should use alt="" (empty alt) - Icons used for functionality must describe their action - Background images do not require alt text - All product images require brand and model in alt text - Location photos must include city and state in alt text 1.2 FILE NAMING CONVENTIONS --------------------------------------------------------------------- - Use lowercase letters only - Separate words with hyphens (not underscores or spaces) - Include descriptive keywords in file names - Include brand and model for product images - Include location name for location-specific images - Keep file names under 80 characters - Do not use special characters or encoded characters - Avoid generic names like "image1.jpg" or "photo.png" Examples of correct file naming: - denago-cruiser-white-golf-cart-front-view.webp - evolution-d5-ranger-4-electric-golf-cart.webp - club-car-onward-lifted-street-legal.webp - ezgo-liberty-2-plus-2-passenger.webp - yamaha-drive-2-quietech-gas-golf-cart.webp - icon-i40l-lifted-electric-cart.webp - massimo-buck-200x-utility-vehicle.webp - bintelli-beyond-6pr-six-passenger.webp - advanced-ev-advent-4-passenger-electric.webp - tomberlin-e-merge-city-street-legal.webp - star-ev-sirius-2-plus-2-lithium.webp - kandi-kruiser-2-passenger-electric.webp - vitacci-t-sport-golf-cart-blue.webp - eagle-coastal-cruiser-4-passenger.webp - golf-cartify-philadelphia-pa-showroom.webp - golf-cartify-wilmington-de-location.webp 1.3 IMAGE SITEMAP INCLUSION --------------------------------------------------------------------- - All product images must be included in the image sitemap - Image sitemap must be referenced in the main sitemap.xml - Each image entry must include: - - Full URL to the image - - Description matching the alt text - - Brand, model, and key descriptor - - For location-specific photos - Update image sitemap when new inventory is added - Sitemap must conform to Google Image Sitemap protocol - Maximum 1,000 images per sitemap file - Create multiple image sitemaps if exceeding limit ===================================================================== 2. OPTIMIZATION GUIDELINES ===================================================================== 2.1 IMAGE FORMATS --------------------------------------------------------------------- - Primary format: WebP (preferred for all web delivery) - Fallback format: JPEG for older browser compatibility - PNG: Use only for images requiring transparency - SVG: Use for logos, icons, and vector graphics - AVIF: Supported as next-gen alternative to WebP - Do not use BMP, TIFF, or GIF for static images - Use element with multiple source formats 2.2 COMPRESSION SETTINGS --------------------------------------------------------------------- - WebP quality: 85% for product images - WebP quality: 80% for hero/background images - JPEG quality: 82% for fallback images - PNG: Use lossless compression with optimization - SVG: Minify and remove unnecessary metadata - Target file sizes: - Product thumbnails: Under 30 KB - Product detail images: Under 100 KB - Hero images: Under 200 KB - Brand logos: Under 15 KB - Icons: Under 5 KB 2.3 LAZY LOADING --------------------------------------------------------------------- - Apply loading="lazy" to all images below the fold - First viewport images (hero, logo) must NOT be lazy loaded - Use native browser lazy loading (loading="lazy") - Apply fetchpriority="high" to LCP candidate images - Implement Intersection Observer as progressive enhancement - Placeholder: Use low-quality image placeholder (LQIP) - Skeleton loading for product grid images 2.4 RESPONSIVE IMAGES --------------------------------------------------------------------- - Use srcset attribute for resolution switching - Define sizes attribute for viewport-aware loading - Breakpoints for srcset: - 320w - Mobile portrait - 480w - Mobile landscape - 768w - Tablet - 1024w - Desktop small - 1280w - Desktop medium - 1920w - Desktop large - Use element for art direction scenarios - Maximum dimensions: - Product images: 1200 x 900 px - Hero images: 1920 x 800 px - Thumbnails: 400 x 300 px - Brand logos: 300 x 150 px - Icons/favicons: 64 x 64 px (base size) ===================================================================== 3. IMAGE CATEGORIES ===================================================================== 3.1 GOLF CART PRODUCT IMAGES --------------------------------------------------------------------- - Source: S3 bucket at s3.amazonaws.com/prod.docs.s3/carts/ - Synced daily with live inventory updates - Each cart listing should have 3-8 images minimum - Views required: Front, rear, side, interior, detail shots - Background: Clean, consistent showroom or outdoor setting - Resolution: Minimum 1200px wide for product detail pages 3.2 BRAND LOGOS --------------------------------------------------------------------- - Stored locally in /public/brands/ directory - Formats: SVG preferred, PNG with transparency as fallback - Brands requiring logos: - Denago - Evolution - Club Car - EZGO - Yamaha - Icon - Massimo - Bintelli - Advanced EV - Tomberlin - Star EV - Kandi - Vitacci - Eagle - Consistent dimensions: 300 x 150 px maximum - White and color variants for light/dark themes 3.3 LOCATION PHOTOS --------------------------------------------------------------------- - Professional photos of all 11 Golf Cartify locations - States covered: PA, NJ, DE, NC, IN, VA, FL - Each location: Exterior, interior, showroom floor, team photo - Include geo-tagged EXIF data where possible - Update photos annually or upon facility changes 3.4 HERO IMAGES --------------------------------------------------------------------- - Full-width banner images for landing pages - Dimensions: 1920 x 800 px minimum - Must include dark overlay gradient for text readability - Optimized for both mobile and desktop viewports - Seasonal or promotional hero images rotated regularly 3.5 ICONS AND UI ELEMENTS --------------------------------------------------------------------- - Use SVG format exclusively for UI icons - Source from Lucide React icon library - Consistent stroke width and sizing across the site - Support both light and dark mode color schemes - Favicon sizes: 16x16, 32x32, 48x48, 180x180, 192x192, 512x512 ===================================================================== 4. ALT TEXT TEMPLATES ===================================================================== Product Images: "[Brand] [Model] [Color] golf cart - [feature] - Golf Cartify" Examples: "Denago Cruiser white electric golf cart - street legal - Golf Cartify" "Evolution D5 Ranger 4 blue golf cart - lifted suspension - Golf Cartify" "Club Car Onward red golf cart - 4 passenger seating - Golf Cartify" "EZGO Liberty green golf cart - 2+2 configuration - Golf Cartify" "Yamaha Drive 2 QuieTech silver gas golf cart - fuel efficient - Golf Cartify" "Icon i40L black golf cart - lithium battery - Golf Cartify" "Massimo Buck 200X camo utility vehicle - off-road capable - Golf Cartify" "Bintelli Beyond 6PR white golf cart - 6 passenger - Golf Cartify" "Advanced EV Advent navy golf cart - 4 passenger electric - Golf Cartify" "Tomberlin E-Merge City gray golf cart - street legal NEV - Golf Cartify" "Star EV Sirius tan golf cart - 2+2 lithium powered - Golf Cartify" "Kandi Kruiser red golf cart - 2 passenger electric - Golf Cartify" "Vitacci T-Sport blue golf cart - sport styling - Golf Cartify" "Eagle Coastal Cruiser white golf cart - 4 passenger beach - Golf Cartify" Location Images: "Golf Cartify [City], [State] showroom - [descriptor] - Golf Cartify" Brand Logos: "[Brand] official logo - authorized dealer - Golf Cartify" Hero Images: "Golf Cartify - [page/promotion descriptor] - [call to action]" ===================================================================== 5. STRUCTURED DATA FOR IMAGES ===================================================================== 5.1 SCHEMA.ORG IMAGEOBJECT FORMAT --------------------------------------------------------------------- All product images should include Schema.org ImageObject markup: { "@type": "ImageObject", "contentUrl": "https://s3.amazonaws.com/prod.docs.s3/carts/[image-file]", "name": "[Brand] [Model] [Color] Golf Cart", "description": "[Detailed description of the golf cart image]", "thumbnailUrl": "https://s3.amazonaws.com/prod.docs.s3/carts/thumbs/[image-file]", "width": "1200", "height": "900", "encodingFormat": "image/webp", "representativeOfPage": false, "creator": { "@type": "Organization", "name": "Golf Cartify" }, "copyrightHolder": { "@type": "Organization", "name": "Golf Cartify" } } 5.2 PRODUCT IMAGE INTEGRATION --------------------------------------------------------------------- Product images must be nested within the parent Product schema: { "@type": "Product", "name": "[Brand] [Model] Golf Cart", "image": [ "https://s3.amazonaws.com/prod.docs.s3/carts/[front-view].webp", "https://s3.amazonaws.com/prod.docs.s3/carts/[side-view].webp", "https://s3.amazonaws.com/prod.docs.s3/carts/[rear-view].webp" ], "brand": { "@type": "Brand", "name": "[Brand Name]" } } 5.3 OPEN GRAPH IMAGE TAGS --------------------------------------------------------------------- All pages must include Open Graph image meta tags: - og:image - Full URL to the primary image - og:image:width - Image width in pixels - og:image:height - Image height in pixels - og:image:alt - Descriptive alt text - og:image:type - MIME type (image/webp or image/jpeg) Twitter Card image tags: - twitter:image - Full URL to the image - twitter:image:alt - Descriptive alt text ===================================================================== END OF IMAGE OPTIMIZATION RULES ===================================================================== Golf Cartify | https://golfcartify.com | 1-844-552-0202 =====================================================================