Mental Hurdle: The Home Page is Not Your Front Door

Most people trying to throw together a website think of the homepage as their entry point, their welcome mat, their “Hello, thanks for coming.  How can I help you?”  But how realistic is that?  Well, let’s analyze me (you can insert yourself here) and my weekly web wanderings.

What homepages have I seen this week?

It has been places where I am a repeat offender: iStock Photo,  All Recipes, Eat Better America, NPR, Etsy and Hulu.  I show up to these places as a starting point for something that I am searching for.  Each has a handy search function on the homepage.  I am familiar.  I know how to use the sites.  There is no “welcome” or sales pitch necessary, just easy navigation please.

When do I enter a website from somewhere else?

Practically, every other time I use the web!

My Google searches this week included research on leasing technology equipment, html tags, and green gift guides.  None of these took me to a home page.

Google wasn’t the only source of my web wanderings.  My visits to Social Living, SnapFish, and Wix were all the direct result of marketing e-mails.   Not a single one of these took me to a homepage.

So where did they take me?

The effective ones took me to a specifically designed landing page.  Through my own web searches and the e-mail marketing links that brought me in, the companies knew exactly what drew me to their site.  My entry point to their websites was tailored to the reason I was surfing the web.  I did not have to read through their menus or find the search box or really do much thinking at all.

If a business is blessed with the specific knowledge of what drew the customer in, it seems wasteful and inattentive not to use it.

Using It

In short, using it means providing a tailored advertisement and action motivating page all in one.  While putting this page together, here are some things to keep in mind:

  • Be goal oriented. Remember your conversion goal and make that the most natural, clickable path.
  • Keep it simple.  This page should not be distracting.
  • Give them what they want.  You know why the user landed here.  So don’t offer 800 other options.
  • Keep it attractive and professional.  Make sure that this page instills confidence in the business.
  • Be clear and concise.

Hmm, be clear and concise.  Seems like a good note to end on.  Go do it.

A Late Adapter Tries New Things

Flock and RockMelt are two new browsers that integrate your most visited sites into your browser.  They make sure your social networking tether is short and securely bound, even when you are searching for a new pair of shoes.

Setting Expectations

The first that I heard of this type of browser was a story on Marketplace. The head of RockMelt, Eric Vishra, said that the average user only goes to about five to seven websites each day.  Yet, they go to these sites repeatedly throughout the day.  He went on to say that the typical browser has not updated to adapt to the way we use the internet. 

RockMelt, as well as Flock, looks to provide the user with access to all of their most frequented sites at one time, without requiring them to move around from one site to another to find updates.  Instead they seek to present the social networking experience and other favorite feeds while handling other web browsing.  Based on the video their on main page, this is provided via two main additions: an online friend display on the left of the screen and on the right a streaming feed of information from your favorite sites.  

Based on the video?  I know what you are thinking; Rebecca is too lazy to actually try out the browser. 

You would be wrong.  I went to RockMelt’s site, which directed me to my Facebook, which allowed me to request the browser, which then informed me that I would get to download the browser in a couple of days. 

Well, Flock it. 

I’ll just use another social browser.

The Flock web browser shows the FB feed on the right and the open window on the left.I am motivated to try this out right now.  Instant gratification, in this case, was provided by Flock, a competitor’s social browser.    

So, it is day two on Flock. 

As I started out with, I am a late adapter and generally wary of knew things that have the potential to stealthy winnow either of two precious resources; my time or my money.  I joined Facebook about six months ago, dragging my feet due to concerns for the first resource.  I walked away from the AT&T kiosk clutching my iPhone about a year and half ago, hemming and hawing about the second resource.  This could end up being a similar love-hate relationship….but it is still up in the air.

I found that I had a couple of initial small disappointments.  The Facebook feed appears to only provide the posts by other users.  To me this misses an important element, the crucial update when a friend is tagged in a photo.  I haven’t seen how I am updated with my notifications other when I just log in.  This may be because the comments on my wall and messages may have been after I shut down for the evening.  I am not sure.  Also, not exactly a disappointment, but Flock did not have the left frame list of friends online that RockMelt boasted. 

Like Facebook and the iPhone, it appears to be something that I have to give some time before passing judgment.  I would need to spend some time setting up appropriate feeds and, possibly, making groups and learning how to use features that I believe are there…but have not yet explored.  In the mean time, I have already learned a couple important lessons:

  1. This is not the browser in which to do research for one’s homework assignment or have anywhere near a work related computer.
  2. One mediocre FB update, can distract me for 15 minutes and leave me completely lost, having no idea as to what I was doing prior to the rabbit hole or what led me to said fissure.

After learning these lessons, I realized that to give this an honest chance, I needed to use the tool as intended.  Last night, I decided to use Flock while intentionally wasting time.  As my whole goal was to goof off, shop for shoes, see what handy things clever people were making on Etsy, and keep in touch with friends and family, Flock worked out well.  I am thinking I’ll give it a week and see how it goes.

Web Want to Usability

Yes.  I am making up lingo.

Three stylish little Apple boxes each smaller and cuter than the last.The podcast on Innovations in Web Input brought up an interesting Apple phenomenon.  We all like to get packages and open new things, but Apple takes it to another level.  Opening an Apple product is an event.   People actually take pictures of each stage of the opening of their Apple box.   The box that your new MacBook or iPod comes in is clever and interesting.  The packaging adds to the event and is part of the overall experience. 

The reason I bring this up is because Apple takes it past simply trying to make something easy to use to something that people want to use.   There is a difference.  Think about your first iPod; playing with that dial and watching the brightly lit album covers slide across the screen.  Think about getting the touch screen iPhone and using your finger to flip through pictures and then zooming with your pointer and thumb.  I zoomed in on so many pictures that I didn’t even want to see in detail, just because it was so fun.  I liked it enough to try to think of more ways to use the phone.  Even now that it isn’t new, I pull it out and “slide to unlock” for no reason and then think, “what do I want to look at?”  I just want to use it. 

In my previous post, I discussed basic web usability.  In the stepping up to want to usability, basic web usability cannot be left behind. Sticking with my Apple example, the Apple website follows the rules; the logo is in the top left corner of every page ready to take me right back to the homepage, the search box is in the top right, my menus are always available.

The want-to comes from the extra touch of finesse.  In the Store section of the website, the search feature helps you along.  Type in an “ip” and it will give an assortment of suggestions without even hitting “Enter”.  Check  out the iPod engraving gallery.  It allows the user to select various sayings and iPod colors and then shows you what your new engraved iPod will look like.  

Web want to usability is not quite as simple as web usability.  It can’t be condensed to a handy checklist.  It is going beyond trying to not frustrate the user during their experience, to making the user think of excuses to experience the site again.

Web Usability

There is no shortage of websites available to the typical web surfer.  Consequently, if you want to keep someone on your page, you not only have to have content and find-ability, you have to stand up to expected usability standards.  The first time I get lost in a site, can’t find my way back to the homepage, or link to something that isn’t what was described, I move on.  Someone else will give me what I am seeking without all the hassle. 

So to keep your web audience and then keep the coming back, sometimes it is best not to reinvent the wheel.  The wheel is a pretty fantastic and, right now, it works better than the hover craft (as far as I know, that is still in the imagination stages). 

Here are some things to keep in mind:

Click Logo -> Go to Homepage

This is a personal pet peeve of mine.  If I am ever lost and confused, I need my safety button to take me back to familiar territory.  Give that logo more to do than sit there and look pretty.

Make those buttons and links talk

  • If my mouse is over the button, it needs to do something pretty to say hello.  A nice color change or magnify will do. 
  • In fact, if my mouse is over anything that is clickable, go ahead and make the cursor a hand.  It is a universal plead to the user to “click here”.
  • Once I have bowed to temptation, indicate that the link has been used.  Try making the color to the link more subtle.  It has already done its job; so there is no reason that it needs to keep drawing attention to itself.
  • Make sure the selectable area of the link is a usable size.  If a link is just the text, it can be difficult to select. 

Basic layouts with familiar menus

I am a woman on a mission.  I really don’t have time to figure out any special navigation.  I came to your site for a reason.  Give me a menu horizontally on the top or the bottom or vertically on the left.  Allow me to use a search utility that is in the top right hand corner in case we don’t think exactly the same about how to organize the information. 

Don’t let me feel lost

  • Provide a trail of where I have been.  It is very likely if I am shopping for a cute pair of boots that I notice some sandals on my way in.  I don’t want have to go back to apparel to women’s to shoes to find the sandal menu.   I’ll probably just forget them.
  • If I do stray off the path, provide an error page that is informative to the user.  It would be nice to be greeted with a message saying “Oh no!  That link didn’t work.  Let’s try this again.  Tell me what you are looking for and I’ll try to help” along with a search box.  This will be much more helpful to the user than a 404 page.

Be proud of the superior web content that you no doubt have ready to populate your new site!  Make sure that you don’t miss sharing because your link was disguised as a picture that didn’t speak up when my mouse passed over it.  Make sure that I remember to go back and look at the cute sandals.  Don’t let one silly 404 page stop me from continuing my jaunt through your site.  Getting visitors to your site is a big part of the battle, don’t waste that victory.

Web Accessibility: For One, For All

Web accessibility standards help to provide the assurance that your website is available and usable to all of users out there surfing the wonderful World Wide Web.  Be they limited by mobility issues, by vision deficiencies, by hearing problems or even cognitive issues, it is no reason that any of us should be denied access to the world of information and entertainment available via the internet.   

One could look at the need for web accessibility from two main motivational perspectives: the business and the righteous.  Let’s go the business route before climbing up on the soapbox. 

A Business Oriented Perspective

  • Lost Potential Customers:  Customers are hard enough to obtain.  Why filter out a whole group of people from the get go?
  • Public Image:  Being indifferent to disabled customer will probably go over about as well as kicking puppies.
  • Potential Liability:  Federal civil rights laws are in place to ensure equal opportunity for people with disabilities.  Currently this applies mainly to accessibility at physical locations.  Yet, recent court cases have shown that those stores with a physical presence are now bound to a similar principle for their web fronts as well.  
  • Additional Benefits:  An easily navigable, content rich site with content rich alt text is good for everyone, including those trying to find your website via Google.  Living up to many of the web accessibility standards is also likely to help your search engine optimization and to make your site easier for all of your customers’ usage.

 Another Reason to Climb on Board

My mom has spent the last couple of months with tendonitis in her right arm.  Basically, it means that she has shooting pains through her arm to her finger tips.  To get better, she isn’t supposed to use it for however many months it takes for it to stop hurting.  She has adjusted to things like eating with her left hand.  Of course, she has declared flossing with one hand absolutely impossible.  She has told me that she always remembers to wear her sling to the grocery store.  She has found that people go out of their way to help her.  For instance, at Wal-mart the checkout ladies always have someone come help carry her groceries out. Frankly, she needs it and she is grateful. 

With an online store front, we don’t have the obvious reminder of our clientele’s physical limitations.  We don’t necessarily know why they turned away from our website.  I’d be embarrassed of myself if I didn’t help someone else’s mom struggling with an arm in a sling and wrestling with their groceries or if I carelessly blocked the ramp access to my local Publix.  I should be just as aware to know if I am blocking access to information or denying access of my product to a blind customer online. 

So, now you’re in right?  Visit this link to review some bad design and follow it through to identify some quality accessibility design.

Color! But not too much…

Who doesn’t love color?  In many mediums, it is the deluxe, the premium, and typically worth shelling out the marketing dough.  A winery in my hometown, Chateau Morrisette, has a well told story of a particular bottle of wine.  It is a semi-sweet Riesling.  It had some average Joe name in an average Joe bottle and sold at an average rate.  A year or two in, they changed the name to Our Dog Blue and put it in a cobalt blue bottle.  Sales jumped by 600% percent.  That number changes depending on the tour guide you get; but you get the drift.  I can’t tell you how many times I have overheard tourists asking for the wine in the blue bottle.  The wine didn’t get any better…and, frankly it isn’t their best wine…but it’s memorable and pretty.  

Free!

Unlike print media (and I suspect glass wine bottles), more color does not cost extra on the web.  So, well, there is a tendency to get a little too excited.  

Fantasic White

So, in this ode-to-color, let’s first extol the value of white.  It is fresh.  It is clean.  It is easy on the eyes.  But we know that; so that isn’t the thing that pushed me over the edge to be a full on white fan.  Instead, this example from the Web Design from Scratch site helped me give me some perspective.  

White Edges

Notice in the first example that your eye gravitates to the white. Unfortunately, the white isn’t where the user needs to look.Using the white as the content background pulls the focus to the content.

White Content Background

Using the white as the content background pulls the focus to the content.

.

.

.

.

.

.

Now I know that when you read about color schemes, you are going to get excited. You are going to want to let this white thing go.

But come back here, focus, and think about your purpose: your content.

You want people to think about your content.
That is the goal right? To engage people with your content. White Space allows room for thought. So, white space isn’t actually about color. But this is still important. A site needs to a balance between full and not overwhelming. The site should manage to avoid clutter while still feeling full of exciting content that can be discovered by the click happy visitor.

Color Schemes

Choosing a color scheme can get overwhelming quickly. The Color Scheme Designer is a handy tool for finding an appropriate accent color. Using your good old elementary school art class basics of monochromatic and complimentary color schemes, the site really takes an overwhelming decision and lays out some reasonable and not necessarily obvious options. It provides monochromatic, complimentary, and triadic color schemes with each color option in various tints, tones and shades.

Stuck in a Rut

Four websites with the same color scheme that are hard to differentiate
The color scheme options are nice as the obvious choices are taken…..by many, many sites as is shown with this example of HP, IBM, Dell and Microsoft from Boxes and Arrows shows.   Don’t get trapped looking like everyone else.

Use Color Wisely

Color is a tool. It can enhance the feel of your site.  It creates identity.  It draws focus to specific sections of your website.

Who cares about web browser consistency anyway?

In Firefox: notice the radiating colors and the rounded edges

John Allsopp raised an enlightening question the other day.  He asked us who thought it was important that a website look the same across all browsers.  It is one of those questions where you know that the answer isn’t what you want to say.  You want to say, “Yes, that is pretty important”.  Yet, looking at the guest speaker in your Web Usability class, you know what is about to come out of this man’s mouth is “Pshsh”, “whatev” or some other completely dismissive non-word.  So, it was.  He said whatever the Australian version of hogwash or bollocks is and asked us another question.  

 

In Chrome: the radiating colors have been lost, but the rounded edges still look sleek
In Chrome: the radiating colors have been lost

 

Who will know?  

Will anyone know the difference if the site is different in Firefox or Internet Explorer or Chrome?  Other than everyone in the class I was sitting in, of course.  No.  Simply, no.  Normal people don’t have multiple browsers on their computers.  They just use what was pre-installed.  So, one looks fantastic, one looks great, and one looks nice.   Very few people will know the difference.  The example displayed (in 3 sections) is one that Allsopp provided in his talk to the UGA MIT class.   

In Internet Explorer:  It looks OK and does the job.
In Internet Explorer: It looks OK and does the job.

 

Time & Money working for Awesomeness OR Consistency  

Allsopp contends that the work can be done to make a site fairly consistent across most browsers.  Yet, it comes as a trade off.  With an allotted budget, the time and money can be spent on making a great site for most browsers that has less pizzazz for any less capable browsers.  Or the time and money can be spent creating consistency across browsers and providing a great deal less capability for all browsers.  

Is it ever that simple? 

If that’s all there was to it, a little pizzazz missing for the IE masses, I’d be ok with that.  I just found out from some WordPress analytics that for my coffee company, my current visitors are by far more acquainted with Firefox and Safari anyway. Unfortunately for my everyday-secure-normal-go-to-an-office-with-company-computers-and-health-insurance job, we run into a problem.  Our internal web-based software is IE only.    

Why?  Why would you do that? 

Well, in asking just this question to the one remaining person who was within ears reach during those conversations, this is what I found; the software was designed for a company that worked in Microsoft products and would only be used internally.  As it is an internally controlled environment, cross browser use wasn’t an issue or a goal.  Internet Explorer offered this handy little menu feature that handled CRS’s needs.  In comparison to the Java alternative that was deemed too slow and bloated, this IE tool was zippy and handy.  Basically, it was what was available at the time.  Other options have evolved now, but to change what is there will be time consuming and expensive.  

Play Nice 

Isn’t it fantastic the way a light bulb is a light bulb?  When you have to replace said light bulb, you don’t have to buy a light bulb made by the manufacturer of a particular lamp, a standard light bulb will do.  So for electrical cords (well, within a country) and DVDs and light bulbs, there is a standard that makes it possible for lots of companies to get in on the electricity and movie and light action.  

Well, there is a standard for web browsers as well.  The standard allows a business and web designers to just create one website that can be viewed by several different browsers.  The Web Standards Project created the Acid2 and Acid3 browser tests to check browsers for their compliance to the various web standards.   The major browsers, Safari, Firefox, Internet Explorer and Chrome, all passed Acid2 (from 2005).  The Acid3 on the other hand went well for all (in the 93 to 100 range out of 100) but IE (scoring a 20/100).  

Of course, IE has the bulk of the traffic.  So, for now, despite an assortment of failed usability tests, they win.  We are forced to adapt to a certain degree.  They have the control of the masses who just don’t think about how the internet is provided to them.  

I like Allsopp’s who-cares philosophy.  Yet, at this point, it doesn’t seem to be an available option for me.   

So often we talk about how things should be done.  Yet, this assumes we are starting with a fresh system.   Here I am entrenched and increasingly aware of my situation.  So here are my next questions: 

  1. How do you decide when it is most appropriate to adapt?
  2. How do you decide when to start from scratch?
  3. Is there some sort of IT Magic 8 ball that could make the call definitively?