We at Excelgens work with various web development platforms and technologies. When we talk about web development then we cannot leave out WordPress which is one of the most widely used content management systems (CMS) by more than 60 million websites across the globe. Our team works extensively on the WordPress platform and have the expertise to build websites operating at scale.
Here, we want to share our experience in one of our projects with a client. This client operates in the media industry and came to us with the website which had loads of content and features but it was marred with many issues. Some of the primary concerns were slow page load speeds, the website use to crash as soon as the traffic increased a bit and the overall design language of the website.
We took a structured approach in resolving all issues faced by the client and we want to share the same with you so that you could plan your next website or optimize your existing high traffic site using some insights.
Choosing the right theme
We looked at the theme being used in the website and found that the existing design of the website was not utilizing the full functionality of the theme. Hence there was a lot of redundancy in the code. Our team then had a few brain storming sessions with the client to understand their requirement from a design perspective.
To get clarity on the design our team had a few brain storming sessions with the client so that we understood the client’s vision very clearly. For this we did the following tasks
- Asked client for reference sites which were closest to their vision
- Discussed their color and design preferences from an aesthetic and business point of view.
- Made the client to highlight the areas which were unacceptable in the current site and also the portion which they would like to maintain
After this interaction our team got together and built wireframes and photoshop images of the design so that the client had complete clarity on what will be delivered.
Once the client was happy with the design we then decided to develop the website using a custom theme. Some of the advantages of having a custom wordpress theme are given below.
- When we create a custom theme then we include only that functionality which is required unlike a premium wordpress theme in which they are trying to give you every feature that a user would want and thus resulting in the site slowing down.
- A custom theme is more customizable according to the business needs and easy to update as well. This also makes it more scalable whenever the need be and in our case this was an issue that was bothering the client a lot.
Another important aspect of purchasing a theme is the support. A good question to ask yourself is what kind of support I can expect when I paid $ 30 to $50. When you engage an IT company what you get is a dedicated resources and also who can provide you support on an ongoing basis. Yes there would be higher cost factor to be considered but then you should also consider the value that it will generate in the long run.
Number of plugins
When we first had a look at the WordPress backend of the existing site we saw that they were using 78 plugins. We were really surprised to see that kind of a number. When we digged a little deep we found that the previous development team had used a plugin for every small feature on the site. This is not a good practice at all as all it means that you end up using more plugins.
We made a matrix of the plugins and highlighted them into categories and the action to be taken for each category.
- Essential Plugins: These were the plugins which had to be used.
- Plugins not used: These were the plugins which were not being used at all.
- Plugins for which custom code could be created: These plugins were those for which our team could create custom code.
In our brainstorming sessions we found a couple of plugins which were using a lot of server
resources to execute. We used tools and plugins to analyze the server and database performance and also researched which queries were taking maximum time to execute.
- Multilingual Plugin: This plugin was using a lot of system resources. The solution that we opted for was having the main website in English and created subdomains for the other languages.
- History Plugin: This plugin was being used to maintain the history/log of most important events. As there were many users working on the admin panel generating content on a daily basis so this plugin was making the database size bigger each passing day.
We also removed the existing cache plugin which was causing issues and replaced it WP Fastest Cache.
We also identified the plugins for which we could create custom code so that we could further reduce the number of plugins being used in the website.
- Auto scroll plugin: This plugin was used to load content when the user scrolls down. We created custom functionality for the same.
- Ads plugin:
- Category post list
All the work that we put in helped us in reducing the number of plugins being used to almost half. Currently the website is using 25 plugins.
Correcting page load issues
While our development team was identifying and tackling the backend issues, our design team was working on the UI part of the site. As we were completely redesigning the website we had several detailed discussions with the client. Once we had clarity on the design we made sure that the UI was clean and organized and that the navigation of the website was intuitive. As the site had lot of content we made sure that we were not showing everything everywhere just for the sake of displaying the content.
We followed the best practices for implementing CSS and HTML. Some of the important pointers that we always follow in our projects are given below.
- Avoid using inline styles
- Using proper naming conventions
- Organizing the stylesheets
- Minifying CSS files
- Using comments properly
- Reduce DOM size so as to reduce TTFB, render time and memory usage
We used various tools to make sure that our page load speeds were optimum. We always use a few tools to make sure that we were on the right track. These tools are Google PageSpeed Insights, Gtmetrix and Pingdom.
Optimizing the images
Another important area where the site had issues was the use of unoptimized images. In today’s times images are used extensively in a website. Also the images used are clean and have good aesthetic value. This means that the size of the images will be bigger. Hence if a site is using a lot of images, like in case of our client’s website, it would definitely affect the page load speeds. Hence we make sure that we use optimized images in the sites.
- Used the Tiny Png plugin to optimize all the images and also advised the client to do the same whenever uploading images.
Using caching and CDN’s
Caching helps in improving the page load times by saving some of the static files on the user’s device for a specified period of time. The earlier cache plugin being used was not helping to improve the site performance. We tried different plugins and at last found to give us the best results.
Content Delivery Networks (CDN) help in delivering the site’s content from a server nearest to the user. Using caching along with CDN really helps in optimizing the site.
Value created for the client
It has now been around 3 years since we have been maintaining the website on a regular basis. Our team is in constant communication with the client to update the site and also to create new functionality and features in the website.
- The number of daily users on the site is around 45,000. This number was around 5000 monthly users when we had taken up the project. Inspite of this increase in traffic the site loading speeds have been optimal.
- The server resources being taken by the client has decreased inspite of the website growing in terms of the content and also the user-base.
- Site became much stable. In the past 3 years the site has not crashed even once.
- The page load speeds of the site have increased tremendously across devices.
- The admin and the backend section which is used by several users for updating content has also become much more responsive.
It has been a win-win situation for the client as well as our team. Our team was not only able to solve the existing issues of the client but was also able to implement the vision of the client in a way which has resulted in more user engagement and hence increased revenue generation.