Amazon's New Website Promotes Simplicity and Mobile-Friendly Use

This week Amazon rolled out some important design changes to its website it's been working on since this summer. The major changes to Amazon's new website include a more compact  header, larger search bar, and the addition of a Fire and Kindle navigation drop down menu. The new site is still limited to only some of the e-tailer's visiting customers, and it's only speculation as to when the full version will be completed. Other speculations surround the motivations behind the change itself. Some are crediting the site change to Amazon's strategy to simplifying e-commerce for tablets and phones. Since buying online has become the major way shoppers use Amazon's services, this would make sense. Also, the new website's design seems "app"ly suited for such digital devices. In contrast to the previous design, much of the products are now listed in horizontal rows. This anticipates shoppers who swipe (left to right or right to -left) through selections, which is one of the most common forms of navigation for tablets and phones. Amazon's new design has a flat look and feel to it. A big part of this effect is created by the new look of the header, which sports a darker, gray border that contains a much longer search bar. The dark border helps frame the site and establish a termination point at the top, something that plays against the more open, more confusing white format of the previous design.
Before After


You can see in the comparison above how the new dark gray border provides a sense of containment and predictability to the page’s collection of products. You will probably also notice that the advertisement for the Fire TV Stick has now been flatted and stretched across the entire page. Unlike the old ad, (whose blocky image seems simply plopped down in the middle of the page), the new one appears more compartmentalized and contained. It now fits nicely within the overall environment. The new one is also a more attractive, darker orange.

Another aspect of Amazon’s new header is the addition of the “Fire & Kindle” drop down navigation menu. The new menu is split into Fire Phone, Fire TV, Fire Tablets, and the Kindle. This also suggests that a large part of the redesign was motivated for marketing Amazon’s electronic devices and digital media in general. The drop down menus, overall, are much more visible than their predecessors because the new design now darkens the background when you engage them. This is usually accomplished by changing the background’s opacity. The effect is to lessen the background’s visual prominence and keep it from competing with the drop down menus. You can see in the before and after below the difference in how prominent the drop downs are now.

Before After


Amazon’s website changes may seem subtle, but these alteration in format are more likely to make searching via mobile phones an tablets more intuitive. In addition, the new sites’ flatter, more compact design should make it much more appealing to desktop users as well. From a historical perspective, you can say that Amazon is moving its web design in the right direction, especially when compared to earlier versions like the one below.

2011 layout