October 13

Creating an Awesome Header for Your Website

5 Tips for designing awesome website headers

When it comes to creating gorgeous websites, strategy is at the center of everything I do, and this includes designing awesome website headers! So today I am going to share with you my top 10 tips for designing your own gorgeous website header, and for fun I am tossing in a copy of tutorial videos for my WordPress and Squarespace users our there!

Tip #1. Emphasize the most important elements

It is likely that your website contains a lot of great information, but some of that information is more important. Like how to get started working with you, or what amazing services you have to offer. Making those key important elements about who you are and what you do a big part of your header is a must if you want to connect with your dream customers.

A couple of questions to help you decide what to include… 

  • What is the very first thing I want potential customers to do?
  • What is very best way to contact me?
  • Have a shop of fabulous goodies for sale?
  • What is my best service offering?

These are some of the elements you want in your header!

Tip #2. Use clear, readable fonts

Fancy fonts are fun, but they have a place, and it is not in your header. Make sure the fonts you use are clear and easy to read, not just on your computer or laptop, but on your tablet and cell as well.

Want a little help finding the best fonts for you and your brand? Check out this totally FREE Branding Your Biz Masterclass where I show you how to choose the perfect fonts to represent your business along with creating a color palette and logo!

Tip #3. Use transparent headers for sites with impressive images

Are you using some amazing images at the top of your website pages? Why not give them a little more emphasis by using transparent headers that lay nicely over top of those images.

A couple of things to consider when creating a transparent header…

  • Make sure that the menu items are still legible when placed over top of the image
  • Check all devices to ensure your menu is legible, because an image that looks great on a computer or laptop may not look great on your iPhone.

Tip #4. Choose a layout that flatters the logo

Logos come in all shapes and sizes and not all are going to look fabulous in every header layout. So choose the layout that compliments your logo, or if you are just getting started, create a logo that works well with the design you want to create.

Another tip about logos, create different variations so you always have one that works…

Web Designs by Teresa square logo small   

Tip #5. Use design elements that express your business’ personality

The personality of your and your business should shine through in every corner of your website, and this includes the header as well. If you are all about simplicity create a header that is effective yet simple. If you are all about elegance, add in design features that speak of the elegance you create.

And if you are needing a little help clarifying the personality of your business I want to again encourage you to check out the FREE Masterclass Branding your Biz! 

BONUS TIP! Make it easy to connect with you! 

So I just got off my Website Wednesday chat with Business Coach Nancy Ganzekaufer and thought of one thing I forgot to mention. (We all have forgetful moments, right?) This bonus tip is of course making it easy for your website visitors to connect with you. This could be by emphasizing your Contact Me link, or adding social media icons to the header. Whatever it is that works best for you is exactly what you should do. 

And now for the tutorials I promised in the beginning…

Here it is the moment you’ve been waiting for… or the part you just scrolled to! The Squarespace and WordPress tutorials for designing awesome website headers!

Hey there Thrive Theme users! This video is for you. One quick note, I am focusing on the new Theme Builder options which if you don't have you are going to want to upgrade after watching this video! 

Hey there WordPress users! This video is for you. One quick note, the options available to customizing your header depends on the theme you are using and your view may vary a bit from mine. 

Hey there Squarespace users! This video is for you. One quick note, I am showing you how to make changes in Squarespace version 7.1. If you are using Squarespace 7.0 and need a little help, send me a message and I'll be happy to help! 

Branding Your Biz FREE Masterclass

Need a little help identifying the personality of your business? Check out my totally FREE Branding Your Biz Master Class! 

  • Create your own logo with simple to use free tools
  • Choose brand colors that connect with your ideal customer
  • Identify fonts that best represent your brand personality
  • Finish by creating a Branding Style Guide to use for all of your marketing needs

A little bit about Teresa...

Hello! I am so glad you are here, and I am excited for this chance to tell you a little bit more about me! I am an accidental web designer who found this dream job totally by accident! (Isn't it great when that happens!) And now I have the pleasure of spending most of my days building gorgeous websites through Squarespace and WordPress. I also have a couple of amazing grown up kids, 4 dogs, 3 cats and 9 chickens! And when I am not geeking out of some new design, you can find me hanging out in southeast South Dakota. 

Teresa Schlup

You may also like

Finding the Best Web Design Platform For YOU!

Using Testimonials on Your Website

Leave a Reply

Your email address will not be published. Required fields are marked

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}

Never miss a post! Sign up now to receive weekly tips sent straight to your inbox...