Sassyfox. Com Website Analysis
Sassyfox.com is the website for Sassy Fox, a boutique located in downtown San Angelo, Texas. The audience demographic for the site consists of both women and teenagers, featuring the two categories “Sassy Ladies” and “Sassy Kids.” While the website is supposed to serve as a webstore for the boutique, Sassyfox.com has a lot of problems that hurt the usability of the site. For this analysis, I have broken the user experience into three categories: 1) Information Architecture; 2) Content; and 3) Design. Designing concepts author Jeff Johnson defines in his book, “Designing with the Mind in Mind” will be used in each section.
Information Architecture
In the first few chapters of the book, Johnson stresses the importance of structuring a website with user goals in mind and creating a layout that is both predictable and easy to navigate. These are the principles that information architecture is based on and is something that sassyfox.com heavily violates. Examples of this include the website’s category-based navigation and accessibility of important information.
One of the greatest problems affecting the usability of the website is its category-based navigation. In chapter seven, Johnson defines navigation as the informational “breadcrumbs” that guide a user to his or her …show more content…
goal (99). Good navigation is effortless, which makes accomplishing a task more of a mechanical motion than a cognitive one. Upon first viewing Sassy Fox’s website, it looks like a webstore that sells the same products as their physical location. It has category hyperlinks for clothing, shoes, housewares, etc. But in reality, the only products the webstore offers are shoes, accessories, and gift certificates. Unfortunately for the user, it takes a lot of dead-end navigating to figure this out. For example, “Sassy Ladies” is the first category link listed in the main menu bar. Clicking on this brings up a dropdown menu that lists seven different subcategories. Hovering over the subcategory “Bottoms” pops out a side menu to the right with two additional items. So in the single category “Sassy Ladies,” a user has the potential to view nine different options. However, each one opens up to a blank page (Figure 1).
In addition to structuring the website for products that do not exist, Sassy Fox fails to prioritize important information with its navigational inconsistencies. While Johnson uses “visual hierarchy” in the context of web design and text, information architecture groups content (i.e. primary, secondary, and tertiary) in a way that allows users to easily “focus on relevant information.” Johnson explains, “visual hierarchy allows people, when scanning information, to instantly separate what is relevant…they find what they are looking for more quickly because they can easily skip everything else” (34). For example, it is not uncommon for people, especially mobile users, to visit a site with the purpose of finding out a business’s phone number and/or location. But to access this information on Sassy Fox’s homepage, two different methods of navigation must be used. For the phone number, users can either scroll to the top of the page where the secondary menu is located or the footer. Here, they will find the number in plain text, but not its physical address. For that, users have to click on the “LOCATIONS” link in the footer and navigate to a separate page (Figure 2).
Poor information architecture upsets the fluidity of navigation and makes for a frustrating user experience.
In their mapping of the website, Sassy Fox misleads users in the products they have and fail to keep their goals in mind by making it difficult to access related information. In my opinion, the website would benefit from getting rid of its category-based navigation and adopting Pinterest-style layout. Because there are so few products on the website, allowing users to filter the products they want to see would be more efficient. Also, it would be better to not have the location hyperlinked and make the phone number and address available on both the secondary menu and footer of the
homepage.
Information Architecture
In the first few chapters of the book, Johnson stresses the importance of structuring a website with user goals in mind and creating a layout that is both predictable and easy to navigate. These are the principles that information architecture is based on and is something that sassyfox.com heavily violates. Examples of this include the website’s category-based navigation and accessibility of important information.
One of the greatest problems affecting the usability of the website is its category-based navigation. In chapter seven, Johnson defines navigation as the informational “breadcrumbs” that guide a user to his or her …show more content…
goal (99). Good navigation is effortless, which makes accomplishing a task more of a mechanical motion than a cognitive one. Upon first viewing Sassy Fox’s website, it looks like a webstore that sells the same products as their physical location. It has category hyperlinks for clothing, shoes, housewares, etc. But in reality, the only products the webstore offers are shoes, accessories, and gift certificates. Unfortunately for the user, it takes a lot of dead-end navigating to figure this out. For example, “Sassy Ladies” is the first category link listed in the main menu bar. Clicking on this brings up a dropdown menu that lists seven different subcategories. Hovering over the subcategory “Bottoms” pops out a side menu to the right with two additional items. So in the single category “Sassy Ladies,” a user has the potential to view nine different options. However, each one opens up to a blank page (Figure 1).
In addition to structuring the website for products that do not exist, Sassy Fox fails to prioritize important information with its navigational inconsistencies. While Johnson uses “visual hierarchy” in the context of web design and text, information architecture groups content (i.e. primary, secondary, and tertiary) in a way that allows users to easily “focus on relevant information.” Johnson explains, “visual hierarchy allows people, when scanning information, to instantly separate what is relevant…they find what they are looking for more quickly because they can easily skip everything else” (34). For example, it is not uncommon for people, especially mobile users, to visit a site with the purpose of finding out a business’s phone number and/or location. But to access this information on Sassy Fox’s homepage, two different methods of navigation must be used. For the phone number, users can either scroll to the top of the page where the secondary menu is located or the footer. Here, they will find the number in plain text, but not its physical address. For that, users have to click on the “LOCATIONS” link in the footer and navigate to a separate page (Figure 2).
Poor information architecture upsets the fluidity of navigation and makes for a frustrating user experience.
In their mapping of the website, Sassy Fox misleads users in the products they have and fail to keep their goals in mind by making it difficult to access related information. In my opinion, the website would benefit from getting rid of its category-based navigation and adopting Pinterest-style layout. Because there are so few products on the website, allowing users to filter the products they want to see would be more efficient. Also, it would be better to not have the location hyperlinked and make the phone number and address available on both the secondary menu and footer of the
homepage.