Web Performance is Crucial
Website speed can make or break a business’ performance. Google includes page speed as a SEO ranking factor and penalizes sites for slow web performance. Customers also penalize slow sites, with 40 percent abandoning sites that take longer than three seconds to load, according to Kissmetrics.
In light of the importance of website speed, Internet Retailer regularly tests the performance of today’s leading e-commerce sites. The tests measure site response time, availability and consistency, with sub-rankings for mobile carriers, end-user machines, home page performance and transaction performance. Here are the top three winners from tests run in June of 2015 and some lessons web designers can learn from each.
Costco
Costco took first place in Internet Retailer’s test, jumping from number five in previous tests. Costco ranked number one in the transactions subcategory and within the top five in all four subcategories. An analysis of Costco’s home page reveals some reasons for its good performance. On mobile devices, the top of the page displays icons for easily accessing key features, such as a drop-down list of shopping categories, a search bar, a list of store locations and a user’s account and shopping cart. A rotating image carousel showcasing current hot offers also displays above the fold. Below this are large tabs highlighting top-selling items. On desktops, the same elements are visible, but the categories list appears on the left as a fully-visible menu and the rotating offer displays on the right of this menu.
As these desktop adjustments illustrate, Costco’s site is designed responsively. An analysis of Costco’s home page with Google’s PageSpeed Insights tool indicates that the viewport area adjusts responsively to the size of the user’s device, enabling it to render properly on all devices. The content also adjusts responsively, ensuring a positive user experience. Web developers and designers should make sure their websites have responsive design to improve their sites’ performance and customers’ user experience.
Amway
Amway’s site came in second overall, moving up from number three. It ranked first in both the mobile and web performance subcategories and second for end-user machine performance. Amway’s blog displays most of the same winning features as Costco’s site, with an even cleaner layout. On mobile display, the blog divides neatly into a top menu bar with icons for accessing key features, a banner area showing the company’s logo and the blog’s tagline, a rotating image carousel spotlighting top featured posts and a bottom area showing the first featured post’s headline and image. On desktop displays, the banner logo moves above the menu row, the menu drops beneath the banner area and displays using text command options, the rotating carousel dominates the remaining space above the fold and a horizontal row of featured posts displays beneath this.
An analysis with Google PageSpeed Insights shows that in addition to having these features in common with Costco’s site, the two sites also avoid the use of plug-ins. Google explains that plug-ins for accessing special types of web content, such as Flash, Silverlight and Java, are not supported by most mobile devices, making them one of the leading causes of hangs, crashes and security incidents. Developers should avoid plug-ins to enhance their performance.
Apple
Apple’s website came in third in Internet Retailer’s test, leaping from number seven and ranking second in the transaction subcategory and third in web performance. Apple’s homepage displays a simple layout on mobile devices, with an icon-only top menu for navigating key features. The top half of the screen highlights a product by showing an image against a background with ample white space. The bottom half shows a list of similar images. On desktops, the top menu adds some text command options, and the bottom images get stretched out into a horizontal row.
Google PageSpeed Insights identifies most of the same features on Apple’s site that make Costco and Amway’s sites successful. Another characteristic shared by all three sites is a legible font size. The text on Apple’s site displays in relatively large characters that are easily visible on mobile screens, which is necessary for user-friendly performance.
