A major factor of website usability is navigation. If user’s can’t find something on your site they’ll go somewhere else. But Forbes points out that giving visitors too many options can be equally bad. Frank Lockwood, Associate Creative Director of gryo, wrote that companies should identify both their business objectives and a customer’s objectives when dealing with a website. He recommends grouping content together in ways that make it easy for visitors to find – this practice has the added bonus of limiting the number of choices, which keeps visitors from becoming overwhelmed, confused and frustrated. In Forbes, Lockwood outlines three guidelines when it comes to website navigation:

• Observe the rule of plus or minus seven. Visitors can handle only so many options before they become overwhelmed. In general, the number of options an average human can process is seven, so try to keep categories at this size. If you find that the choices are becoming too plentiful, create subcategories and feed content into them to aid visitors.
• Most of your visitors come from a search engine first, and it is highly likely they will not land on your home page. Therefore, your categories must make sense if a visitor is on the “Home” page versus the “Risks of Bears in the Office” page.
• Finally, keep in mind that you’re (hopefully) still a growing business. You need to have locations for all future content and to give visitors answers to their most common questions. That means to be sure categories are ready to scale for future business growth.

See more of Lockwood’s recommendations at Forbes >>>

When it comes to website usability, there are a lot of things to consider. Usability testing, headed by a UX expert, will help you ensure you don’t miss a key issue.

You already know that you can’t simply shrink your website to fit a mobile device. If you did, the site would be all but un-navigatable on a small touch screen operated with big clumsy fingers. But still, the idea of a mobile-specific “responsive design” is tempting. There are so many different sizes of mobile screens, and you spent so much time into making your website just perfect, why not simple scale it to fit the device?

The simple answer is, sometimes you can but it depends on your site’s purpose and content. Carin van Vuuren, chief marketing officer for Usablenet, wrote a guest post on this topic for Forbes. Here’s an excerpt from her helpful break down of when you can and can’t rely on responsive design.

A good example of this dilemma can be found in LinkedIn’s recent approach to developing its iPad app. According to Kirin Prasad, LinkedIn’s head of mobile development, responsive design doesn’t work for complicated sites like the LinkedIn iPad app, 95% of which was developed with HTML5 to target a specific set of user tasks. This approach allows LinkedIn to create different experiences on different devices based on use case and context. For the majority of sites that require an interactive experience like LinkedIn’s, responsive design limits the different designs necessary to deliver functionality for each use case.

So when is responsive design an appropriate solution?

When the only changing factor in the Web experience is the user’s device, responsive design is a useful solution. It works very well for content sites like magazines and newspapers, because content is simply being reformatted. If you’re accessing a publication’s website on a smartphone, for example, you still want to read the news, just smaller parts of it.

People magazine recently adopted responsive design to great effect in order to scale traditional Web content across screens. This works well for magazines and other content publishers, as users are coming to consume content, not necessarily to interact or search for certain answers.

Read the full article at Forbes >>>

So a simple rule of thumb is: If users will need to interact with your website, stay away from responsive design. If your mobile site is meant for content consumption (without much interaction), responsive design is an acceptable decision. Need help making sure you made the right decision? Acquaint yourself with the Keys to Mobile Usability and invest in some good usability testing.

According to the 2012 Conversion Rate Optimization Report (produced by Econsultancy and RedEye), companies are embracing mobile-optimized websites more than ever, but we still have a long way to go – particularly when it comes to website usability testing.

Here are some key mobile website facts from the report:

• 23% of websites are designed specifically for tablets (up from 13% in 2011)
• 35% of websites are designed specifically for mobile devices (up from 25% in 2011)
• 4 out of 5 companies still don’t design websites with mobile or tablets in mind
• 41% of companies optimizing for mobile conduct usability tests with mobile devices (up from 28% in 2011)
• 33% of companies optimizing for tables conduct usability tests with tablets (up from 16% in 2011)

Still not sold on the idea of mobile websites? Maybe this will help: According to the report, “62% of companies that designed a website specifically for mobile and 64% that designed a site for tablets had increased sales.”

It’s getting to the point where you can’t afford to not optimize your website for mobile devices. If you don’t, you almost certainly will lose customers to the competition. But remember, a vital part of creating a successful mobile site is doing adequate mobile website testing.

Someone recently posted a question to Quora asking “What are the best UI elements (controls, patterns, etc.) that have cropped up in modern web sites and web apps recently?” The questioner gives infinite scroll as an example, then leaves it open for others to add their favorite recent UI features to the list. Fifteen people have responded so far, here’s a few of their answers:

Stephen P. Anderson

“Sticky” headers/sidebar content – critical elements stay fixed as you scroll down the page (the way the gMail header stays fixed as you scroll through an email, lots of “share” functionality on blogs/magazines stays with you as you scroll down the page).

More “discoverable” controls (for better “cleaner interface” or worse “how do I do x…!?”); the Metro UI from Microsoft is able to produce cleaner screens because secondary elements are “hidden” in corners and edges (see: http://msdn.microsoft.com/en-us/… )

Bigger type sizes, hit areas, buttons and white space – so that Web apps might also be touch friendly w/o a lot of refactoring

Jeremy Johnson

Read more…

Getting a ticket is frustrating enough, but when you go to pay it online only to get a browser warning about a potentially non secure site that frustration is guaranteed to intensity. Unfortunately, because of a careless coding error and an apparent lack of testing on some major browsers, this is exactly what happened to visitors looking to pay fines using the UK’s Central Accounting Office Electronic Information Services. I’ll let Sophos explain:

The payment page is using SSL, so what is the problem? Well, unfortunately, the certificate being used on secure.informcommunications.plc.uk has actually been issued for *.latestinfo.co.uk. …

This discrepancy is what causes the above browser warnings.

In this case the problem is not caused by any malicious activity. Instead human error appears to be the culprit. Both sites (latestinfo.co.uk and informcommunications.plc.uk) actually resolve to the same IP. The problem appears to be that the link to the payment page uses the incorrect domain name. …

Read more…

Google’s Chrome now enables, and encourages, developers to embrace what Google is calling “packaged apps” – web-based apps that look and feel like native apps. According to this report from Information Week, these “packaged apps” sound like they’re basically hybrid apps (combining the benefits of web apps with the benefits of native apps).

Packaged Web apps may be new but they feel familiar. Google’s packaged apps platform, said Google engineering manager Erik Kay in a demonstration video, helps you “make apps that feel more like native applications.”…

n other words, it’s largely about appearances.

Packaged apps launch in their own window, like native apps, and they can be launched outside of Chrome, like native apps. They are offline by default and are less dependent on a network connection–a source of frustration for users when connectivity is slow or not available. They support system-level APIs to access TCP/IP, USB, and Bluetooth, as well as APIs for cross-application data sharing. And they support new app-windowing APIs so they can manage multiple windows, just like Windows, Linux, or OS X.

Read more…

It’s old news that a slow loading or buggy sites will drive users away, but users are apparently intolerant of sites being down for maintenance as well. That’s the finding of a recent survey conducted by 1&1 Internet , an UK analyst firm. According to a report by PCWorld,  1&1 Internet surveyed 1,500 web users and found that, overall, “consumers expect sites to be available 24/7.” And people are just getting more demanding – 44% of survey participants are more intolerant of web errors today compared to five years ago, and 40% said they wouldn’t return to a company because of a faulty website.

So what are the top five biggest complaints about websites?

1. Slow running websites – 71%
2. Sites down for maintenance  - 49%
3. Broken links – 44%
4. Online orders that freeze - 44%
5. Broken website pages - 42%

And if consumers can’t use your site, they WILL use a competitors.

Frustrations with a business website meant over two-thirds of those surveyed had left the site and gone to a competitor’s. …

Read more…

Accessibility matters. You can have the greatest web app in the world, but if users cannot easily find your content, then you’ve wasted a lot of time and energy (not all of it your own). So as a reminder of whats makes a site accessible, I wanted to share these 6 great guidelines for web usability, courtesy of usereffect.com. Take a look:

1. Site Load-time Is Reasonable. Call me old-school, but I still like to see sites come in under 100KB (60KB is even better). If a site takes forever to load, most people will just leave. Yes, many of us have broadband now, but that makes our patience even thinner.

2. Adequate Text-to-Background Contrast. Dark-gray on light-gray may seem stylish, but I’m not going to ruin my eyesight to read your blog. Eyes and monitors vary wildly, so keep your core copy contrast high. Good, old-fashioned black-on-white is still best most of the time.

3. Font Size/Spacing Is Easy to Read. Opinions vary on the ideal size for text, but err on the side of slightly too big. Poor readability increases frustration, and frustration leads to site abandonment. Also, make sure your line spacing is adequate – white-space is a designer’s best friend.

4. Flash & Add-ons Are Used Sparingly. No matter how great your site looks, people won’t wait 5 minutes for a plug-in to load. Use new technology sparingly and only when it really enhances your goals. Sticking to standard HTML/CSS is also a plus for search engines.

5. Images Have Appropriate ALT Tags. Not only do sight-impaired visitors use ALT tags, but search engines need them to understand your images. This is especially critical when you use images for key content, such as menu items.

6. Site Has Custom Not-found/404 Page. If a page on your site doesn’t exist, a white page with “404 Not Found” is a good way to lose a customer. Create a custom 404 page, preferably one that guides your visitors to content.

This list comes from the 25-Point Website Usability Checklist – required reading for all devs and testers.

Read the complete checklist here >>>

One of the biggest in-the-wild challenges for mobile web is connectivity and signal strength. Another rising issue is the surge of cheaper, less powerful phones (that users still expect mobile sites and apps to work on). Twitter tackled those issues head-on by revamping its mobile site so that it will work for more users – wherever they are and on whatever device they have. Twitter’s revamped mobile web uses a third less bandwidth and is faster – and is standardized across all mobile devices. Here’s why that’s important (from CNET):

The microblogging site announced today that “in an effort to give every person on the planet a consistent Twitter experience,” it is standardizing Twitter for all devices, networks, and browsers.

This means that people in places where smartphones are inaccessible and Web access is slow can now use the same version of Twitter on their mobile device as anyone else. …

With the standardization of Twitter mobile, people can access mobile.twitter.com from feature phones, low-bandwidth networks, or older browsers. Twitter says its latest version uses one third less bandwidth than older versions and as a result the site runs faster.

Read more…

As mobile web continues to advance it will be interesting to see which browser pulls ahead of the pack.

Safari clearly has a firm grip on iOS devices – though the addition of Chrome for iOS may threaten that – but Apple isn’t using that as an excuse to slack. New updates, including improved speed, are expected to hit the mobile browser with iOS 6.

The real competition comes from Android. Chrome, Firefox, Dolphin and a few other third party browsers are all available on Android devices. It appears that most of the companies are actively trying to outdo one another – and Firefox made the latest move. Users who got their hands on the newest Firefox Android app during beta testing raved about it and claimed it’ll be the best mobile browser available. Here’s what Devindra Hardawar, of Venture Beat, had to say:

The app now sports a slick new interface, incredibly fast start up and browsing speeds, support for Adobe Flash, and new HTML5 features.

In short, it’ll give Google’s Chrome Android app (my favorite mobile web browser) a run for its money. Mozilla also has a big advantage: The new Firefox app works on any Android 2.2 phone or newer, while the Chrome beta app only works on Android 4.0 devices. …

Just another example of alienating end users by deploying (or even just testing) for a limited portion of Android’s huge matrix. But back to the Firefox app.

Read more…