Over the last couple of months, I have found an unnatural interest in all things website design related. This, coming from the girl who still can’t load a youtube video on her laptop. It’s been a tough, random-entertainment-free winter folks.

Regardless of my lack of internet expertise, I am loving exploring the world of web design. While you probably can’t tell, I am constantly playing around with my blog’s dashboard. Changing colors, trying different themes, and learning new things about WordPress. While I’d love to do a complete blog redesign (and I will in the coming months), school has me more time constrained than ever.

Want to know one thing I learned the other day? Do you?

Wait for it…

I learned what a Favicon is. Sounds scifi right?

Have you ever noticed that little icon next to a website’s URL? THAT, my friends, is a favicon. And I’ve been a major favicon creeper lately, checking out the favicon of every single website I visit.

Design Sponge’s star like icon. Not my favorite, but I’ll take it.

Apartment Therapy’s weird, amorphous shape that is just kind of creepy.

Pinterest’s famous red lettering, that is surprisingly similar to the Phillie’s red P. Don’t ask me how I even know who the Phillies are.

Like most things, I was super critical of the favicons floating around the interwebs. Per usual, nothing was designed well enough, was pleasing to the eye enough, or basically solved my life problems well enough (as a favicon should). That is until I tried to create my own. Designing a tiny icon about 1/16″ square is a real bitch. I think I spent at least three hours in Photoshop trying to make my favicon shrinkable and still readable.

Some iterations for your enjoyment:

Font too big, with not enough white space around the edges. Also, that color is a little too last year for my liking.

Totally illegible. You know, because those things matter.

Better, but still a bit unreadable.

I decided to forgo text because it was obvious it just wasn’t going to work. And I’m not one to “make things work”. I usually just give up before that happens.

A quick Photoshop meadow rue sketch was my last attempt. Before I uploaded the image as a favicon it looked something like this:

I figured the image was small and simple enough to maximize the tiny space I was designing for. Also, in the midst of frustration, I realized a white background would eliminate the box outline and make the the image look like it is just floating next to the web address. Turns out, it works! Right? Please tell me it does.

Now, I’m going to have you totally favicon creeping. Go for it.