Every year designers look for the new, the unique and the innovative. And every year they are not disappointed. Website design, particularly for home pages, continues to reflect the changes in consumer demands as well as what newer technology makes possible.

It is easy to get carried away with the latest creative innovations and to dive in to new techniques, but there is a cautionary tale to tell too. Design must meet the emotional needs and the standards for engagement of the visitors who may become customers/followers.

Take a Step Back

All homepage design is, essentially, a sales pitch. Whether you want a visitor to enter the sales funnel by some type of conversion; whether you want a visitor to be in enough awe to check out the other pages; or whether you want a visitor to become emotionally engaged (e.g. a charitable cause), you have to think in terms of the customer, not your design preferences or what you think would be “cool.” It’s easy to get carried away with such things as parallax and scrolling, but be willing to pull yourself back and consider who you are designing for. While new eye candy is exciting, it must fit the brand and the audience, so tread carefully. Here are some important do’s and don’ts that will always prevail, no matter what new design “trends” may appear.

1. Do Form an Intimate Relationship with the Brand and its Customers

Whether it is a toy company, a luxury jeweler or a charity website, every organization has a brand and a brand image to portray. This requires lots of study and research, not simply what a CEO or CMO might say. How is the company portrayed on social media and its current website? What is the “culture” within the company itself? Where does the company stand within its industry? A KIA is not a Cadillac and vice versa. A traditional bank is not a new and innovative lender. Every organization has a personality, and any home page must match that personality.

Know the Customers – Get a Profile Put Together:

Likewise, every brand has customers, or potential targets. When content marketers plan their strategies, they are careful to create content that will appeal to their customers. They develop a customer persona that is highly detailed. If you are designing for an organization, get with the CMO and get that customer persona. If one has not been developed, you will need to ferret out the demographics of its typical customers and/or its target market, before you begin to design. You design must appeal to that customer, not to you or anyone in the company.

What appeals to a company owner may not appeal to his/her customers. Sometimes it is difficult to convince company owners of this. In 1971, Carolyn Davidson, and art and design student, designed the Nike swoosh. Phil Knight was not thrilled with it, but agreed to give it a try. It’s a good thing that he went with the designer and not his own initial thoughts. You may have to be a bit assertive here, and diplomatic in that assertion. If you cannot get agreement, suggest A/B testing of two designs. The proof is in the numbers of those who stay longer and who convert in some way.

2. Do Study Psychology of Visual Content and Use it as You Design

The psychology of marketing has always been tied to text that is used – create a sense of urgency, appeal to the desire to belong, etc. There is also a definite psychology of visual content, and neuroscience provides us with more information on this every year. Some of this is covered in design school, of course, but some is not. The psychology of design relates to the text you use but also to the principles of neuropsychology imbedded in the visuals you create.

• Visceral Responses: We have all had these experiences. We look at a main page and absolutely love it (or hate it). We cannot say exactly why, but our subconscious mind is reacting to some triggers that the visual has activated. Psychology tells us that these types of reactions are usually activated by basic desires and needs – safety, threat, comfort, love, survival, etc. Using a pastoral or peaceful water setting, for example, will evoke a pleasant feeling, but and open and sleek design actually promotes a feeling of safety and security – something we may not realize.

• Eye Movement: If you have not read up on neurolinguistics programming, you should. This branch of neuroscience relates specifically to eye movement on a page. Some of this research has resulted in the “Rule of Thirds.” You’ve read and practiced and used grid designs a lot. The rule of thirds, however, relates to where the eye goes when it first hits a page – there are 4 spots that are formed by the intersections of a tic-tac-toe page division. Take a look at this page:

  

  The most important element of the page is put in one of these 4 intersections. The lower intersections are below the fold, which may go against traditional design “rules,” but neuroscientists disagree. If you want more information to be seen you can use carousel and put it in the area of top two intersections. It is very common method and used widely nowadays.

• Mood and Tone/Color: The design must match everything about the mood and tone of the product or service being offered. Most designers, of course, know this, but color psychology plays a major role in establishing that mood, tone, and emotions:

  

3. Do Experiment with Patterns; Don’t Overdo Patterns

There are three types of patterns you can use, but, again, when you choose a pattern, be careful – it must match the mission of the organization and must not be overdone.Fortunately, there are so many resources and apps for patterns, you will find one that will match. Here are some pattern examples that speak to a company’s purpose and personality.

• The Generative Pattern: These are repeating patterns – geometric designs, particles, etc. Some can be quite subtle; other can be bold and compelling. Here are examples of each:

  

  This pattern is subtle and soft – for a French music composition site.

  

  This pattern is for an Italian contemporary furniture company. Against this moving pattern, images of furniture fly in and across the page.
  Both of these patterns help to enhance the identity of the organization and appeal to its customer/follower base.

• Data Patterns: Lots of companies sell more abstract services, not concrete products. The background patterns used should reflect that. These patterns can be inspired by mathematics or high-tech, and can give a feel of “beyond worldly.” Here is an example of a very subtle and minimalist data pattern for Optimizely:

  

• Parallax: Many designers are experimenting with parallax, and the impact can be quite stunning. While you obviously cannot see the movement, here is a website that does it perfectly.

  

  Maaemo is an upscale Norwegian restaurant. The clouds skirt across the sky while the name remains stationary. Parallax can be amazing, but only if done right. The rest of the visuals and text cannot be too busy, or the entire effect is lost, and the visitor is left confused and bombarded.

• Animation Patterns: Moving parts can be a great attraction, and there is newer technology that makes them quite fun and compelling. Further, the ease with which designers can now add animation has caused some to go a bit overboard. Again, consider the audience and the company personality before adding animation. Here is an example from Manchester Masters Fieldwork, a British web design company, demonstrating the type of animation they can produce. You cannot experience the animation of all of the looping and movement. It is, of course, an exaggeration, and would be appropriate for a site selling kids’ products.

• Grid Patterns: A traditional grid design can be used to place background objects in a symmetrical pattern. Consider this background grid pattern for Aark Collective, a seller of watches – perfect.

  

• Bleeding:This is a relatively new but worthy design element, appropriate for certain types of companies. Essentially, a pattern begins on the content page and then bleeds into a solid color background. Here is how Web Designer Depot used to have it for their own site.

  

4. Do Look for a Unique Way to Design Buttons

Using traditional navigation buttons can be a bit boring. They don’t have to be if then can be incorporated right into the homepage design. Here are a couple of ways in which designers have put some fun into a page and its buttons.

Take a look at the home page of Small Stone – they sell videos and music. The menu has been designed into an old-fashioned sound board, and the knobs are the navigation buttons – pretty unique.

Custom Tshirts is a British company that allows customers to design their own t-shirts. The navigation buttons are placed on the t-shirt, along with other menu items further down.

5. Experiment With Menus

Just like buttons, menus can be pretty boring too. Plus, they can detract from an otherwise nice design. Hiding the menu has now become pretty much understood by visitors as long as it is in the upper left or right-had corner with the three-bar hamburger element. This cleans up a site. There are some drawbacks, so do your research and see if it’s right for the organization.

Still other designers have experimented with making the entire home page the menu as in the following:

6. Make Forms Pleasing or Fun:

A form is not usually on the main page of a site, but it does work for some companies, if the design is either pleasant or provides a bit of fun for the visitor. When the form matches the theme, you might be able to get away with it. Here are two examples of forms housed right on a home page:

Might be a good idea for a travel website.

Here is a sample for a UK design and branding agency.

7. Do Add New Stuff To the Home Page Often; Don’t Let it Go Stale

People like variety, and it’s pleasing when they return to a website to see some new images and text. Keeping the logo, theme, colors, and navigation elements the same will let them know they are on the right site, but new stuff is good to do.

Portuondo is a home décor website that offers a new image on its home page regularly, and it may keep visitors and customers returning just to see what new design idea is being featured.

8. Don’t Overdo Text

Of course, you must have text. A visitor needs to know where s/he has landed, and that is the first task of any text. Beyond that, however, be minimal. Some of the most striking home pages has almost no text, and this allows visitors to take in the design and enjoy it for just a moment before they begin to navigate. And, of course, it goes without saying that fancy script is only for large headings and only if it is in keeping with the mood and tone of the company.

9. Try One-Page Website Design

Everything is on the Home Page, and the visitor just scrolls. These sites only have to load once, and you can put buttons at the top to take a visitor to the place on the page for specific information. These are particularly popular with people like you and other artists.

10. Don’t Use Front Page Carousels

It’s probably not nice to end with a negative, but, as popular as these might be, there are lots of issues with them. They might add some visual interest, and certainly they do reduce the clutter on a home page, but there are definite drawbacks. They are bad for SEO, they can create performance problems (load time, image resolution, etc.), and important other content may have to be placed below the fold.

Conclusion

There are certainly lot of other do’s and don’ts for web design. You probably already have your pets and pet peeves. There is really only one key takeaway. The point of website design is to merge you, the designer and the artist, with the organization and its consumers. And the most important of the three is always the consumer. If you remember to design with that target audience in mind, you will achieve the mission of great homepage design.