Virgo Web Design Blog

5 Reasons Website Page Load May be Slow – Optimizing Site Performance

5 Reasons Website Page Load May be Slow – Optimizing Site Performance

Having an exciting, interactive website is important to stand out in today’s crowded internet market. However, far too often there are simple mistakes that result in slow page load times and a frustrating user experience; especially when you start adding on all the bells and whistles to your website. Not only will fixing these issues likely improve your bounce rates, it will also help with your SEO strategy. Ideally you will want to have a page load time of around 2 seconds or less, so if you notice your page is taking longer than that, you may be running into one of these 5 issues!

Unfortunately, some developers and companies (even large ones) just don’t care about following web development best practices, and decide that throwing massive amounts of hardware at their website will solve their problems. This may be a fix, even a potentially long-term one, but often this causes problems later on since the underlying issues are not addressed. Keep in mind that this is a list of common issues that occur, and if you are experiencing slow page loads it could be a number of other causes.

JavaScript Issues

The popularity of javascript/jQuery plugins has given easy access to a wide variety of dynamic features to websites. Third party javascript APIs have also become common, such as social media buttons and access to Google’s developer APIs (such as Google Maps).

When implemented incorrectly, these scripts can seriously impact page load time. There are many things that can go wrong, but here are some of the top ones:

  • Loading multiple versions of jQuery – often content management systems have 3rd party applications that will have an option of loading jQuery. This can be problematic if you enable that feature on multiple applications. Additionally, some developers may be lazy and do a test upgrade of jQuery and realize it breaks some of their scripts, so as a workaround they implement a second or even third version on the site.
  • 3rd Party APIs out of control – sometimes you may have an older, unsupported API implemented, or the API simply no longer exists. Often this can lead to browsers spending time waiting for a response before realizing that there is none. Loading too many APIs on your website can also cause a slower load time; remember, these APIs have to wait for requests from other services, so you lose some control of response time. There are also many poorly written APIs out there, so it’s best to only use ones from reputed companies (although there are no guarantees there either).
  • Poorly written javascript – if used improperly, javascript can cripple your website page load time. Unfortunately, you won’t always see errors on the page, but you could always start with checking your browser’s console and look for error logs.
  • Not following Best Practices – Some of the best practices of javascript won’t really effect page load time that much, but they still should be followed anyways. Probably the most important ones are deferring your javascript so it loads last, combining your javascript into one file, and avoiding inline javascript as much as possible.

Image Handling

I see this all the time – websites that have every file saved as a .PNG, images that are uncompressed, or images that are uploaded at larger sizes then scaled down to fit the page.

Here’s a summary of how image formats work:

  • JPEG (.JPG or .JPEG): best used for more complex images with lots of colors, such as digital photography, stock images, etc.
  • PNG (.PNG): best used for complex images with lots of colors that have a transparent background.
  • GIF (.GIF): best used for animated images or small icons that aren’t very complex. These images may also have a transparent background.
  • SVG (.SVG): this image format is becoming more common, and is suited for scalable vector graphics. These are usually used for icons that look good at any resolution.

Choosing the wrong formats or having larger than necessary images can delay page load times quite a bit. There are a few easy ways to fix these issues.

If you have a bunch of images saved in the wrong format, you can take the whole folder and run it through Adobe Photoshop’s automated image processor script (file > scripts > image processor).

The most common image type is JPEG, and often I need to compress images from an entire website. In this case, I use JPEGmini, which only costs $20 and is well worth the cash. You can download a server’s entire image folder, drop it into JPEGmini, and watch it compress all your images! It does an excellent job of compressing your images while still maintaining quality – even better than Photoshop’s save for web feature.

Excessive HTTP Requests

Having too many javascript, CSS, and image files can lead to too many HTTP requests; when a browser hits your website, it performs a separate request for each of these files. By combining these files into large ones, this reduces the number of requests made, significantly reducing page load times.

Content management systems have some excellent solutions for this, which will combine, compress, and minify your CSS and javascript files. Most of the time there will be a script file that won’t cooperate with this optimization process, so there’s usually some debugging required.  

As for having too many images, icons that are used can be bundled into a larger sprite image, and be set individually with background position in CSS. There’s also CSS toolkits like Font Awesome, which have a huge collection of icons that are vector based. If you’re using a content management system with a template, you may already have a CSS toolkit implemented.

Not Using Server Optimization – Handlers, Caching and Gzipping

There are a wide variety of free options available for server-side caching, both on your web server and applications that run on your web server. Since I specialize in development on LAMP environments (Linux, Apache, MySQL, and PHP), I’ll be covering optimizations on those platforms.

To fully control your website’s server-side caching, you’ll likely need a virtual private server (VPS), or a dedicated server. Most shared hosts will already have a somewhat adequate Apache configuration and PHP handler setup, but you’ll get massive page load improvements from being able to control the configurations. Every environment is different, so it’s hard to determine which caching solution is best for you. Some of the ones I would recommend are Memcached, Alternative PHP Cache (APC), and XCache.

Another change that will reduce the overall size of content sent to browsers is enabling Apache compression, which is especially simple for cPanel users. Simply go to the Software/Services tab, and click on the Optimize Website icon. Set it to compress your content, and update – that’s it! Content management system users also have the option of enabling gzipping, which pretty much does the same thing.   

This isn’t exactly server side, but leveraging browser caching is an important step to improve page load times for return visitors. This can be a simple change by adding ETag and Cache-Control information into your htaccess file.

Using Shared Web Hosting

Shared hosting is immensely popular with small businesses because of the low cost associated. They may be adequate for websites that aren’t too dynamic, and don’t have too much incoming traffic. The reason shared hosting often performs poorly is because you never know how many websites are being shared on the same server – and it’s very likely that server resources are stretched very thin. There are plenty of tools available to test your server response time (one of the key indicators for server performance), such as Google Page Insights or Pingdom Tools. Most shared hosts will respond in around 1-2 seconds or more, depending on configuration and how much traffic the website gets. Unfortunately, this is in addition to the time it takes to make all the requests and download all the files.

From my experience, a properly configured website will usually average 3-6 second page loads on a shared host. I’ve used Godaddy, HostGator, and WebHostingPad for shared hosting in the past, and have had mixed experiences. Godaddy has excellent support, but their shared hosting accounts don’t perform well with 3,000+ hits/month. HostGator is by far the worst, I’ve used them for shared and VPS servers; they have horrible support, and website performance is average. WebHostingPad I recommend to customers to just want really cheap hosting – and that’s exactly what it is. At $1.99 a month, they are very cheap and actually have pretty good customer service. Performance is slightly lower than others, but not bad for the low cost.

If you’re running a resource intensive website (such as e-commerce or user registration and interactivity) or have heavy traffic, you’re likely going to want to purchase either a virtual private server (VPS) or dedicated hosting plan. By doing so, you have many more resources available to your website, as well as more control for server-side optimization. Of course, these solutions will cost you more, but if your sales could decline from a poor user experience, then it is well worth the investment. Unfortunately, all of the cheaper VPS or dedicated hosting solutions are usually unmanaged, so if you’re looking for support then you’re out of luck. If you don’t know much about server administration, I highly recommend getting a managed hosting service. VPS hosting is usually a good choice for small businesses. They can be very powerful, but still be cost effective if you shop around enough. I’ve used Linode and Atlantic.Net for unmanaged VPS hosting, and found them both to be good choices (although Atlantic.net has better pricing).

A decent VPS or Dedicated website will usually respond rather quickly. Ideally, you want to come in at about .2 seconds (200 milliseconds), which is about what you can expect to get from these options. Additionally, you can setup multiple websites on these servers, so if you are already paying for multiple shared hosting accounts it may be a good idea to consolidate them onto one VPS host.

10 Great Web Design Trends of 2014
What is the difference between Adaptive vs. Respon...
 

Comments

No comments made yet. Be the first to submit a comment
Guest
Wednesday, 18 September 2019

LATEST ON OUR BLOG

OUR YELP REVIEWS

  • Virgo Web Design recently completed my website MeetPeopleChicago.com. Jerry was easy to work with, was attentive to my questions and was on top of things from start to finish. In addition he was very knowledgable and up to date on the latest technologies. I am very pleased with the final product and I will surely use him again for future enhancements. Thank you Jerry for the great work you have done!

    PETER S.

    Meet People Chicago

  • As a marketing communications person who knew my company needed an up-to-date website built in Joomla, I was very happy we found [Virgo Web Design]. I understood things from a content perspective, but when it came to back-end design and architecture, my hands were tied. [Virgo Web Design] was so knowledgeable and easy to work with, and was always available to answer questions, make tweaks, walk me through front-end editing tasks...you name it. [Virgo Web Design]'s accessibility and can-do attitude made such a difference to our entire team, and I hope I always thanked [them] enough for helping me through the client-side part of the web redesign process.

    CORRIE M.

    Aptude

  • "[Virgo Web Design] did an amazing job on my non-profit's website, ghhaven.org. [They] put our site together quickly and with all of the elements we requested - plus, [they] had a lot of great recommendations for things that we hadn't even considered for the site. [They were] very helpful throughout the process of getting our site launched and I found [them] to be quick in responding to all of my questions/requests as well. [They] even helped us get our business emails set up!

    I would definitely recommend Virgo Web Design as a go-to for all of your web design/development needs. I will definitely be using [them] again in the near future!"

    FRITZIE S.

    Genesis Hopeful Haven

  • [Virgo Web Design] has developed and designed multiple websites for me over the years. [Their] team are exceptionally skilled technicians. Their communication is easy to understand, and they are very proficient - even when near-end deadlines are demanding. Hiring Jerry Virgo and his team is one of the best decisions I have made for my company.

    Michael W

    One Chicago Realty

  • I've used Yahoo sitebuilder for several years and my e-commerce website was due for an overhaul. I asked around & received several recommendations from friends & other small businesses.

    Many of the other referrals came from Web design firms & had significantly higher overheads/billing rates...We had a tight timeline & [they were] very diligent at following up to avoid production delays at time when I was extremely busy. [They] did a nice all around job improving my SEO optimization, creating a polished final product, and documenting the back end with an easy to use manual.

    After the site when live, [they] stood by & helped me troubleshoot unanticipated events & helped me create work arounds.

    Chris H.

    City Tree Delivery

  • [Virgo Web Design] knocked out a full rebuild of our site in a few weeks, guided us through things we didn't understand with ease and calm and gave great advice, training and follow up service

    Nicholle D.

    DANK Haus

5000 characters left

LATEST ON OUR BLOG

OUR YELP REVIEWS

  • Virgo Web Design recently completed my website MeetPeopleChicago.com. Jerry was easy to work with, was attentive to my questions and was on top of things from start to finish. In addition he was very knowledgable and up to date on the latest technologies. I am very pleased with the final product and I will surely use him again for future enhancements. Thank you Jerry for the great work you have done!

    PETER S.

    Meet People Chicago

  • As a marketing communications person who knew my company needed an up-to-date website built in Joomla, I was very happy we found [Virgo Web Design]. I understood things from a content perspective, but when it came to back-end design and architecture, my hands were tied. [Virgo Web Design] was so knowledgeable and easy to work with, and was always available to answer questions, make tweaks, walk me through front-end editing tasks...you name it. [Virgo Web Design]'s accessibility and can-do attitude made such a difference to our entire team, and I hope I always thanked [them] enough for helping me through the client-side part of the web redesign process.

    CORRIE M.

    Aptude

  • "[Virgo Web Design] did an amazing job on my non-profit's website, ghhaven.org. [They] put our site together quickly and with all of the elements we requested - plus, [they] had a lot of great recommendations for things that we hadn't even considered for the site. [They were] very helpful throughout the process of getting our site launched and I found [them] to be quick in responding to all of my questions/requests as well. [They] even helped us get our business emails set up!

    I would definitely recommend Virgo Web Design as a go-to for all of your web design/development needs. I will definitely be using [them] again in the near future!"

    FRITZIE S.

    Genesis Hopeful Haven

  • [Virgo Web Design] has developed and designed multiple websites for me over the years. [Their] team are exceptionally skilled technicians. Their communication is easy to understand, and they are very proficient - even when near-end deadlines are demanding. Hiring Jerry Virgo and his team is one of the best decisions I have made for my company.

    Michael W

    One Chicago Realty

  • I've used Yahoo sitebuilder for several years and my e-commerce website was due for an overhaul. I asked around & received several recommendations from friends & other small businesses.

    Many of the other referrals came from Web design firms & had significantly higher overheads/billing rates...We had a tight timeline & [they were] very diligent at following up to avoid production delays at time when I was extremely busy. [They] did a nice all around job improving my SEO optimization, creating a polished final product, and documenting the back end with an easy to use manual.

    After the site when live, [they] stood by & helped me troubleshoot unanticipated events & helped me create work arounds.

    Chris H.

    City Tree Delivery

  • [Virgo Web Design] knocked out a full rebuild of our site in a few weeks, guided us through things we didn't understand with ease and calm and gave great advice, training and follow up service

    Nicholle D.

    DANK Haus

Contact

  • Phone:
    (224)388-0250
  • E-Mail:
    This email address is being protected from spambots. You need JavaScript enabled to view it.

SUBSCRIBE TO OUR NEWSLETTER

© Copyright Virgo Web Design. All right reserved.

Signup for our newsletter!