Since most website visitors only spend a few seconds analyzing a new website before deciding whether to engage with the content further or click the back button to search for an alternative, your home page content plays a vital role in capturing attention and encouraging visitors to stick around long enough to turn into customers.

So today, let’s look at few different ways you can use home page introductions and other site design elements to capture these cold visitors and ultimately improve your site’s conversion rate.

1 – Styling your home page

The first thing you’ll want to decide when creating a home page introduction is how your page should be styled.  For example, when you land on the Single Grain website home page, you don’t see any old blog post or a page that lays out everything about the company right away.  Instead, what you see first is a home page introduction that shares the most compelling reasons to work with Single Grain right away:

This type of home page introduction – basically, a separate home page that’s designed to capture visitor attention quickly – can be seen across a number of other major sites, including Crazy Egg, Zaarly, Rhapsody and more.

However, this isn’t the only type of home page introduction you can – or should – use.  The specific type of home page introduction that’s right for your website and your business will vary based upon a number of different factors, and can really only adequately be determined by split testing.

The following are a few examples of other types of home page introductions you may want to experiment with.  First up is the traditional, long form sales letter, which is most often used if you’re selling a single product at a high price point.  In this example, the Market Samurai website uses a traditional copywriting headline and video clip to capture interest:

Yet another alternative can be found in sites that don’t use a separate home page, but instead integrate a message to visitors into the home page alongside other content.  In this example, blogging expert Chris Garrett introduces a main focus element that serves as a home page introduction for new readers without eliminating the presence of other types of content.

It’s also worth considering that your site might not technically have one “home page”.  If you receive traffic from a number of different sources – for example, organic search, PPC ads and social networking sites – these visitors may all be landing on different pages throughout your site.  For this reason, it might make sense for you to create multiple landing pages – each with their own unique, targeted home page introduction – that can be customized to each specific referral source.

As an example, web designer Eric Hall uses the following Twitter landing page to connect guests that click through from the social networking sites with the information they’re looking for right off the bat:

2 – Use traditional copywriting techniques

Of course, while it’s important to choose a home page introduction style that’s appropriately targeted to the type of visitor you’re receiving from each traffic source, it’s just as important to use the right words in each of these instances to encourage prospects to stick around.

For example, in Chris Garrett’s home page introduction featured above, the words “Sign up right now for email updates and get these two free ebooks” follow established headline guidelines that promote a feeling of urgency (“right now”) and demonstrate value to the user (“two free ebooks”).  Garrett has seamlessly integrated standard headline techniques into his site’s design in order to create a compelling home page introduction.

The Single Grain home page also makes use of traditional copywriting techniques by starting with a “feature” – in this case, “More Traffic” – and translating that feature into benefits for the user (stated here as, “Rank Higher. Get Exposure. Increase Revenue.”  This home page introduction takes the obvious goal of improving traffic and transforms it into benefits readers can imagine, all while encouraging them to take the next step of either downloading a report or working with the company.

Now, plenty has already been written about how to write the compelling headlines that’ll make visitors want to stick around on your home page for a while.  Check out any of the following articles to learn more about how to incorporate traditional copywriting techniques into your home page introduction:

• 5 Types of Killer Website Headlines (Single Grain)
• 8 Different Types of Headlines Which Sell (Trevor Crook)
• 9 Proven Headline Formulas That Sell Like Crazy (Copyblogger)
• Steal These 15 Headline Formulas for Your Next Landing Page or Blog Post (Crazy Egg)
• 7 Proven Headline Formulas That Capture Your Reader’s Attention (Intuit Websites)

3 – Test your home page

So now you’ve got your landing page structure and you’ve got a fancy headline that’s sure to generate interest in your site.  Here’s the problem…

As webmasters, we pour so much effort into our sites that it’s hard to imagine that we haven’t come up with the most perfect page possible.  After devoting hours to building a new page or to creating just the right headline, it’s nearly inconceivable that a better, more effective solution might exist out there.  But the truth is, the only way to know for sure that your page is as good as it could be is by backing up your assertions with actual data.

For this reason, it’s critical that you test different elements of your home page introduction to be sure it’s working as well as you imagine that it will.  The following are a few of the different types of tests you’ll want to conduct:

• The “Five Second” Test – Essentially, the five second test script attempts to replicate a user’s initial viewing of your site by giving testers access to a screenshot of your site for just five seconds and then requiring them to answer questions based on what they perceived.  This can be a fascinating way to determine whether or not viewers are able to identify and process your home page introduction within that crucial new site visit window.
• A/B Split Testing – Even the smallest elements can make a big difference in user engagement.  For example, swapping out a different home page image or even changing your font color could result in dramatic improvements in your average time on site.  To get started with split testing, check out Single Grain’s list of “Different Elements to Split Test on Your Website.”
• Heat Map Testing – Another great way to determine whether or not readers are honing in on your home page introduction is with the use of heat maps, which track users’ mouse movements across your site.  There are plenty of different heat map scripts out there, all of which operate by displaying a graphic overlay of your website that indicates “hot” areas of your site (where readers are focusing and clicking).  If your home page introduction isn’t a “hot” area, you’ll want to rework your page to feature this element more.

It may take some time to find the ultimate combination of layout, design and wording that results in the highest possible level of visitor engagement, but as your conversions start to increase and your average time on site improves, you should quickly see the benefit of investing time in these efforts.

Image: orange mushroom

Unfortunately, paying so little attention to color selection does a huge disservice to your company and your website, as it prevents you from taking advantage of one of the most potent psychological triggers around. You see, you might not be aware of it, but different colors tend to evoke different feelings subconsciously. By understanding basic color theory, we can select colors for our websites that are most likely to bring about the actions we want our visitors to take.

But first, just to clarify. For the purposes of this article, I’m not talking about choosing web safe colors. Although color display was a major concern back in the 1990s, computer monitors have come a long way in terms of the percentage of the color spectrum they’re able to display accurately. If it’s something you truly feel you need to address, you can always run your final selections through a rendering tool to see how they’ll appear on most browsers. But in 99% of cases, it’s not worth worrying about.

Instead, what we’re going to talk about here is the emotional and psychological impact of different colors and how you can use these associations to your advantage. Let’s get started!

First, we need to review each of the major color groups, as well as the subconscious perceptions we associate with them.

Black – The color black has some interesting connotations. It’s a somber color, and people frequently associate it with evil or trickery. However, it’s also a color that represents authority and intelligence. For example, think of Ph.D. graduates in their black robes or of the dark-rimmed glasses worn by librarians, professors and other astute professionals. Consider black when you want to convey the seriousness of something on your website.

Red – Red is an energy color that subconsciously reminds us of the heart pumping rich, red blood. Imagine yourself surrounded by red – does your heart start to beat a little faster or do you feel more excited or anxious than usual? Red will do that to you. It’s great for attracting people’s attention, but should be used sparingly so that its effects aren’t muted by overuse.

Yellow – The color yellow is another energy color, but instead of provoking anxiety, it typically brings about feelings of cheerfulness or optimism. Yellow is a happy color that makes us think of sunshine, dandelions and other positive forces in our lives. Like red, it can bring about powerful emotions and must be used sparingly to that the sensation isn’t deadened.

Orange – Orange is often seen as a wild and wacky color. It’s flamboyant and in-your-face bright in a way that’s associated with energy, rebirth and ambition. Unlike other colors, which can convey a range of feelings depending on their shade or hue, orange is almost universally bright and vibrant – no matter what its saturation.

Blue – Blue is the color of calm, of focus and of rational thinking. In fact, many people report feeling more focused and productive when working in a room with blue walls, as this naturally peaceful color helps to induce a sense of well being and restfulness. Some studies suggest that being exposed to certain shades of blue can actually lead the body to release calming chemicals, which has powerful implications for the use of this color in website marketing.

Green – The color green is another interesting one. Like yellow and blue, it’s associated with natural elements (it is the earth to the blue sky and the yellow sun). But while it can be calm and soothing in the right tones, green is also associated with a wide variety of items and concepts, including jealousy, fertility, good luck, conservation and – of course – money.

Purple – Most people are aware of the association between the color purple and wealth, as the royalty of old frequently wore robes dyed with this rich pigment. However, it isn’t as widely known that this association remains in our subconscious minds, leading to a continued link between different shades of purple and the ideas of money, prosperity and richness.

White – As the purest color in the spectrum, white is frequently associated with symbols of purity, cleanliness and safety. In some contexts, it can be used to represent potential (as in the use of white boards and blank slates, both of which are free and clear to receive new ideas).

If that all sounds a little hokey, don’t worry – it’s time to get out of the theoretical part of our discussion on color theory and move forward with how to apply these associations to your website! Let’s look at a few examples…

Suppose you were building a website that sold a very high priced information product. While you certainly could build the page based on the colors used elsewhere on your site or the colors of your logo, why not experiment to see if elements of color theory could improve your conversion rate?

For example, you could build the background of your site in a warm blue color to artificially induce a sense of calmness in your readers to help counteract the feelings of anxiety associated with spending large amounts of money at once. In the sections where you attempt to demonstrate your authority or overcome objections, you could use black to create a sense of patrician reassurance.

Finally, if there was a benefit you really wanted to highlight about your product, you could draw attention to this part of your sales copy with a red arrow to create a sense of urgency and excitement. If this sounds familiar, it’s because the motif is frequently used in long form sales letters for this exact purpose.

Or, let’s look at another example. Say, in this case, you aren’t trying to sell something – instead, you’re trying to build an authority blog in a given niche. If your site was built in the financial industry, the best possible color combination seems obvious – green, the color or money, and black, the color of authority. If you were writing a lifestyle design blog based around the idea of freedom and self-expression, creative colors like yellow and orange would resonate best with your content.

Of course, it’s worth remembering that these are general rules for individual colors. Different people will respond to colors differently, and combining colors together can lead to completely different emotional responses than each color creates on its own.

However, color is incredibly powerful on a subconscious level, which makes it worthy of further study and experimentation on your website. As you’ve probably guessed, the best way to test the power of color on your site’s conversion process is by split testing different versions of your site using multiple color variations. By carrying out these tests, you’ll be able to see the true power of color theory in action.

Image: glovsky225

It’s a pretty common thought that SEO and Flash live on two different planets. If you want to have a great site that ranks organically, you can’t have Flash. If you’re some fancy artist whose SEO potential is limited, you need a flash site to show your flair – because the artistic potential of HTML is limited.

Martin Luther King said “I have a dream..” and I will say the same. We don’t have to segregate these two functions, and in fact, they can both enhance one another in positive ways.

Flash Can Create Great Content for SEO

Although a page shouldn’t exist entirely in flash, having a one-off flash page can actually help your overall SEO efforts. Kayak recently released a beautiful travel map that allows you to immediately find the prices to every major location around the world from your original destination. Although Kayak’s map isn’t utilized through flash, it has a relatable Ajax/Javascript implementation that is substandard for SEO.  Despite this, the huge amount of inbound links the interface created has increased the overall domain strength of Kayak.com. At the time of this posting, the travel map page alone had attracted 1,840 links.

Given the great amount of links it drew, Kayak still has the ability to rank for a moderately strong keyword with an optimized title tag on this page. They currently actually rank on the front page for the single-word term “explore”, although it has no monetary value for their company.

Utilize “Floating” Flash

You also have the option to create “floating” flash. Floating flash moves with the page, but exists as a foreground piece rather than an encompassing background image. Billy.com is a good example of this. If you check out their movers page, you’ll see it in full force as the moving truck moves in. The setbacks of this setup is that the flash can sometimes impede on the background HTML, making it difficult to click links. It’s a give-take situation, however, where the site creator must leverage the benefit of creating a unique site against the temporary setbacks “floating” flash sometimes causes.

Split Interfaces

The most common, and easiest implemented SEO-and-Flash friendly interface is the Flash on top, written content on bottom. This works well for sites that need flash to properly explain what their product does. For example, Empowerkit has a beautiful top-flash that explains their product, with plenty of content on the bottom to support SEO efforts, even though their product isn’t especially SEO friendly.

If your site doesn’t need much explanation, I would recommend against flash in this instance, as often times, it serves more as a distraction than a benefit. Here, the flash serves as a draw to inform the reader of the strong offerings Empowerkit supplies, so it is worth implementing.

The Point? Don’t Rule Flash Out

As a SEO and internet marketer, you should never rule out something that could potentially help your campaign. It may seem counterintuitive that flash could help your SEO, but in many cases, that’s exactly what it does. It just has to be implemented properly to get the full benefits of your efforts, and sometimes, you have to think about it as offering more plusses than minuses, rather than only positives.

Like fancy things like flash? Follow Sujan Patel on Twitter to get more, or become a fan of Singlegrain on Facebook.

One of the most critical errors businesses make is ignoring SEO in the initial web design process. Many of these errors can be covered up or improved slightly, but large gaffes in design can cause long term traffic loss and a quick path to an unsuccessful business.

Sometimes web designers can consider themselves proficient in SEO, but still miss certain areas in the design process, or not want to interfere with design dreams of the businesses they are creating a website for. As a business owner, it is important to keep every step of the web design process in mind and be knowledgeable about it when thinking about your own perfect design.

Step 1: Domain Registration

Ideally, a good domain name will be short, and contain some relevant keywords for your business. At this late stage in the domain registration game, if you aren’t willing to pony up a good amount of cash for a domain name, this is unlikely. A better bet is to use your company name and ignore “over-SEOing”, a frequent error of many business owners.

Keyword Stuffing in URLs
Instead of using a business name, many businesses will flood their URL with keywords in their vertical, hoping that this will mean immediate rankings in the search engines. While it may help in the short term, these kinds of domain names will lower usability, result in less clickthroughs, and also less links to your site as other linkerati determine the same thing.

Bad Example #1 – http://www.losangelescaliforniacosmeticdentist.com

Bad Example #2 – http://www.couponsdiscountspromocodes.com

Hyphenated URLs
Hyphenated URLs are commonly used because the initial keyword combination has already been registered. Unfortunately, these URLs aren’t nearly as attractive as they may seem. Studies suggest that these are seen as a poor quality signal to the search engines, and they retain many of the same qualities as the URLs that keyword stuff: lower clickthrough rates, and a strong sign that your website is not one worth linking to.

Bad Example #1 – http://www.sports-news.com

Bad Example #2 – http://www.cheap-airline-tickets.com

Poor Top Level Domain Choices (TLDs)
There is more data (and popular opinion) to suggest that many TLDs are looked at poorly over more popular TLD choices, such as .com, .org, or .net. While it isn’t a necessity to choose one of these TLDs, it’s our strong recommendation that you only choose a differing TLD if it enhances the brand or user experience in some way.

Good examples of ways a TLD can enhance user experience are with URL shorteners (bit.ly, is.gd), a music site (last.fm, has a connection to radio FM band), or television (TNT.tv).

Using it primarily as a way to get your keyword in the URL is probably a bad idea and will lead to the same long term problems that the previous two mistakes create. Even if the search engines view all TLDs equally, users don’t.

Bad Example #1 – http://www.sportsnews.biz

Bad Example #2 -  http://www.cheapairlinetickets.tv

Step 2: Website Planning

And next comes an arguably more critical part of the implementation process – the website planning itself. From top to bottom, SEO must be kept in mind, or the website will face some long term problems that may be difficult to repair.

URL Structure & Site Architecture
The biggest, and most difficult to repair problem with many websites is their initial URL structure and Site Architecture decisions. If a company starts a website and creates a five-level-deep site architecture to get to a prominent keyword, such as http://www.website.com/shop/buy/keyword.html, there is a significant link juice distribution problem that may be near impossible to repair.

Business websites should have URLs they want ranking two levels deep, at most. The deeper in the URL and internal linking structure a keyword is, the more difficult it becomes to get that page to rank for the targeted terms. Furthermore, some companies won’t even have keywords in the URL, making it even more problematic to get the desired results in the SERPs.

Content Usage
Content problems come in two forms – not enough of it and duplicating it too often. Some websites will use Flash and JavaScript too heavily and completely ignore standardized text. This text is a strong sign of keyword relevancy to the search engines and is vital to get pages to appear properly optimized for a search term you want to rank for.

If you are putting this text in JavaScript, Flash, or within images, you are short sighting your SEO efforts. Strong content is important both for user experience, and for helping the search engines connect your website to the keyword you desire.

JR.com has insufficient content on the page for MP3 players.

The second mistake is content duplication. Several websites will repeat a piece of content on several pages, most often product pages. This can come off as a duplicate content error to the search engines and cause some pages to be deindexed or devalued, or worse, make the search engine hate the entire site.

As a standard, try keeping about 30% of your content on page unique, if not more. If you have difficulties creating unique content for an enterprise-level site with thousands upon thousands of product pages, think about outsourcing content creation to cheap content providers such as Textbroker, Odesk, or ELance for affordable writing options.

Title Tag & Image Optimization
Other new designers will often forget to properly optimize their title tags or images for their SEO efforts. Luckily, this error is the most easily fixed, and can be done after the fact without much issue. However, a lack of initial title tag and image implementation is probably a good sign that the actual page itself is not properly optimized for a keyword, something that might not be so repairable after the fact.

Keyword Research
When initially implementing your website, you should have already done thorough keyword research on your industry. This will give you a structure to base around when creating your pages, navigation, and overall strategy. Even if you do every other step right, if you’re targeting keywords with little traffic opportunities, much of your effort is wasted.

Step 3: Website Rollout

There’s more to the initial design process than just the on-page design. How you roll out your SEO campaign can be a strong impact on how quickly you rank in the SERPs, and a mismanaged implementation can mean a four or five month process of getting your site seen as trusted in the search engines.

Beta Invites
If your business is some sort of web application, a good way to get links, and hype, is by offering beta invites to power bloggers on the internet. They will frequently write reviews of your service, offering high quality link juice, and also provide some much needed hype if your application is indeed up to snuff.

Don’t just send out a template to reach these bloggers. Throw out personalized, detailed inquiries that will grab these influencers. For a good list of tech influencers and a little inquisition on how they like people to query them, check out Techipedia’s post on How to Get an Influencer’s Attention.

HQ Link Directories
Every website should start their rollout by submitting to the biggest, most trusted link directories immediately. Single Grain recommends Best of the Web, Business.com, Joeant.com, and the Yahoo! Directory.  Getting your business on these four directories is a great first step to getting seen as a reputable site to the search engines.

Local Listings
If you’re a local business, make sure you get your business cited and submitted to as many local listings as possible. Getting in the “10-pack”, or the local results, is relatively easy if you optimize efficiently. You can use Getlisted.org to see if you’re included in the most important local directories.

You’re ready to start! The SEO process isn’t done, actually, it’s just beginning, but at least you haven’t ignored the implementation steps that matter most if you utilized this list. As you progress forward, think about structuring a SEO campaign with long-term focus. This important next step will help your site continue its’ success in the SERPs.

Ross Hudgens is a SEO Analyst for Single Grain. Follow Singlegrain on Twitter here.

When you optimize a web design you are optimizing for the search engines, but you are also creating a web environment that is meets the needs of your visitors.

Pleasing Your Visitors

There is a basic list you need to implement in your web design:

• Easy Navigation – do not make navigating your site difficult at all. Some people do not know how to look, they do not want to look hard and some of your visitors will have physical and/or mental disabilities. For example, if your users have to see a particular color to find the navigation you could be eliminating any color blind visitors to your site. Make the navigation simple and make sure any visitor can use it without problems.

• Scannable Content – this means creating headlines that people can scan to see if your page has the information they are looking for. People always scan, so create headlines that describe the paragraphs. This way you allow readers to quickly find what they are looking for and once they start reading you have an opportunity to sell your products or services. Additionally, you should use keywords/keyword phrases in your headlines for optimization. Headlines are a crucial part of any web site.

• Content With No Spelling or Grammatical Errors – This may seem like a no-brainer, but there are so many business web sites with errors that make them appear less professional and trustworthy.

• Understandable & Informative Content - no one is an expert in everything. You may think that everyone knows the proper way to plant a palm tree, but in reality the majority of people coming to a site selling palm trees would have no clue where to start. You have to write content that is easy to read and in a non-condescending way explain everything point by point. If someone is an expert in your field they will skim past the things they already know, but someone that is looking for the services you provide is seeking to understand the process and gain confidence that you know what you are doing.

• Be Congruent – you want your pages to be similar in design/organization. If every page is different the visitor may get tired of looking or get confused and leave.

• It Should Load Fast - no one likes to wait for a page to load. We have all been to sites that take a long time to load and what do we do? Say, “forget it” and back out. Pictures can really mess up your loading time. Use a program like Photoshop and try to shrink the size of the picture, but try to maintain the quality of the picture.

• Follow W3C Suggestions For Accessibility – W3C.org has some testing recommendations all webmasters should follow to ensure your visitors have complete access to all areas of you site.

Search Engine Optimization (SEO)

There are some very important things SEO does for a web site and without them a site will not do well. An SEO Friendly Web Design will:

• Make the site easy to find on the search engines

• Adhere to Google’s Webmaster Guidelines

• Appear in the SERPs for relevant keywords and keyword phrases

• Include the right amount of optimized content, as well as optimized headlines and meta tags

• Have clean code for the search engines

• Be crawlable- search engine spiders and bots should be able to smoothly move through all of the pages on your web site

• Avoid content in frames

• Be W3C compliant

• Use anchor text effectively

• Interlink relevant pages throughout the site

• Have a sitemap with text links to every page

In Conclusion

An SEO Friendly web site design should please all web site visitors; this means those that have complete knowledge about the subject of your site and those that know nothing about the subject. It should also meet guidelines set by the search engines and be properly designed for search engine spiders/bots. Most importantly, your web site should be easy to read and navigate

1. Focus On Audience
Make sure the website is easy to use. Keep in mind that a visitor needs to be able to easily navigate through your website to complete the sale. If you’re selling a service, the visitor needs to be able to find the service that they are looking for, find information about it and easily be able to contact you. The best visitor is a returning visitor, so make sure a visitor’s experience is great.

2. Set Goals
A successful redesign takes time, careful planning, and thorough testing. Sometimes you don’t even need to completely redesign your website. It may have an excellent design, but be impossible to navigate through. Remember: if it isn’t broken, don’t fix it. You will need to establish long term goals and short term goals. The short term goals serve to help you work up to the long term goals so that everything can be tested after each short term goal is achieved. The last thing you want is your website’s traffic and/or conversion to decrease. So before you do anything, figure out what is wrong with your website and why are you redesigning it. Is it outdated? Does it have a low conversion rate? Or is it just not ranking well in search engines?

3. Analytics (Tracking) Software
Web Analytics is one of the most important things you should have before you even think about redesigning your website. Analytics software allows you to track your visitor, know where they are going and what they are doing. This will give you the answers to the questions asked earlier. It will give you a reason to redesign your website, whether it is to make your site more search engine friendly or to increase the conversion rate. Google Analytics is now free for everyone. It isn’t very user friendly, but hey…it’s free.

4. Define Technical Goals
Before you even start redesigning, make sure you know what you will need for your new website to work. Will you need to back up daily? Is your existing server going to cut it? What if the server crashes? Can you make changes to the website yourself? What language is my website going to be in? Is it going to need a content management system? Figure out what you will need to redesign your website, how long will it take, and who will be making these changes. This will help you estimate the cost and time for this project.

5. Website’s Future
This is one of the most forgotten steps in redesigning a website. Don’t just think about now, think about the future. This way, the next time you want to update your site, it can be as painless as possible. Also know that your website will need maintenance. If you are selling a product, make sure it is easy for you to add more products in the future and that they have the same design as the rest of the website. If you are selling a service, make sure it is easy to add or change it.

6. Usability Testing
After every step of the redesign have visitors test the usability of your website. Maybe what you thought made the website better, actually made it worse. Test every step of the way to make sure you get the best conversion possible. Make changes to your plan according to your visitor’s reaction. This will not only increase your conversion rate, but increase you returning visitors as well.

7. SEO
Search engine optimization will be what drives traffic to your website. It is important that you research your keywords, optimize your coding (keywords in URL, H1, H2, and in the title, good meta description) and comply with any other search engine guideline. If you are spending all this time and money to redesign your website, you might as well put in a little more time and money (or effort if you are doing it yourself) to have it done right. Be careful to have a proper balance between search engine friendliness and usability. After all, a site with 1000 visitors with a 15 percent conversation rate has the same number of customers as a site with 5000 visitors and 3 percent conversation rate. What’s more important…more customers or more visitors?