This is a simple change that can have a HUGE impact on your visuals. Even if the rest of your website is completely awesome, a blurry logo is going to make a bad first impression and harkens back to the days before high definition screens. If you’ve ever struggled with knowing the exact resolution to save your logo file as and/or notice that it still looks blurry no matter how big you make it, then you're probably still using either a png or a jpeg file. And now's the time to ditch those pixel based files for a crystal clear looking svg.
Wait, a what?
An svg is a vector file specifically for use on the web (svg stands for scalable vector graphic). (Remember my post about how great vector files are? I’ll re-post in my stories for anyone who missed it) This has the same advantages as a vector file in print- basically, you are guaranteed perfect resolution no matter what browser or device you use.
Here’s what you need to do
- First, get your logo in an svg format
You’ll need to start with a vector format to begin with (depending on what programs you have, AI/EPS etc), then re-save it as an SVG. In Canva, this is easy to do (see my reel)- just select “SVG” as the file type when you click on download.
- Second, install a plugin to enable SVGs
There are many to choose from, such as SVG Support and Safe SVG. Once you’ve installed, don’t forget to activate it.
- Third- upload your SVG
I find that SVGS uploaded directly to the media library work best.
- Fourth- Replace your logo in the Customizer or wherever your theme has the site logo setting
That’s it! Excited to see more great looking, crystal clear logos out there!