Context

Email newsletters were being clipped by Google due to their overall size. Editors needed a reliable way to validate and format Business Insider image URLs for email campaigns. The manual process of removing query parameters and adding email-optimized parameters (?width=600&format=jpeg&auto=webp) was error-prone and time-consuming. Additionally, broken i.insider.com URLs that redirected to placeholder images were causing issues in production emails.

My Contribution

Built a comprehensive web tool that provides:

Core Functionality:

• Real-time URL validation for both i.insider.com and muse.insider.com domains
• Automatic transformation of muse URLs to our Fastly i.insider format by extracting image IDs
• Query parameter processing (removal and standardized replacement)
• Live image preview with file size and dimension analysis
• Auto-copy to clipboard with success notifications

Security & Quality:

• Implemented strict URL sanitization to prevent XSS vulnerabilities
• HTTPS-only validation with domain whitelist
• Added broken image detection that identifies placeholder images (1440×1080) and prevents their use
• Added comprehensive error recovery flow

Accessibility:

• ARIA live regions for screen reader announcements
• Proper semantic HTML and input attributes
• Focus management for keyboard navigation
• Enhanced error messaging and user guidance

Outcome / Impact

Created a production-ready tool that:

• Eliminates manual errors in email image URL formatting
• Detects and prevents broken images before they reach email campaigns
• Supports multiple URL formats with automatic transformation
• Provides immediate validation feedback to users
• Meets security and accessibility standards

The tool is now available for email producers to streamline their workflow and ensure image quality in all email campaigns.