Increase traffic or Increase Conversions

In the past the focus of e-commerce websites was to attract visitors to the site. One can argue that the  trend has shifted to focus on conversion rates, opening up a debate to which is a better  return on investment (ROI)?

Should a company spend money on advertisement in an effort to increase website traffic or should a company spend money to improve the user website experience and subsequently increase conversion rates? An e-commerce conversion rate is the percentage of unique visitors to your online store who actually buy something. E-commerce traffic is number of  visits a website receives during, usually, a 24-hour period.

Conversions are the gift that keeps on giving, according to the book Web Design for ROI.  Buying traffic is a one-shot cost with a one-time benefit.  Increasing conversions is a one-time cost with ongoing benefits as stated by authors Loveday & Niehaus. It might be hard to sale this statement to many upper-management executives that make the money decisions.  Buying traffic is easier to measure than conversion rates. Conversion rate measurement can only be estimated and can be based on beginning metrics gathered by methods such as usability testing.

I read an interesting article: Uncovering Both Top- and Bottom-Line Growth for Your Online Business. The author, Kevin Gold, says online businesses have a similar “top line – bottom line” approach as those businesses on Wall Street to strive to improve their “top line” by increasing sales on their “bottom line”. The author recommends to evaluate “top-line” (traffic generation) or “bottom-line” (visitor conversion) improvements to  by five criteria :

• Objectives you plan to achieve
• Amount of money you have to spend
• Time-line established to meet your goals
• Amount of visitor traffic your website currently receives and
• Conversion rate your website currently achieves

By evaluating these criteria the return on investment for “top-line” vs “bottom line” rates should become clear.  No matter which method is taken or a hybrid using both, a measurable sales growth should be achieved.

Another  interesting analysis of two competing websites was made- 1800flowers.com and Proflowers.com. The analysis tried to determine why the conversion rate of Proflowers.com is twice the conversion rate of 1800flowers.com. Items like better search, product, and checkout pages are thought to affect the conversion rate. Many of the techniques described in the  Web Design for ROI book were employed by Proflowers.co, thus possibly contributing to their larger “bottom line”.

Maybe the answer to the debate on which is a better ROI – increasing traffic or increasing conversion, is both, improving the user experience before attracting more traffic can improve conversion rates.

Sources: BusinessDictionary, Web Design For ROI, About.com

HTML5

 

 

HTML5

Mr J Cornelius of CoffeeCup.com

J Cornelius

Our guest speaker, J Cornelius from Coffee Cup, possessed a good mix of the business savvy and the technical side of web design. J, with many years of  web/software development, shared his perspective.

The one takeaway – J. Cornelius’ charge for us to continue to innovative and imagine. The web, still in its infancy, is unbounded and has many untouched possibilities. I liked this challenge. I recall my  purpose for wanting to continue education in the MIT program was to open my mind to new possibilities and ideas in the field of web design. I am motivated by fellow students, professors, and speakers like J that get me to think outside my box.

Over the years, J has had this hand in many software tools, some successful some not to successful. One of Coffee Cup’s newer products, mentioned by J, currently in beta was S-Stream Drive. It allows users of the CoffeeCup Visual Site Designer to publish quickly and easily.

CoffeeCup, along with many other companies have significantly reduced the barrier for entry to web design and development by providing many user-friendly tools. Five to ten ago, a person needed a thorough understanding of HTML, CSS, graphic design, and maybe some programming to get a website up and running. Currently, even entry-level web users can use tools to design and publish a website with ease!! I am sure this trend will continue as the web continues to grow and ultimately touch every aspect of our lives.

Luke Wroblewski : Web Forms

The SpoolCast: Luke Wroblewski and Innovations in Web Input podcast originally debuted on October 7, 2010.
The invited guest for the evening was Luke Wroblewski. The talk centered on new innovations in web input
and included some lessons learned when developing for the modern day web.

A lot was said about Google’s new instant search – where search and suggestive searches are being performed as the user is typing. Wroblewski points out that web users will come to expect instant results while online. By use of Facebook and Twitter, users have become accustomed to the instant availability of file/photo uploads and post comments.
He comments, that competitive sites will have to offer this sort of instant gratification to their users as websites progress.

Luke Wroblewski sees web form trends pushing toward rich interactions, form data not being populated by the user but by
information sharing via instant messenger, twitter, browsers, and other sources. Current trends are moving away from traditional forms and trying to gradual engage the user for a more positive and productive experience.

Some tips offered by the speaker Wroblewski:
1 – Details Matter – Timing  and site relevance should be considered when designing and using  dynamic in-line responsive interactions.

2 – Do Not Take User Out of the Context of their Path – Too many layers are not good. New interactive web forms should provide a better user experience, over-complicating forms or re-routing a user will make the user uncomfortable.

Web Usability

For a website to be successful, it must be usable by its users. Users’ goals are to accomplish tasks with little or no difficulty.

Usability testing enables web developers to understand audience needs and in return, produce stronger and more effective sites.

I was curious to see what tools are available for usability testing. I explored, read, and in some cases tested a few tools web designers are using.

Some tools available are:

• Usertesting – At Usertesting.com the purchaser can select their target audience by gender, age, country, income, and web expertise. Purchaser can define where their testers should begin, the test scenario, fill-in tasks to be completed, and design post-test questions. Results can be delivered in a written summary describing what testers found and/or a video of tester speaking thoughts as they use a website.Other usability testing sites are Uegroup and Feedbackarmy.

• Usabilla – Usabilla sets up tests and recruits users for testing. Usabilla recommends testing at any stage. This service would be good for testing new designs or layouts.

• Fivesecondtest.com – Fivesecondtest is just that – 5 seconds to view and evaluate. They provide user feedback results guided by first impressions of a website. Fivesecondtest is good for brand/logo testing and user first impressions. A plus of this site, is they have a free public community service, other options are tiered pricing.

• Silverback – Silverback provides a software that captures both video and screen of website users during usability testing. The drawback is all analysis of data must be done in-house.

All services claim the usability feedback will provide at minimum double return on investment.

Web Accessibility

Our class  has discussed website accessibility in terms of color blindness, fonts selection, font size, font clarity, and alt tags, but only touched on accessibility standards in the context of JavaScript**.

In-class exercises exposed accessibility compliance issues commonly found with JavaScript and other web scripting languages. JavaScript is fun, it allows developers to add increased interaction, information processing, and control to web pages. At the other spectrum, JavaScript can be a drawback to website users with accessibility issues.

Some of those accessibility issues can be:

• Web browser incapability
• Hidden content
• User control

A web page designer need not to remove all JavaScript from a web page for it to be accessible. There are ways to ensure the JavaScript is directly accessible and provide an accessible, non-JavaScript alternative. In fact, there are common uses of  JavaScript that meet accessibility guidelines, such as image rollovers.

Designing a JavaScript accessible web page involves some forethought. Some accessibility issues to address in final design are:

• Avoid event handlers that are  mouse-only use.
• Ensure content and functionality is accessible to assistive technologies.
• Ensure full navigation using only a keyboard.
• Do not cause confusion by using JavaScript to modify normal browser functionality.
• Put an Javascript alternative in place, for those whose browsers that may not support JavaScript natively.

Overall, accessibility needs to be discussed and incorporated into design of any website.  Anyone should have an opportunity to fully enjoy the web!!

**JavaScript compliance is covered in Section 508 of the Rehabilitation Act (in the United States) and the W3C Web Content Accessibility Guidelines (WCAG) 1.0.

Sources: About.com, WebAIM

Visual Web Design

Web design is the skill of creating presentations of content presented on the World Wide Web. Yes, web design like print design is a skill most often handled by gifted graphic designers. Whether one is a graphic designer or a novice at web design, there are some basic visual web design principles that can be learned and implemented to improve a website’s visual web design.

Why is there such an emphasis on good visual web design?
Good visual web design conveys a strong impression of a business, it communicates a companies’ personality and is often the web user’s first insight on a company.

What defines good web design?
Good visual web design enables site users to easily accomplish their goals.
Proper visual information organization of a website for end-users, provides an emotional impact, and can direct your audience to the important elements you wish to showcase on the website.

After reading some articles on color schemes and visual design, some elements of good web design can be summarized by some top tips I have found.

• Font choice / typography – Font should be easy to read. Use of fancy or non-standard fonts may not display the same across mutliple browsers. Too many font types can be distracting and confusing. Along the same lines, using too large a font, using too small a font,  or too many fonts  can cause a web user to find it hard to focus on a site.  Beside user dislike, these issues can present a problem for readability and therefore accessibility on website.

• Including Images – Images help retain user attention, and reduce the user drop-off rates.

• Long Paragraphs, No Breaks – Long run-on content is hard for a web user to read. Content should be broken into different paragraphs for clearer and easier reading.

• Heavy Flash - Flash intensive sites can result in slower loading times, lack of accessibility (must download plugin in some cases), and maybe prove to deter some web users.

• Too Powerful Background - Using bold or busy image in the background can hinder the web user from reading content.

• Advertisements/  Popups OverKill - Users bombarded with advertisements or unnecessarily pop-ups can become easily annoyed and frustrated, pushing a user to leave a website.

• Invisible Links – Links should be marked by text decoration or coloration. A web user can be annoyed searching for a link.

• Color Schema – Choice of color is an important part of website branding as well as creates a “mood” for the website. Colors should be choosen carefully with target audience in mind.

• Whitespace – Whitespace can offer a clean presentation, providing padding or breaks in content as another tool of organization.

In summary, visual web design is an important factor in creating a good web presence, promoting accessibility, and retaining a web user.

Sources: Wikipedia, 1stWebDesigner, Opera Development

My Site Is Broken In IE

How many times have you seen a web page rendered in one browser and the same page look somewhat skewed in a different browser? Several…I am sure.

This is the importance of web standards. If implemented properly across browsers, web standards diminish many of the problems of browser inconsistencies and allow for a better user experience. To achieve this goal, it is important that developers of both browsers and web pages follow Web standards.

What are web standards?

The World Wide Web Consortium (W3C) and other groups established technologies for creating and interpreting web-based content. These technologies established are named “web standards.”  Web standards are designed to deliver the greatest benefits to the greatest number of web users while ensuring the long-term viability of any document published on the Web.

The current web standards endorsed by the W3C are:

• HTML 4.0 – HTML is the main mark up language for web pages. Its “tags” are interpreted by the browser to determine web page structure.
• XML 1.0 – XML is a set of rules for encoding documents. XML contains user defined set of “tags”.
• XHTML 1.0 – XHTML is a XML markup languages that extends versions of HTML. XHTML is normally used when there is a need to re-process content.
• CSS 1 & 2 – CSS provides the ability to change the appearance (layout, colors, fonts) of XML and HTML elements.
• DOM 1 – DOM is an API for interacting with the structure, content, and presentation of a HTML document.
• ECMAScript – ECMAScript is used for client-slide scripting  in many languages like JavaScript, Jscript, and ActionScript.

An ideal website and browser should be built to adhere to the W3C web standards and pursue web best practices. Web sites built using web standards tend to be clean, CSS-based, accessible for special needs users, usable, search engine friendly, easily maintainable, and have low-overhead. In addition, browsers built to adhere to W3C web standards are backward and forward code compatible.

Sites or browsers built using the W3C web standards provide a common language of communication among web developers that is accessible to anyone through a web browser.

The importance of standards, ideally,  is there is no need to learn a new language to communicate over the web, every browser allows for the same functionality in a web page, and all information is interpreted the same in each browser.

Sources / References: Webstandards Group, Webstandards Organization, Max Design, W3C

IAs : Information Architects

Information architecture (IA) refers to the structure or organization of a website. It is a method used to create a blueprint of a website before any design is begun. Information architecture for a website encompasses page relation and website organization that is consistent and predictable for a user. The term “information architecture”, coined in 1975, is credited to Richard Saul Wurman. Wurman, originally trained as an architect was interested in the way information was gathered, organized and presented. Lately, more careers in information architecture have emerged. Many information architects have a background in graphic design, human-computer interaction, and library and information science.

According to research, there are two main approaches to designing an information architecture:

• Top-down approach – understanding user and business needs before defining site structure and content relationships.
• Bottom-up approach – understanding content relationships and user requirements before considering higher level structure.

Considering both approaches and establishing a balance is key to information architecture. A site that is well-organized may not meet the user or business needs. On the other hand, a site that meets user needs may not be well-organized so that users may find related content.

An interesting article titled Just Behave Information Architects Are From Venus, SEOs Are From Mars written by Shari Thurow shows how SEO professions tend to differ in intent from Information Architecture professionals. The author proclaims “..a #1 Google position does not ‘prove’ that your site is architected well.” She lists three common mistakes made by SEO professionals on websites.

• Not considering different types of searcher behaviors.
• Creating a website information architecture exclusively from keyword research data.
• Not understanding user/searcher mental models.

Sources / Helpful Links: Microsoft Frontpage Help, SearchEngineLand, Webmonkey, Website Tips, Wikipedia, Step Two

Throw out Traditional Journalism : Writing For the Web

There are many more details to consider when writing for a website versus print media.
Items to be contemplated:

• Non-linear nature of website content.
• Accessibility issues of possible website users.
• Engaging the user through context and word selections, using action verbs.
• Avoiding wordy pages void of relevant information.
• Making navigation titles and form fields descriptive, yet clear to the user.

Web writing follows a solid methodology that is unlike other types of writing for print. Before typing a word, a web writer needs a plan, a blueprint, so to speak.
There are many tools used to assist in planning:

• Copy desk -  text document of all textual website elements.
• Content inventory – a spreadsheet showing the current state of all pages on a website. A content inventory answers questions like what content does the site have? Is it accurate?
• Style guide – defines word usage, voice and tone guidelines, language guide and examples of each.
• Wireframe – web page template for a better understanding of content placement and textual length.
• SiteMap – hierarchy of website.  Enable understanding of  page relationship.

Web print is important because it is a space that interacts with the website user and provides these users with relevant information to solve business problems. A good example of this is a website’s frequently asked questions (FAQs).

It is a proven fact that many web readers just scan pages looking for relevant or interesting information.
The ability to organize content into intuitive and non-complex manner is the job of a web writer, they are
tasked with providing content that will allow users to do things online a little bit easy.