Having your website to disfunction out of a sudden may look daunting! We had that experience with our website after updating wordpress and PHP’s database version.
Images were not proportionate, and they were not displaying in rows any more. The first course of action was to update the wordpress theme and plug ins.
After the update, the website was still not sorted. The layout issue was fine, but most of the images failed to upload.
Fixing a broken wordpress site
1. Clear browser cache.
In Google chrome, click on the three-dot menu in the top right corner. From the menu, you need to go to More Tools >> Clear Browsing Data. Open the site on a new window.
2. Download a word press caching plug in
After searching for caching plug ins, WP Fastest Cache came up on the search as 1 of the top 10, and we read excellent reviews.
It offers a free version, but in order to get the full features, you would need to buy the premium option which comes up to $49.
The settings panel seems to be easy to navigate. In the premium version there are many features, such as Minify Html, Minify Css, Enable Gzip Compression, Leverage Browser Caching, Add Expires Headers, Combine CSS, Combine JS, Disable Emoji.
After deleting the cache, we observed a resolution on uploading images, and that worked like magic with a push of a button in WP fastest cache plug in.
3. Image performance optimization.
The plug in offers image optimization as one of the features. According to HTP Archive, images make up on average 21% of total webpage´s weight. A good image optimization is one of the easiest things to implement.
- It will improve your page loading speed
- Combined with a great SEO wordpress plug in it improves your SEO. Your site will rank higher in search engine results.
- Creating backups will be faster.
- Smaller image file sizes use less bandwidth. Networks and browsers will appreciate this.
- Requires less storage space on your server.
4. Use a content delivery network (CDN) to speed up website load times.
For small local websites you would not need CDN. However, if your webiste is more global and with potential to grow, it may need implementing. CDN ensures that people all over the world get snappy load times and general responsiveness. However, there are other advantages of using CDN.
- Enhanced secuity. CDNs provide protections against deliberate Distributed Denial-of-Service (DDoS) attacks.
- They can save content providers money by preventing excessive use of expensive international bandwidth
As our websie hosting provider, IONOS, have CDN solutions, we used this service and tested the site performance anylizing the site using google tool PageSpeedInsights.
Core web vitals
Google announced Core Web Vitals in May 2020 to provide unified guidance for a website’s quality. Understanding Core Web Vitals helps ensure your website can offer the best user experience. Besides the aforementioned solutions, core web vitatls consist of multiple metrics representing how users interact with your website.
Go to PageSpeedInsight from Google, change the analysis to Mobile or Desktop to see the scores from each device.
Scroll down to see each metric’s exact scores. Here we have some metrics that need attention.
Currently, there are three Core Web Vitals: Largest Contentful Paint (loading performance), Cumulative Layout Shift (visual stability), and First Input Delay (interactivity).
According to Google, these metrics are the most important ones for providing a great user experience.
The LCP is the largest image to load in our website, and this is affecting user experience.
For example, if the tool detects a large image, it will suggest uploading it through the media library to avoid using full-sized photos. The table underneath shows the photos that can be optimized, and their potential savings.
We could sum up the fundamental ways to improve site performance as the following:
- Implement a Caching Solution. …
- Eliminate Render-Blocking Resources. …
- Defer Loading of JavaScript. …
- Use a Content Delivery Network. …
- Properly Size and Optimize Images. …
- Implement Lazy Loading. …
- Optimize Your Website Fonts. …
- Upgrade Your WordPress Hosting.
Leave a reply