The name Amazon.com has become synonymous with eCommerce.
If you are reading this blog, there is no doubt that you have ordered something from Amazon.com from the comforts of your desktop or laptop computer.
Today, it is only slightly less likely that you have ordered something from Amazon from your phone.
I’m no exception. Yesterday, I ordered a pair of ear buds on my iPhone from Amazon in between the time my dental hygienist cleaned my teeth and the dentist came in to give me the verdict.
We asked our Crazy Egg Design and Marketing Experts to analyze the Amazon mobile website design. Take a hard look yourself, read through our opinions and, if you are so inclined, give us your analysis in the comments below.
Design aspects that Amazon’s Mobile Homepage is doing well include:
1. Using a simple one column structure as a list view for the interface. Adding multi column structures for any small mobile device makes the entire real estate feel crammed and harder to use.
2. Keeping things simple by introducing high level functions and options that are most important such as: search, cart, wish list, streamlined menus.
3. Information for the product is minimal to start, but if user is interested, they can go to the next layout with more details. Biggest mistake most people make is providing too much copy/content on one screen, especially for mobile.
4. Option to use full site at the bottom. Providing the user the option to choose experience is important.
5. Graphics, colors, and overall aesthetics are clean and minimal – which help performance and keep maintenance costs lower.
~Cesar Keller, Simple Flame
♦♦♦
The user experience for the Amazon Mobile site should be very simple; make it as easy as possible for someone to find a product and complete a purchase. This successfully achieves that, and by focusing on the most popular product categories (Books, Kindle, Movies and Electronics) it can keep the navigation as intuitive as possible.
I’m also really happy to see that they offer a clear link to the Amazon.com full site. It’s amazing how many mobile sites don’t do this.
~ Robin Cannon, Shiny Toy Robots
♦♦♦
The Amazon mobile home page is a great example of a mobile optimized website. It’s easy to navigate and gives the user what they are looking for right away – the amazon search bar.
The ad below the search bar for Amazon Apps doesn’t appear to be an ad at all and is, very likely, the reason the user navigated to Amazon on their mobile device in the first place.
The mobile site seems easy to navigate since appears very similar to the regular website. The cart is at the top, always reminding you how many items you have so far and the search bar and department categories are easy to navigate as well.
~ Angela Jones, Design By Ange.la
♦♦♦
Amazon are usability experts. Their website isn’t the prettiest thing out there, nor is their mobile site, but they do an amazing job of getting users to the products they want! I buy just about everything I own from Amazon and I do that not only because of pricing but because it can be easier to find it on Amazon than my local retail outlet. Retailers, are you listening?
Given how much attention Amazon pays to what users are doing on their site, they most likely took their top categories and made them easily accessible. The arrows on the buttons are great functional suggestions. I can tell that if I push Books the page is going to slide down in an accordion effect and I can tell that if I push See All Departments I’m going to head off to another screen. This is very effective in letting the user know what’s going to happen. To the savvy user it lets you know what you can do with a spotty 3G/4G connection and what you may want to wait for a more stable connection to do.
I love how the account specific and sub-categories are styled differently. This style change lets me know that these choices are specific to me and/or my account.
Finally, the best part of all, FULL SITE! I can’t tell you how many poor mobile sites I’ve been to where the experience was so lacking I wanted to go to the full site. You know what those poor mobile sites all have in common? They don’t let you go to the full site! A+ to Amazon for giving me the freedom to choose.
~ Christopher Lee, Christoper Lee Designs
♦♦♦
The site looks very clean and easy to use. The theme matches the www.amazon.com theme and helps promote the website’s branding.
The two containers (blue and yellow) have different styles. The blue one has rounded corners and is smaller in width than the yellow one – which has square corners. It might be more consistent if they were both the same style unless they are supposed to be separated.
From the screenshot it is unclear as to whether the department list is used when a search is done (as is the case on the www.amazon.com). This is mainly due to having advertisement in between the search field and the department list.
The Cart and Wishlist links are duplicated once up the top and once down the bottom. Given that mobile screen space is limited, one set should be removed.
~ Sanj Sahayam, Unique Imprints
♦♦♦
This is a very useful mobile page. It has most of the features of the main site, in a smaller format with quick links to get to the most popular items. I would guess that Amazon has research or analytics telling them which categories are essential to show on this page, so I trust their judgment.
I could nitpick some stuff (like wasting so much height on the ad for the Kindle Fire ensuring that anyone on an iPhone will never see the menus without scrolling down first), but I said I wouldn’t nitpick so I’ll stop.
~ Brian Schwartz, Spoke Marketing
♦♦♦
The great thing about the Amazon Mobile home page design is the fact that it is a simple design that one can identify as Amazon just by the fonts and colors. The use of the viewable space (before you would have to scroll below the fold) is great. The subtle placement of “deals” below the logo is pretty sly, plus having the button to promote the mobile app below the search bar is a great idea. The end user may find it easier to download the app and have it readily available then have to navigate to Amazon each time through the phone’s browser.
~ Joseph Kalinowski, Content Marketing Institute
♦♦♦
The Amazon mobile home page does an impressive job of presenting their large and complex navigation into a scaled down intuitive menu. The order and use of different colors for the primary and secondary menus helps provide visual clarity. I like that they’ve featured search and their mobile app at the top of the page, since those are likely top actions for mobile users. The blue primary accent color leaves orange (opposite on the color wheel) as the optimal CTA color which they implemented fairly well.
On the improvement note, links on the page need an audit check for adequate text size and padding to ensure they’re easily clickable. (Tip: Your pinky nail can work as a handy mobile sizing/spacing guide for links since it’s mostly likely the size of the your index finger’s pressable surface area.)
~ Angie Schottmuller, Search Engine Watch
♦♦♦
This is a very decent way to show the most popular navigation options. I’m sure that Amazon tested this pretty thoroughly before concluding what people would click on most.
The only thing I’d like if I were to use that application is that the advertisement was further down underneath the departments. It seems more intuitive to have them directly underneath the search box instead.
~ Naomi Niles, ShiftFWD
♦♦♦
I think the Amazon homepage has struck an excellent balance between easy navigation to a lot of different places (which is absolutely necessary, given the complexity of the site), and showcasing the product that they are currently trying to “push” (currently the Kindle Fire). The guideline that I’d take away from this design is that first you want to put front and center in front of your audience whatever you want them to see, and then immediately give them access to anything that they might be looking for.
~ Danny Iny, Firepole Marketing
♦♦♦
First, I think it is clear that getting the word out about Kindle Fire is a primary goal of Amazon’s. I like the way the product is featured with an image and a clear call-to-action without trying to say too much on the mobile home page. If you want to know more, click the “Learn More” link.
Secondly, it is clear that it has been detected that I am using an iPhone to reach the mobile version of the website. This has caused the mobile home page to display a call-to-action to download their iPhone applications.
Lastly, the navigation is brilliantly organized which is no small feat for a company that sells the wide array of products that Amazon sells. They list the most popular “departments” on the home page and then a link to “See All Departments” if you don’t find what you are looking for. This allows them to serve the majority of people without cluttering up the mobile interface with links.
We know that many of our readers are experts in design and marketing as well. We would love to hear your critique of the Amazon Mobile Home Page in the comments!
