Posts tagged header
A Spectacular Look for your Blog


  • Pleasing hierarchy of organization through color or font
  • Strong, clean banner or heading
  • Crisp, colorful photos

These are the top three design elements that draw me into a website or blog. How about you? Have you ever thought about what keeps you coming back, besides content, to certain sites for news, ideas, or inspiration?

the original banner for this webhome

Through the great people of Alt Summit, I had the opportunity to learn from the talented Laurie Smithwick, cofounder of Kirtsy and owner of a design studio in Charlotte called LEAP design. I learned a ton, and I adored how she moved us from fine art examples to blog designs - a great recap of art history connected to our modern-day experience of art through computer screen.

Laurie had example upon example to illustrate her points, and already I know I'm not going to do her fabulous skills justice, but here are five simple, doable, put-it-in-your-purse takeaways for your own designs. And, if you can, sign up (for just $15) to take a class with her. You will be delighted you did. Seriously, delight.

1. Use your hotspots

Our literate brains are patterned to follow a certain path, and we transfer that information when "reading" the web. Generally we are drawn to the upper left corner, and then to the right top and then left side bar. Using eye-tracking heat maps (fancy pants technology), researchers have learned our routines so use this natural flow to your advantage (eg: set up your space to have focal points in these three areas). Or, if you choose not to have this flow (and Laurie gave us a lot of great designs that don't), think about the focus areas that you want your readers to follow. 

I like to think of it as a hierarchy of dot to dots. Where should the reader begin, continue, and end?

2. Become friends with white space




 
Did that emptiness there bother you? Did I lose you in the vast wasteland of white?

And there's an example of white space not helping.

But most of the time, white or empty space can allow your readers to enter into the space. If there's too much happening within the design of the page, there's no place for the eye to go. 

Laurie quoted Channel’s stupendous advice, "Look in the mirror before you leave, and take something away." I was inspired and went right to Blogger to add some easy, breezy white space to Pars Caeli. It feels like a great welcome mat to me.

3. "Your fonts are talking behind your back."

Direct quote from Miss Laurie. 

And, I knew they were. Fonts communicate the mood and style on your blog. Choose them carefully and choose them minimally, like 1 or 2, and at most 3. 

A classic serif font makes happy friends with a strong sans serif. For Pars Caeli, I decided that Didot (serif) and Bebas (sans serif) should be best friends forever. Sometimes we invite other whimsical fonts over for a playdate (like Learning Curve over on the right), just to make sure we're staying social and meeting new font friends.

Need to get out and meet some new fonts? Try some of these Laurie recommends:

FontSquirrel.com
Typekit
Google.com/webfonts
Dafont.com

4. Color, the short list

Color is powerful. Use the force wisely. Colors are not there to merely decorate your web space, but they can also play a unique function in guiding your reader through a site.  Are all your post titles in the same color? Does that connect to your menu or to your Instagram feed?

Readers want a way to organize their time in your space. Help them through the use of 1-5 consistent, beautiful colors.

I was torn on this one, and actually asked Laurie, "what if your banner has more than five colors, could that still work?" Funny enough, she took the time after class to come on over to Pars Caeli.

Here's one of my favorite tweets: "And your site is so lovely. I especially like your favicon! Beautiful work." 

I love my little cloud.


5. Look no further than your lunch for color inspiration

Seriously, she had made the most beautiful lunch. Greens, purples, earthy browns. And she used

Genopal.com/pic2color to make color palettes from a photo

Other great places for color palettes?


I found this color scheme through Design Seeds after salivating and daydreaming through 100s of great choices. I really have to set a time limit on myself when I hop over there to Design Seeds.


So there you have it, my friends. Ready to recreate and subtract? Even if you're not a blogger or web guru, consider how your fashion, stationery, magazine, and interior design choices follow many of these same guidelines. 

Put it in your purse and take it away.

Thanks for stopping over. It's been really wonderful to have you here.
XOXO,
MJ