Your e-commerce website's performance can make or break your online business. With a slow page load time, you can easily turn a potential customer into a disgruntled customer who will most likely not go back to your site again. That is why it is necessary for you, as an e-commerce merchant, to find ways to reduce page load times without sacrificing the quality of your website's aesthetics (video and graphics in particular). How do you balance aesthetics and website efficiency? Get Elastic guest columnist Armando Roggio shares tips for a faster e-commerce website.
According to Roggio, the first step is to measure your current page performance. To do this, there are several tools that can be used. One is WebPagetest which is a free service which basically gives you "a waterfall view of your site’s performance, along with other reports. This resource will give you an idea of which page dependencies are the biggest hold-ups to your site performance." There are also three Firefox plug-ins that you can install to measure page performance. The writer also notes that "Firefox is, perhaps, the best web browser for designing, developing, and updating a website because it provides so many great add-ons that make it easier to learn what a site is doing or how it is coded."
The first Firefox add-on is Firebug. It is, according to the article, "the premier, free site inspection, debugging, and analysis tool." It is also a prerequisite to the next two add-ons. The next is YSlow from Yahoo! which "builds on Firebug to analyze your web page, comparing it to known performance best practices." Finally, Roggio suggests getting the Google Page Speed which he describes as "very similar to YSlow with a slightly different rule set." He noted that it is helpful to compare results from these two tools to more accurately determine the critical areas of site performance.
Now, on to the tips for a faster e-commerce website.
1. Make fewer HTTP Requests. HTTP can be a leading cause of slow page load times and Roggio recommends three tips to cut down on HTTP requests. First, if you have a lot of JavaScript files on your site, use LABjs which is a free tool that loads JavaScript files in parallel. Simply put, your pages could load way faster than they normally would. Next, Roggio recommends "having one or two larger cascading style sheets instead of several smaller files." And finally, use image sprites. According to the writer, "a sprite is a compound image that contains all of the various states of variable site graphics." For an example of image sprites, check out the menu in Apple's online store.
2. Optimize your images. Remember that PNG files are file size savers (and have much higher quality) as compared to GIF files and that JPEG files "offer the best balance of image quality and file size." Roggio also suggests using Pngcruch which is "an image file optimizer that can squeeze every wasted bit out of a PNG file."
3. Use a Content Delivery Network. A content delivery network is "a series of data depots that store copies of some files. When a user makes a request the requested data is pulled from the depot nearest to the client, shaving milliseconds off of site load times."
0 comments:
Post a Comment