ButlerBlog

chad butler's weblog

  • About
  • Blog
  • WordPress Plugins
  • Contact
Home / Web / Optimizing W3C Validation Buttons

Optimizing W3C Validation Buttons

By Chad Butler 1 Comment

I was recently working on one of my sites and had added the W3C buttons for valid XHTML and CSS (which actually validate, by the way). I regularly run speed reports on my sites as well and when I added these two buttons, I was not pleased with the result. Call me picky, but the extra image weight wasn’t necessary for what these buttons are. Since they are more for show and don’t really serve purpose for the user, why add the weight?

So I took the buttons and reduced the number of colors in the gif to see what we could do without onhealthy.net losing too much in the way of image quality. The originals were 128 colors. I found the least I could reduce it to and without losing too much quality was 16 colors. The results were pretty good, I think. The XHTML button was reduced in size from 1.68k to 805 bytes. The CSS was even better going from 1.23k to 656 bytes. Now I can load both buttons for less than the cost of the original XHTML button.

Here are the results. Feel free to use them in place of the originals (if your pages do in fact validate).

Original (128 colors) Optimized (16 colors)
w3c xhtml button - 128 colors w3c xhtml button - 16 colors
w3c css button - 128 colors w3c css button - 16 colors

Enjoyed this article?

Don't miss a single post. Subscribe to our RSS feed!

  • Facebook
  • Twitter
  • Email
  • Print
  • More
  • LinkedIn
  • Reddit
  • Tumblr
  • Pocket
  • Pinterest

Filed Under: Web Tagged With: design, tips, Web, webdev

About Chad Butler

Chad Butler is a freelance writer and web developer. He has developed several popular WordPress plugins and has written for forbes.com, sfomag.com, and investopedia.com. He also runs a small organic farm in east Georgia.

Join Us!

I will never share your information. No spam. No junk. No kidding. Unsubscribe anytime.

Recent Posts:

  • YouTube Success: Key Tips for Enhancing Video Optimization and Visibility
  • Mobile App vs. Mobile Website Ideal Choice for your Business
  • Top Strategies to Boost Your Brand’s Visibility and Impact
  • Advanced Blogging Strategies: Using Analytics, A/B Testing, and Conversion Optimization Techniques to Grow Your Audience
  • Unlock Real-Time Process Insights to Save Time and Money
  • How Writers Can Attract More Audience Attention
  • Dress for Success – Even at Home
  • Mastering the Art of Crafting SMART Marketing Goals
  • Rediscover Your Brand Story: 7 Tips for Refreshing Your Company Identity
  • Creating Engaging Content: Tips for a Successful Content Marketing Strategy

Archives

  • About
  • Blog
  • Archive
  • Contact

Site powered by WordPress, running on the Genesis Framework from StudioPress.

Unless otherwise noted, content on this site is © 2006-2025 ButlerBlog and may not be reproduced without express written permission from the author.

Some content may include affiliate links for which this site receives a small commission.