Wednesday, November 17, 2010

Are landing pages really more valuable than home pages?

According to Joshua Porter in his blog, Performable, the landing page is definitely more valuable than the home page, and by valuable you can infer you get more conversions from a landing page than from a home page. So many of the articles that discuss the ROI on landing pages versus the home page tell you how to increase the ROI (i.e., have more conversions) but not necessarily why this is the case.

  1. Landing pages and forms are actual interaction points-the home page is a one-way communication point, you communicate with the user; a landing page and/or form is two-way, the user can communicate back to you. If you "listen" to the conversation you will be better informed on what your customers need/what and therefore can provide it.
  2. Landing pages contain the information a customer needs to make the decision to do business with you, no matter what business you are in.
  3. Landing pages contain very specific information for a very specific audience. The landing page provides the information necessary to close the deal after the customer has shown interest.
  4. Home pages are a catch-all. The home page is the funnel that catches all incoming user traffic whether it is a new visitor, returning visitor, family and friends, and so forth. The home page has to be designed to appeal to all visitors and not be too specific to any one type of user. Home pages have to handle everything which is a totally different purpose than that of a landing page.
  5. Home pages are often "political", meaning every department/unit of the business wants a significant piece of the home page. The thinking here is that because the home page gets the most traffic it must be the most important page of the web site. This is not true (re-read #1-#3 above). This leads to wasting time and money on the design of the home page when it offers little to no return on the investment.
Please do not misunderstand, the home page is an important part of the overall web site and therefore, time, money and energy has to be devoted to it. The home page should guide the visitor to other pages within the site, i.e., a landing page. But because the landing page serves to close the deal (i.e., conversion) where the home page does not, it makes sense to focus a majority of your design efforts here because you want to be profitable, no matter what business you are in.

Saturday, November 13, 2010

J Cornelius

J Cornelius with CoffeeCup software was a guest speaker in our MIST 7540 class. J has been involved in software development for many years. He has a wide and varied background in both the business and technical sides of web development. He also is the organizer of the Atlanta Web Design Group (AWDG). He continues to be very active in the AWDG.

The one take away for me from what J talked about is to follow where my imagination takes me. J challenged my MIT class to continue to be innovative and imaginative with regard to web development. There is so still so much to be discovered about what the web can do and do for users. J wants us to "think outside the box". We should go about web development without thinking about the "what ifs", but just do it.

J is an example of the term, walking the talk. CoffeeCup began in the middle 1990s as a coffee house where some of the employees did a little web design and development on the side. As the web grew and matured, their web work quickly became more profitable than the coffee house. J and the other employees of CoffeeCup have developed innovative user friendly software to help anyone develop "cool websites" and they continue to be innovative (think outside the box). An example of this is S-Drive which is currently in beta testing. S-Drive will allow a user with one click of a button to put a website online. As development continues on S-Drive, according to J, there will be more "cool" features such as file sharing. Continuing to think outside the box is the "cool" thing.

Thursday, November 4, 2010

A conversation with Luke Wroblewski

Actually, I listened to a podcast of a conversation between Luke W. and Jared Spool. Luke was previously employed with Yahoo but now owns his own company, Ideation and Design. While he was at Yahoo, he was instrumental in creating many innovative web functions and applications, most notably LiveSearch back in 2005. But Yahoo chose not to put LiveSearch on Yahoo because of the server load implications. LiveSearch doesn't wait for the user to complete the search term and click Go before beginning the search, it actively searches based on what the user is typing, a search as you go. When Yahoo developed LiveSearch in 2005, servers and programming languages weren't as robust as they are now and server hits and loads were a big issue. Luke and Jared brought up LiveSearch because Google just announced a similar product, Google Instant. Since Luke developed LiveSearch in 2005, he feels Google is tardy to the party with regard to active searching. However, user expectations are much higher now than in 2005 and we expect to have our search results immediately. So maybe Google isn't tardy but just fashionably late.

As the podcast continued Luke stated several times that just because you can develop and deploy a new design doesn't mean you have to. As a web designer you have to be very careful in choosing when to use cutting edge techniques, both for the client paying you to design and for the end user. An example of cutting edge technology on the web is dynamic web forms, basically building a form that uses JavaScript to "do something" based on what the user does with the form. Think radio buttons that determine what data to return or spell checking on a text field or retrieving data from a data base. You have to be choosy on where you put these interactive forms because you want the most bang for your buck.

Another consideration, especially with dynamic forms is what to do about older browsers that do not support such technology. Per Luke, don't worry about the older browsers just concentrate on the newer ones. I'm not sure I totally agree with this. You have to carefully determine your target audience demographics, including browsers, and then decide if you can basically ignore a large segment of the web population. In my opinion, only after this careful evaluation can you consider targeting only newer browsers.

Lastly, Luke and Jared discussed Apple Ping stating it is an example of a poor user experience. They said Apple usually gets it right with regard to a great user experience but not this time. Both feel that Ping is beyond help and should be quietly withdrawn, reworked and redeployed so that it provides the user experience we all expect from an Apple product.

Web Usability

Web usability, in its simplest terms is the ability to use the web. Jakob Nielsen, ("the guru of web usability"), defines usability as "a quality attribute that assesses how easy user interfaces are to use. The word usability also refers to methods for improving ease-of-use during the design process". We all probably can agree that when using a web site or the internet in general, we want what we want when we want it and we don't want to have to search for what we want. Or at least this is my opinion. But the real work begins when we try to design a web site to meet the needs of a wide range of web users.

In the 6/10/09 of 10 tips to create a more usable web was discussed. These 10 tips are a mix of common sense ideas and tricks learned from years of designing web sites and all can be implemented without much difficulty. Some of the tips I agree with, some not so much but it won't hurt to implement them and see what happens.

  1. Create active navigation--be sure to always let the user know where s/he is on the site. For example, highlighting the section name in the navigation bar.
  2. Create clickable labels and buttons--by clicking on the field label or button the field (form element) is highlighted which, in theory, makes it easier for the user.
  3. Link the logo back to the home page--making the logo take the user back to the home page is preferable to having a "Home" tab. The logo is almost always at the top of the page and easy to see, rather than having the user search for a tab which can be anywhere. An added benefit is you can link the logo to your web analytics and use it as a click tracker.
  4. Increase the "hit" area on a link--do this by adding padding around links to make the clickable area larger to prevent misclicks. This is especially helpful with mobile sites when the area for the user is already small.
  5. Add focus to form fields--this is very similar to #2 but rather than clicking a button or label to highlight the field, the field is highlighted to alert the user that something is required of them, or that something just happened.
  6. Provide useful 404 page information--does the user really care why a page is unavailable, not really. She does care that the page can't be found but she also needs to know what to do about it, i.e., a link to another page or a search box, something to help her get to where she wants to go.
  7. Use copy text and verbiage to create a casual, inviting environment--basically don't use geek speak, write like you are speaking with a friend.
  8. Use line height adjustments to increase readability--make the copy look more like a book or newspaper, don't compact the lines together.
  9. Use white space--or the reverse of this is don't use too much white space. Be careful to space headings and paragraphs together so the user doesn't have to search or guess where to do next.
  10. Be accessible--no matter how hard you try to design a user friendly, usable web site, users will have questions or problems will come up so provide a place for the user to contact you and be sure to respond to the questions or complaints. Remember customer service matters.
It is the little things that often separate a good web site from a great web site. Try some or all of these tips and come up with some of your own. The fun comes in designing a site and having people enjoy and use your designs.

Monday, September 27, 2010

Web Typography

Web typography, the use of fonts on the web. Sounds simple enough. You design your web site, choose a font, and write the HTML & CSS code for your site and it looks good. However, it is not this easy. To be able to use a font in a browser, the font has to be available to browser, either native to the browser or be imported from another site. This is where it can get tricky. CSS has a @font-face tag and a URL link to the fonts you can use to pull in fonts to be used. Sounds like a plan that will work. But as Lee Corso says, "not so fast my friend".

First, to use a font on the web it has to be licensed to be used on the web, and not too many fonts are licensed for web use. If you use a font you purchased that is not licensed for the web you may be violating your end user licensing agreement with the font foundry (this is no small consequence). Second, not all browsers support the @font-face tag for all types of fonts. I don't really understand why the decision would be made to deploy a browser with less functionality (or stated another way, a competitive advantage) than a competitor's browser but there is a major player that did just that.

Why, you might wonder, is this lack of consistency even a factor to be considered? It occurs because there are no established standards regarding the licensing of fonts to be used on the web. The font foundries are close to having a set of standards that will protect their interests while allowing web designers to use fonts that are licensed for the web. Also, the W3C is working on a web font standard.

Don't despair, there is a solution to this problem, a middleman. This middleman is really a company that does all the heavy lifting with regard to negotiating the licensing agreements and technological issues for fonts. You pay a monthly fee to the company that pays for covering the license for the font as well as hosting the fonts. The good news is these fonts will work on any browser. The bad news is that not all fonts are available even to these middleman companies. But it is a start and for that we are grateful.

Thursday, September 9, 2010

Why Use Web Standards?

Do you want your web site to look good and work well with all browsers? Of course you do. Then web standards are important to you. Back in the olden days, well the late 1990s when the web was in its toddlerhood, most every browser used a different proprietary web format. This was not a great practice but it was not frowned upon because everyone was just learning about the Internet and individuality and independence was the norm. However, as more and more people began using the web it created the need for more and more web developers. Likewise, new browsers were developed, some merged, and some disappeared all together. All these changes created a sort of rat’s nest of web formats.

Multiple web formats makes web development complicated which always increases the costs associated with the initial development because multiple versions of the same site must be developed. However, the increase in costs is not limited to the initial development because over the life time of the site multiple formats must also be supported and maintained. You might think this is crazy talk and to control costs you can support one or two web formats, but do you choose which ones to support and which ones to ignore. I don’t know if you realize this, but by choosing to ignore certain formats you are by default choosing to ignore the web users whose browser is using that format. Can you afford to ignore potential customers or users? I didn’t think so.

There is an easy way to avoid having to choose what web formats to support or not support, and it is a simple decision, use the standard web format put form by the Web Standards Project. The web standards that were developed (and continue to be developed) in the WaSP ensures going forward that by using these coding standards a web site will work with any web browser. You won’t have to make the choice of what to support or not support. You put lots of time, energy, and money into coding your web site and you want it to be attractive and user friendly and available to everyone. By using these web standards when you code you won’t have to worry about browsers, you just have to worry about almost everything else.

Wednesday, September 1, 2010

The Art (?) of Information Architecture

Information Architecture (the short definition) is: analyzing, organizing, and structuring information on websites so the average user can easily find what s/he is looking for. A simple enough idea but is it simple (read easy) to do?

The Information Architect (IA, for short) has to strike a balance between what the owner of the web site wants (requirements), the content of the site (what to keep from an existing site and what to replace), and what the user wants and/or needs. It is like someone juggling, too much of one will impact the others, it may be in a good way or maybe not so good. This is where the "Art" (the skill and creativity needed for an endeavor) part of IA comes into the mix.

A fairly common thing to find when dissecting a web site is the design of an organization's web site mimics the organizational structure of the entity. This usually happens because the Information Architect follows the existing flow or structure of the organization. However, does the site user know (or care) that the Company's financial information is gathered and managed unders the direction of the VP of Customer Service and will be located under the Customer Service tab on the web site because this is the way the reporting structure is organized? I doubt the user will care, all she wants to do is land on the web site home page and with one or two mouse clicks find what she is looking for. Here the "Art" is being used to balance the company needs with the user needs.
Thinking about our user in the above paragraph, what does the Information Architect have to do to make the user experience a good one so hopefully, she will return again and again to our web site? The IA has to be able to figure out how the end user thinks and then use this information to structure the web site so that it is intuitive for the user to move around and through the site.
Try using these 8 steps the next time you are asked to build an Information Architecture.
  1. Understand the web site (system) requirements
  2. Talk to the end users of the existing site, or if there is no existing site, conduct interviews of potential and/or targeted users
  3. Develop a draft architecture and get client feedback on the proposed architecture.
  4. Understand that this is an iterative process, you won't get it right the first time around
  5. Eventhough this won't be the final architecture design, document, document and document some more
  6. Develop persona(s) and define what tasks these persona(s) will do when using the site (storyboarding)
  7. Have the project team review the storyboards
  8. Create detailed page layouts to support the storyboards (this also provides valuable information for the web designers and developers
Bottom line, effective information architecture should provide the means for users to quickly and easily find what they are looking for on a web site.