When I designed the websites, I chose layouts that emphasized the pictures of the different locations. As a sand volleyball player myself, I would want to know what type of sand each location has. I also included plugin’s that would allow them to integrate Google calendar for their events, All-in-one SEO Pack and a gallery they can upload photos from their iphone. Each client we work with had different requirements for their website and we work with you to find your perfect solution.

Below are the options that we originally presented.

Option #1:

This option was primarily picture based.

Option #2:

This option I also provided a custom illustration for the header of the website.

Option #3:

This option took the sand “literally.”

Final choice:

They ultimately went with Option #2 – below is the final home page visit. They also had me add a custom text widget box to the home page, so they could change the Welcome message daily. You can visit the live Concord Sand Volleyball here.

Web design work:

After talking to Jamie about her website, we found she loved her e-commerce platform, Volusion, but wanted several design changes. No, problem we can do that. We sent several design ideas over to the owner, she approved one of the design choices and we in turn, programmed the new look.

Here is the old look:

Here is the new look:

The major change was the header  and sidebar design. This re-design allowed us to be able to switch out special marketing messages at the top of her site and in the sidebar. We also switched her email sign-up, so the customer would stay on the same page the entire time.

Facebook:

We have also been busy working with Cassavoy and Company on growing her Facebook presence. When we first talked with the owner their facebook page only had about 50 followers. We grew that page to have almost 300 fans through Facebook ads, a Facebook giveaway contest, and a Welcome page that shows a discount once “liked.” Below is a screenshot of the discount promotion.

Below are the design options that I originally presented them. After I emailed them the designs, they took a week to think about it and scheduled another Skype chat. We talked over some design changes on their end and I sent them back a final design choice. Once chosen, we started the programming stage. Normally, I prefer to allow two weeks for programming, but they really needed this site to be up and running before they left for their big move to New Zealand. We sent them a URL to the site on the development site and they went through it. They had a few more suggestions and once they were made the new website for Moana Nui Designs LIVE.

Design Option #1:

This option is very similar to what the described in our talks. Big hero photo with room for blurbs of copy on the right and thumbnails of the categories below.

Design Option #2:

This option introduced a photo that went over the entire page, but still showed their featured thumbnails on the bottom.

Design Option #3:

This option is kept the hero shot as in #1, but introduced a sidebar to the home page.

Final Choice:

The final design is similar to Option #1, but included cart icons and a different style email button, as well as a tan colored background.

Business card design:

Website design:

Flyer to pass out around town and a Facebook landing page:

Sticker design to be placed on merchandise:

As I normally do with all projects, I provided three options for the client to choose from.

Option #1:

Option #2:

Option #3:

Final Choice:

After reviewing all three designs, the client ultimately picked the below. They loved the clean look that gave them the ability to feature all of the different facets of their company. See the final site at www.shoprung.org

I provided two options for the client to choose.

Option #1

The first, I incorporated the actual look of vinyl log siding:

And the below is what the Gallery page for Option #1 would look like. Each photo pops up into a larger image, so the customer will get a real feel for Vinyl Log Siding. Plus, the text below the caption could include a client testimonial for each project completed:

Option #2

The below look was created to meet the request of the client to incorporate green and brown as the main color scheme.

Below is Gallery page for Option #2. The thumbnail photos all pop up into larger photos:

The client ended up choosing the first design option. To see the site in its full functionality, head on over to http://www.logsidingstore.com/ and check it out. This site also incorporates Google checkout, so customers can easily order a Vinyl Siding Sample Kit.

In the previous article What print materials do I need to start a business? we talked about what essential print items I recommend for start-ups. Today we are going to go over what online materials you will need to reach your target demographic. I’ve again broken it down to “essentials” and “advanced.”

Online Essentials:

This short list is what I recommend to start a business and appear professional. And remember if you appear professional you will more easily earn your customers trust and credibility and thereby increase sales.

Website:

Having a website is ultra important because it allows people you meet in person to find out more about your company, plus it enables you to be found by search engines, such as google. Many people do preliminary research on the web before they contact a company or make a purchase.

Tip: When considering the design of your website think about the following: Make sure it is easy for a potential customer to find what they are looking for. Is it products for sale? Information? Also think about what your end goal of your website is going to be. Is it making a shopping cart purchase or email newsletter sign-up? Also make sure you have links with all of the different ways people can contact or follow you, such as email newsletter, Facebook, Twitter, and blog RSS. For more in depth info about website design, read 7 tips for a stellar web layout.

Email Newsletters:

Email newsletters can increase your sales and are one of the cheapest forms of communication to put into action. There are email clients such as Mailchimp.com and Constant Contact that offer low cost solutions. How low? If you have under 500 people on your list Mailchimp is free and Constant Contact starts at around $15 per month.

Tip: Make your branding consistant with a custom email template that matches your website and print collateral. Make sure you only email people who have opted-in to your email list. Do you want to know more about SPAM laws? Check out MailChimp.com and scroll to #11 for a great Email Spam overview.

Online advanced:

The following tips are “advanced” because they either take more time and/or money to put into action. These suggestions allow you to go out and find your customers and not just wait for them to come to you.

Blogs:

Blogs are a great tool to get more traffic to your site, educate your customers, build trust and toot your own horn. Want to know more on how that is possible? Read Why your small business should have a blog. Are you not sure what to write? Visit Ten topics for your small business blog.

Tip: To keep a consistent brand make sure your blog matches the look of the rest of your online and print materials. Consistency is the key to having your customers recognize you.

Facebook fan page:

Facebook fan pages are a great way to reach your customers daily.Why do you need one? Your customers aren’t going to look at your website everyday, but they are going to be on Facebook. Check out these Facebook stats:

• Facebook has more than 350 million active users
• 50% of active users log on to Facebook in any given day
• Average user spends more than 55 minutes per day on Facebook

To find out more, read Why your small business should have a facebook fan page.

Tip: To further stand out from the competition you can add a custom “Welcome” tab or a special tab for a specific promotion. For a “Welcome” tab example, view the Uncommon Threads Jewelry Facebook fan page. You can set it up  so new visitors are automatically directed to your custom page.

Twitter:

Are your potential clients on Twitter? It’s free to set up and the only thing it takes is time. Are at a lost as to what to talk about on Twitter and Facebook? Check out How to Simplify Social Media.

Tip: To keep branding consistent have a custom background with your branding. See the Uncommon Threads Jewelry Twitter page as an example.

Video:

Did you realize that people are 7-10 times more likely to view a video then to read an article or profile? Video can be used on your website, Facebook Fan page, YouTube and even in email newsletters.

Webinar:

A webinar is a great way to show you as an expert and will also give you the opportunity to reach new potential customers. Are you just starting out and don’t have a lot of information to share? Partner with an authority figure on the topic to give your company credibility.

Pay per Click Ads:

Pay per Click ads can be a great way to get new customers that you are not currently reaching. The most popular ads are through Google and Facebook. You can also advertise on other websites that are frequented by your customers. How research your customers to find where they shop or go for information and then email the site owner about advertising rates.

Tip: Set a daily budget on whichever you choose, so you don’t get any unwelcome surprise bills. And make sure you check your Google Analytics to see which ads are delivering the most potential customers and which ones are fulfilling your website’s goals (sign-up for email newsletter, e-book, or make a purchase).

Wrap up:

Set up an Online Marketing Strategy for the entire year, so you can compare results from year to year. Decide ahead of time how much money and time you are going to invest in online media. Remember the marketing rule is it takes 7 times for a person to see something before they buy. Which method online makes the most sense to reach your ideal customer?

Part of being a small business owner is most likely being involved in the process of creating your website. What is really important to include when you are considering your website layout? Is there a specific layout that works better than others? When I work with small business owners, I encourage them to consider the following:

1. Include ways for people to easily contact you

Did you know that everyone prefers to connect differently? Some of my clients are on Facebook all day, others are on Twitter, some prefer email and others want the human interaction of a telephone. In order to communicate to each of these audiences, make sure you have the following on every page: e-newsletter sign-up, a link to follow you on your Facebook fan page and Twitter, your phone number and if you have a blog, an RSS feed. You never know what page your future customer is going to come in on, so make your contact info readily available.

2. Make a list of all the pages and sub-pages you want on your site

Your programmer and designer will love if you hand them a list of pages and sub-pages you want on your site. If you have no clue how you want your information spread out on your website, make sure you tell your programmer and designer. When I work with clients, I normally ask how many total pages they want on their website. If they have no idea, it says to me that the client hasn’t thought through their marketing collateral or position. In order for me to get an accurate picture of your goals, I’ll need that list. And who knows your business better than you?

3. Incorporate a wireframe

A wireframe is a rough sketch or simple boxes showing which area will be for what category on each page. This allows one major thing – the client, the programmer and the designer all agreeing on the layout before the work gets started. This is especially important on a website with lots of information. As a rule, put the most important information towards the top, so people don’t have to scroll down to see it. Plus, using a wireframe helps point out which areas on the page are going to be reserved for the call to action, the logo and search box.

4. Consider the programming platform

Before programming one line of code, make sure you as the client, programmer and designer all agree on what type of code that website will be programmed in. This conversation should be had at the same stage as presenting the wireframe concepts. Different types can include: Straight HTML, Flash, XHTML, CSS or Content management systems such as Wordpress or Joomla. To help you decide, consider – will you need to update the site often? Or is it a strictly an informational site? Is it to showcase photography or an e-commerce site? Every web site is different and you may find yourself using a mixture of elements, but the important thing is to discuss this ahead of time.

5. Keep it simple

I have this philosophy in all matters of design – keep it simple! Sure your website in all flash may look cool, but can you navigate it easily? Will customers wait for large load times or move on to another site? Do you want to risk losing a sale? Besides navigation, also keep your color palette simple as well. There is nothing worse than pulling up a site that is bright neon green with purple stars and has a yellow flashing burst telling you to click there. A color palette of 3-4 colors is plenty and think subtlety rather than bright. Use lots of white space. Think of the large websites you frequent – Amazon or NY Times – both of these communicate a brand and keep it simple.

6. Be consistent

Make your web page layout match the rest of your collateral. Part of creating a brand, is being consistent across all media – in print and online. When someone hands me their brochure, it should have the same fonts and colors of their website. Consistency helps create trust, which is a huge part of branding.

All of your web pages should match. If you are on the About page, it should match your Blog and your Home page. What exactly should match? Keep your logo in the same spot on all pages. Keep your navigation and footer with the same info and colors. If you are inconsistent it can lead to someone thinking they left your website. Which in turn means – a lost customer. Remember consistency = trust = brand building.

7. Consider the path you want the customer to take

Make sure you have a precise goal. Is to convert visitors to your email list? Or is it to purchase a certain product? Is it to sign-up on your Facebook fan page? It is informational? Make the path you want your clients to take obvious and simple. Don’t overwhelm them with 6 options, but do keep it simple. Have a focus.

Bauerhaus Design believes in promoting a variety of experts, including guest blogger, Caryn Ginsberg. This article is part of her free web design series “Websites that Work” and originally appeared at Heart of the Matter Design.

I’m getting together with family in a couple weeks and was trying to find a restaurant that would take a reservation for eight. It was frustrating how many websites I went to where I couldn’t find out whether I could make a reservation or not.

It was a great – if painful – illustration of the importance of navigation to creating a website that works. If it’s hard for people to find what they want on your site, you’ve created the impression that you don’t care or that you’re hard to do business with. Not a good place to be!

Effective Website Navigation

Clear, easy-to-use navigation is central to your best web design. Navigation includes the menus and links that enable people to move from page to page. Here are five can’t miss tips to offering navigation that invites rather than discourages the people you want to attract.

Design for task. What do your visitors want to do when they come to your site? Design your navigation to make it easy for them to accomplish what they want. Of course, you’ll also want to provide clear, simple navigation that gets them to pages that achieve your objectives, too.

Keep a consistent look. Don’t make your visitor keep figuring out how to get around your site. Using the same placement, look and labels throughout makes it easier for them to get around… and less likely they’ll abandon the site. Remember that people may enter your site via search engines to any page, so don’t count on the home page to help them understand how your site is laid out.

Consider global and local. If you have different needs for different sections, maintain the same overall or global navigation to show people how to get around the major areas. Use local navigation that appears on in certain sections to offer tailored choices for lower levels. In this page I’ve created for the upcoming relaunch of the Certified Humane Raised & Handled® site, the top menu bar is the global navigation on every page, while the links at left change within the About, Food, Animals and Farm / Ranch / Business sections. Note how the left links have subheads in green to give order to the long list. The current web page has the local navigation as a series of text links. See what you think of the difference.

Identify links. Be clear on which text is a link by using a different color and / or treatment such as underline. Don’t use the same treatment for non-links. If your Wordpress theme allows or you’re doing custom html, choose a consistent color scheme for links as someone hovers the cursor over them, when they are active (visitor is on that page) and when they’ve been visited. You may need a different color scheme for links within the body text vs. links in a menu bar, however.

Include search and site map. The search function provides a way for visitors to access the content they want directly. It’s also a fallback when their attempts to locate information via navigation have failed. If your site is large or complex with multiple levels, include a site map that visitors can use if they want to see the overall structure of your pages. But neither should excuse weak navigation, so don’t let adding them reduce your focus on creating an easy-to-use site.

The best way to find out if your navigation works is by testing. Because you’re so familiar with your site, it’s hard for you to evaluate what’s easy and difficult to do. Engage some people from your target audience and ask them to give you feedback. You might even assign them specific tasks that you know people will want to do – such as finding information on a product, program or service – and ask them how well they were able to accomplish each task.

With all you’ve done to get people to your website, the last thing you want to do is let them drift away. Don’t leave your visitors afloat. With good navigation it will be smooth sailing for them to do business with you. ]]> http://www.bauerhaus.com/strategy/are-frustrated-people-leaving-your-website/feed/ 0 http://www.bauerhaus.com/portfolio/uncommon-threads-jewelry-web-site/?utm_source=rss&utm_medium=rss&utm_campaign=rss http://www.bauerhaus.com/portfolio/uncommon-threads-jewelry-web-site/#comments Thu, 21 Jan 2010 20:48:53 +0000 Rebecca Bauer Ritz http://beta.bauerhaus.com/?p=62 I designed this e-commerce web site for Uncommon Threads Jewelry. The site features gorgeous handmade jewelry by the lovely Randi Chervitz. Randi has been a client of mine for over 6 years. The first project I worked on for her was creating her:

Overall, I focused on creating a clean site to leave the emphasis on her jewelry. One of the key client requests was the ability for the customer to search multiple ways. Why you may ask? Because some people are searching for a cute pair of earrings and others want a whole accessory set – earrings, bracelet, necklace, etc.

I worked with programmer Erik Lutenegger creating this site and together we broke it down into 3 ways to search. The first way, shown below, is by category, such as earrings, necklaces, bracelets, etc.

The second way to search is by collection. For instance, the piece below is in the hammered collection. You can then further view other similar hammered jewelry on the bottom scroll bar.

The final way to search is through an advanced product search. Use this if you know what exact product you are searching for:

Another feature we added was rotating images to the home page. Here is another view of the home page with a different piece of jewelry.