Discuss

UX

How to Tell Web Navigation and Information Architecture Apart

By | Blog, Social Media, Web Design, Web Store | No Comments

People in web design and development know that navigation design and information architecture (IA) concepts go hand in hand. In particular, IA is used to feed information towards usable navigation design.

Still, they are not the same. In fact, the reach of information architecture goes far beyond website navigation, which has been described as being only the tip of the iceberg that rests atop the site’s information architecture.

Information Architecture Defined

A site’s information architecture consists of two major components.

  1. The identification and definition of the site’s content and its functionality
  2. The basic organisation, structure, and classifications that define the connections between a site’s content and functionality

When you view a website, you’re not really seeing its information architecture (IA). Instead, IA informs the user interface, the part of the site you interact with. The IA is documented in diagrams and spreadsheets, not in prototypes, comprehensive layouts, or wireframes.

example of an information architecture site map

Here is an example of an information architecture site map by the Nielsen/Norman Group’s (NN/g) website. The blue nodes show tier-one information objects, while green nodes show tier-two objects, and tier-three objects are shown in yellow. 

While IA itself may not be visible to users, it definitely has a crucial impact on the site’s User Experience (UX), defined as the totality of everything the user encounters while on a website. However, users will feel  the structure of the site, depending on how its content is divided and connected in ways that meet their needs.

Website Navigation Defined

A website’s navigation is comprised of several user interface components. Navigation is designed to help users locate information and functionality, hopefully leading them towards favourable actions. Main components of navigation include local navigation, global navigation, utility navigation, facets, filters, footers, related links, and more.

example of navigation components

Examples of navigation components shown above

Some decisions have to be made when thinking of each navigation component. For instance, when usage priority is concerned, you need to ask yourself how much users depend on a particular navigation component. Placement is also another factor, calling for answers on which pages a navigation component should be present in. Lastly, the pattern is a factor that calls for questions on which navigation design patterns best support discoverability, whether it’s carousels, megamenus, or more.

IA and Navigation Relationships

The mistake many designers make when building a site is that they ignore IA and focus only on navigation. Doing so is inefficient, not to mention dangerous. Navigation that fails to address the full scope of content and functionality of a site can be a costly mistake.

For instance, imagine a design team opting to use the common inverted-L style navigation consisting of a top navigation bar and a left navigation rail, because they like how it looks. This template can be used on sites that have no more than 4 tiers, so you can only imagine the headache the design team has when they realise later on during a site inventory that many parts of the site will be more than 4 tiers deep.

IA First Before Designing Navigation

That being said, it’s important for designers to first define or redefine the site’s IA before even thinking of a design project. While it’s true that the IA has to be flexible to accommodate new information, it doesn’t have to be final before wireframing and prototyping—a first pass is enough to get an idea of the volume and complexity of the content.  Making choices on your navigation components based on appearances alone can force you to remodel your IA, or cram too much information in a navigation component, ending up in your website failing to accommodate the needs of users.

Google Analytics reports UX specialists should pay attention to

By | Blog, ecommerce, Research, SEO, tools, Web Design, Webpage Monitoring | No Comments

image1 (4)

Contrary to popular belief, Google Analytics doesn’t just provide information about website traffic, it also provides useful data to UX strategists, helping them set goals, and create strategies and concepts for a sound web design.

Of the 95 reports Google Analytics provides, a few offer incredible useful information ranging from how visitors interact with your website, where visitors came from, to the best channels to use for your goals. Ironically, Google Analytics suffers from a lack of web usability—it can be confusing to navigate your way through the service. Worse, finding which report can help you with your usability goals can be a nightmare.

Usability experts the Nielsen/Norman Group compiled a list of the Analytics reports you can turn to for UX applications.

Mobile Access Growth

This information is key when trying to figure out whether or not your site should also be friendly to mobile devices. How much should you invest in an adaptive web design? What kind of priority level should your mobile initiatives receive?

To compare the quantity of mobile traffic between two similar periods, say February 2014 against 2013, turn to Google Analytics’ date comparison feature, and combine it with some easy calculations offline.

Report: Audience Overview

  1. Go to Audience > Mobile > Overview
  2. Choose a date range, then add  comparison date range
  3. This report’s % Change line represents the change in percentage of absolute mobile visits for the specified date ranges. This is not the information you’re looking for, so ignore this
  4. To find the growth rate in percentage of mobile visits, perform a simple calculation by taking the number of mobile visits, dividing it with the number of total visits, finally calculating the rate of change.

Social Network Impact

Google Analytics also provides a useful report if you want to find out just how much your social network activities impact your goals, particularly when it comes to your content strategies (e.g. what content is shared most often and where it’s shared).

Report: Network Referral

  1. Go to Acquisition > Social > Network Referrals
  2. The report gives a detailed view on referral traffic coming from social networks. You can even click on the indicated networks to see which specific content people are sharing on that social channel.

Conversions

This report offers granular information on the way certain channels add to acquisition, how users originating from these channels act on your site, as well as how these channels contributed towards reaching your goals defined on Google Analytics.

Report: Goals Overview
1) Go to Conversions > Goals > Overview
2) Choose Source/Medium
3) Click on ‘View full report’

4) Upon reaching the full report screen, choose your ‘Source’ and then choose the goals you want to filter.

Number of Visits Prior to Conversion

When assessing and conceptualizing website usability, many UX teams like to build customer-journey maps designed for their target personas. These maps indicate interactions prospects are most likely to take before a conversion (before they become a customer).

Report: Path Length

  1. Conversions > Multi-channel funnels > Path length.
  2. Choose your desired goals to filter

The Path Length report provides a good idea on the number of visits to your websites before users convert or move on to other desirable actions (which you will define in your Analytics account).

Knowing the right reports to base your UX decisions of is the first step towards improving the usability of your website. Google Analytics is a powerful tool, so it is very important to know how to wield it.