CS-Cart: Ultimate Guide To Web Optimization

Feb 24, 2016 Gomby SEO guide, seo

Ultimate Guide To Web Optimization
cs-cart search

Web optimization is a vital part of web development and maintenance but also something often overlooked by webmasters. Just think of the money you can save, and how it can potentially help increase your readership and traffic when they are properly done. 

If you have not done any optimization to your website (or blog) so far or merely curious how it can help speed up your site, please take a look at this list of optimization tips we’ve put together.

Optimization: Server-side

  1. Choose a decent Web Host

    Your web hosting account has no direct relationship with the optimizations you are about to perform but we figured choosing the right web hosting account so important we decided to bring it to your attention first. Hosting account is the foundation of your website/blog where it’s security, accessibility (cPanel, FTP, SSH), server stability, prices and customer supports all play important roles. You need to make sure you are in good hands. We recommend DigitalOcean and RamNode or Vultr.

  2. Host Assets Separately

    When we mention assets, we meant web components like images and static scripts that don’t require server-side processing. These includes any web graphics, images, Javascripts, Cascading Style Sheets (CSS), etc. Hosting assets separately is not a must, but we’ve seen tremendous result in terms of server stability with this implementation when the blog was having a traffic spike.

  3. Compression with GZip

    In short, contents travel from server side to client side (vicet versa) whenever a HTTP request is make. Compressing the content for sending greatly reduce the time needed to process each request.

    GZip is one of the best ways to do this and it various according to the type of servers you are using. For instance, Apache 1.3 uses mod_zip, Apache 2.x uses mod_deflate.

  4. Minimize Redirects

    Webmasters do URL redirect (whether it’s Javascript or META redirects) all the time. Sometimes it’s purpose is to point users from an old page to new, or merely guide users to the correct page. Each redirect create an additional HTTP request and round-trip-time. The more redirection you have, the slower user will get to the destination page.

  5. Reduce DNS Lookups

    According to Yahoo! Developer Network Blog, it takes about 20-120 milliseconds for DNS (Domain Name System) to resolve IP address for a given hostname or domain name and the browser cannot do anything until the process is properly completed.

Optimization: The Assets (CSS, Javascripts, Images)

  1. Merge Multiple Javascripts into One

  2. Compress Javascript & CSS

    Minify is a PHP5 app that can combine multiple CSS and Javascript files, compress their contents (i.e. removal of unnecessary whitespace/comments), and serve the results with HTTP encoding (gzip/deflate) and headers that allow optimal client-side caching.

  3. Customize Header Expiry/Caching

    By using a customized Expiry header, your web components like images, static files, CSS, Javascript skipped unnecessary HTTP request when the same user reload the page for the second time. It reduces the bandwidth needed and definetely help in serving the page faster.

  4. Off-load The Assets

    By off-loading, we mean separating the Javascripts, images, CSS and static files from main server where the website is hosted and place them on another server or rely on other web services.

    *Paid hostings – Paid services always have better reliability and stability. If your website is constantly requesting for the assets, you’ll need to make sure they are in good hands. We recommend Amazon S3 and Cloud Front.

  5. Handling Web Images

    Images are important part of your website. However if they are not properly optimized, they can become a burden and end up utilizing unpredictably large amount of bandwidths on daily basis. Here are some best practices to optimize your images:

    • Optimize PNG Images
      Folks at Smashing Magazine describes some clever techniques that may help you optimize your PNG-images.
    • Optimizing for Web – Things you need to know (the formats)
      Learn more about Jpeg, GIF, PNG and how you should save your images for web.
    • Don’t Scale Images
      Always practice inserting the width and height for each images. Also don’t scale down an image just because you need a smaller version on the web. For example: Do not force scale a 200×200 px image to 50×50 px for your website by altering the width and height. Get a 50×50 px instead.
    • Smush.it
      Probably one of the most efficient online tool to optimize images.
    • JPEG & PNG Stripper
      A Windows tool for stripping/cleaning/removing unnecessary metadata (junk) from JPG/JPEG/JFIF & PNG files.
    • Online Image Optimizer
      Lets you easily optimize your gifs, animated gifs, jpgs, and pngs, so they load as fast as possible on your site, by Dynamic Drive
    • SuperGIF
      Effortlessly make all your GIF images and animations smaller.
    • Here’s more.
  6. Handling CSS

    Modern websites uses CSS as the foundation of the style, as well as the look and feel. Not only CSS gives great flexibility to changes, it is also lesser in terms of codes needed. However, if they are badly coded, it could be a backfire. Here are some checklists, or rather guides to you make sure your CSS are properly optimized:

source: hongkiat.com


Share

Article related products

Save 50%
$49.90 $24.95