fbpx

The Header: Real Estate Website Theme Design Series, Part One

March 22 2013

tomato red theme design headerWe have designed a ton of real estate websites; nearly 1,000 to date. Every one of them began with a comprehensive Design Interview between client and the Real Estate Tomato creative staff. Each interview has us covering, in detail, several integral elements of the custom real estate website.

This multi-part blog series is an exhaustive overview of each of those elements.

Part One: The Header

It is my opinion that the header (the uppermost module) should be clean, direct, conspicuous, and expected.

Typical elements we expect to be included in the header:

  1. Your brand/logo/slogan
  2. Your most necessary contact info (name, phone)

Additional elements that are commonly included:

  • Headshot
  • Company logo
  • Ulterior navigation (home, about, contact, login)
  • Social media icons
  • Imagery (collage, hero image, slideshow)
  • A must-see call-to-action
  • Site content search
  • Content subscribe Call-to-Action (email/RSS)

Common Header Types for Real Estate Websites

The goal of the header (or website for that matter) is to make an impression that connects with the target audience. If your website's goal is to be super clean with more-than-obvious calls-to-action, then a minimal header could serve you best. However if instant brand recognition is important, then a big first impression header may better suit your needs. Or maybe you need to steer your audience down an obvious path--an engaging header.

The Minimal

These headers tend to take up very little vertical real estate and include only the most basic elements. A band of color (or white space) anchors it to the top of the viewing area.

Ex: tomato header minimal

Ex: tomato header minimal2

The Big Impression

The impression that you make is to be obvious:

  • Your location (landscape, landmark, skyline...)
  • Type of property/niche (luxury, first-timers, foreclosure/short-sale, architecture...)
  • Your personality/image (headshot, bodyshot, personal logo...)
  • Your brand (over-sized logo, obvious website theme...)

Ex: tomato header impression1

Ex: tomato header impression 2

Ex: tomato header impression3

The Engaging

When you need your audience to react to a specific call-to-action, placing it conspicuously in the header will get the job done.

Ex: tomato header engaging 1

Ex: tomato header engaging 2

And of course, you could always have a combination of any of the above.

Read Part Two now--an overview of the real estate website Navigation!

To view the original article, visit the Real Estate Tomato blog.