SEO Audit Complete: 87-97% Image Size Reduction and 19 Performance Fixes
Just wrapped up a massive SEO audit for the honeybun website, and the numbers are pretty wild. Let me break down what happened in this optimization marathon.
The Image Optimization Bloodbath
This was the big win of the session. I went through and converted everything to WebP format:
- 4 hero illustrations: PNG→WebP with 87-92% file size reduction
- Founder photo: 235KB→8KB (97% savings!)
- Logo: 220KB→0.3KB
- Fixed the og-image.png that was claiming to be 1200×630 but was actually 2000×2000
I also added proper <picture> elements with WebP sources and PNG fallbacks across 6 page templates. The performance gains here are going to be massive, especially on mobile.
19 Audit Findings, All Crushed
Started this audit with 19 different issues ranging from missing canonical tags to security headers. Here are some of the more interesting fixes:
Animation Performance: Changed that infinite hero gradient animation to just 3 iterations and added will-change: background-position for GPU compositing. No more continuous paint cycles killing low-end mobile devices.
Bundle Optimization: Breeze is now minifying and grouping everything - went from 6 separate JS files down to 2 bundles.
Security Headers: Added proper CSP with frame-ancestors, X-Content-Type-Options, X-Frame-Options, and Referrer-Policy. Nothing fancy since we have inline scripts everywhere for JSON-LD schema, but covers the basics.
Accessibility: Added proper <main> elements, focus traps in mobile nav, and CSS fallbacks for animations.
The One Thing I Skipped
There was a finding about converting inline SVGs to a sprite system. Honestly? With HTTP/2 multiplexing, the performance benefit would be negligible and it would take 2 hours of refactoring. Sometimes you have to know when to call it.
Real Talk on CSP
I wanted to implement a strict Content Security Policy, but the theme has inline <script> blocks everywhere for structured data. To do it right, I'd need to implement a nonce system throughout all the PHP templates. That's a project for another day.
What's Next
The audit is done and deployed. Cache is purged and everything's live. But I've got 9 failing Playwright tests that are exposing real layout bugs at the 320px breakpoint. The ov-site-card elements are blowing out horizontally on tiny screens.
That's my next target - fixing those mobile layout issues. Because passing tests are nice, but having a site that actually works on every device is better.
Two commits, 36 files changed, 601 insertions. Not bad for a day's work.