Check Image Sizes and Quality

An image will appear blurry if it’s too small for the space it’s displayed in. While there’s no single recommended image size, you can refer to our image optimization guide to learn how to ensure an image is large enough to display in good quality on your website without being too large that it slows down your site’s speed.

If your images appear blurry, start by uploading a high-quality, larger image file and check if it looks better.

If uploading a larger, clearer image still doesn’t improve the appearance of the images on the live site, it might be one of the other issues listed below.

Check Your Internet Speed

If your internet connection is extremely slow, the images could be downloaded at a lower quality, causing them to appear blurry. Try loading your website with a different, faster connection to check if the images look better that way.

Try deactivating Imagify or Jetpack

Imagify and Jetpack both change the way images are loaded and depending on your settings they may load the lowest resolution image first, which will be the thumbnail image.

As a first step I would deactivate these and see if the image is clearer, or go into the settings and reduce the level of compression.

Theme Changes

We take measures to provide a seamless experience with your images when switching from one WordPress.com theme to another. However, some third-party themes don’t have similar measures, which can affect your images when you switch to or from these themes.

If you’ve recently switched your site’s theme and noticed that all images uploaded on the new theme look good, but the older ones uploaded on the previous theme appear blurry, you can re-upload the older images on the new theme to get them to display correctly.

If you’re working on a plugin-enabled site, you can regenerate the blurry thumbnails using an image regeneration plugin or, if you are a developer, using WP-CLI. With these methods, you don’t have to manually upload all your older images again.

Plugin Conflicts

Occasionally, installing a new plugin on your site might cause your images to appear blurry. Updating an existing plugin can also introduce conflicts that may affect your images.

Try deactivating the plugin to see if the image quality improves. You may also need to restore a backup from before you installed the plugin to return the images to their previous state.

For detailed instructions on troubleshooting plugin conflicts, refer to our guide on solving problems with plugins.

Check server config

If your staging site is using a different version of php or using Nginx instead of apache this could be causing the issue. It’s not likely, but it’s possible.

Watch out for HTML rules that display images in sizes

When nothing else works, check the rules of the markup that are resizing the images. In this client’s case, they had a rule after the image src which said -300×150 which is displaying the image in a smaller size. By removing this from the file path, the image is displaying correctly.

Jane James is the founder of Alpha Omega Digital, and is a WordPress web developer based in Melbourne, Australia but also services clients from Sydney, Brisbane, Newcastle, Perth, Adelaide, Darwin and Hobart. Have a project in mind? Contact me here.

The post Fix it: blurry images on Worpress appeared first on Freelance Wordpress developer Melbourne | Sydney | Gold Coast | Brisbane |.

Studies have shown that 47% of users expect pages to load in two seconds or less. Also, they found that 40% of users will abandon a website completely if it’s taking 3 seconds or more.

It’s not just users, Google also uses page speed as a ranking factor when deciding which order to place websites in the search results. Slower pages equate to worse rankings.

Take a moment to test your website using this tool – https://tools.pingdom.com/

Run two tests, one on your homepage and another on an inner page. I recommend two tests because the homepage is usually the most complex page on any website and not a good representation of the website as a whole.

For media-heavy pages which feature a lot of images or video, your target should be 2 seconds and below. For pages that are mostly text (like this one) you should be looking for closer to 1 second.

If you are falling short of those targets then the information below is going to be very valuable to you. On the other hand if you already have a fast website you might still benefit from the information – a study for Walmart found that for every 100 ms of improvement, they grew incremental revenue by up to 1%.

• A Different Approach
  • A Helping Hand
• How To Speed Up WordPress
• High Impact
  • Update PHP
  • Use High-Performance Hosting
  • Limit Third-Party Scripts
  • Audit Your Plugins
• Medium Impact
  • Implement Static Caching
  • Use a CDN (Content Delivery Network)
  • Optimize Images
  • Lazy Load Images
  • Optimize Font Performance
  • Combine HTTP Requests
• Low Impact
  • Enable GZIP Compression
  • Minify Assets
  • Clean The Database
  • Remove Query Strings
  • Disable Embeds
  • Disable Emoji
  • Host Gravatars Locally
  • Disable or Limit Post Revisions
  • Delete Old Post Revisions
  • Use Resource Hints (Prefetch)
  • Audit Your WordPress Theme
• Little or No Impact
  • Update WordPress
  • Disable XML-RPC
  • Remove WordPress Version Meta Tag
  • Remove wlwmanifest link
  • Remove RSD link
  • Remove WordPress Shortlink
  • Disable RSS feed
• Conclusion

A Different Approach

Most lists on “how to speed up your website” are effectively a collection of twenty-plus best practices thrown together with no consideration given to a) the work required to implement the recommendations, or b) the impact of each recommendation.

The problem is that without any context on the amount of effort required and the potential impact you can’t make an education decision on which recommendations to prioritize. You could spend hours implementing a recommendation that increases speed by 1% while ignoring another that could have been done in less time and have a much larger impact.

That’s why I’ve taken a different approach in this guide. Recommendations are first organised by impact, then difficulty.

High and Medium Impact recommendations will give the biggest bang for your buck and that’s where you should start. Only once those recommendations have been explored should you consider the Low Impact items.

A Helping Hand

There are two premium plugins which you can use to automatically implement 80% of the recommendations, potentially saving you hours of work. They are not strictly required to implement any of the below, but they will save you a lot of time compared to the modest cost.

1. WP Rocket is a caching plugin, but unlike most of it’s competitors it doesn’t require a ton of set up and configuration to reap the benefits. In fact WP Rocket reports that you will get 80% of the optimization just by enabling the plugin, without any configuration.

WP Rocket is the only cache plugin which integrates more than 80% of web performance best practices even without any options activated. 

2. Perfmatters is a lightweight performance plugin that enables you to implement 20+ performance optimizations in just a couple of clicks. As you will discover in this guide, it’s possible to achieve the same outcome by piecing together free plugins. But for a low cost ($25) you can have one plugin handle everything, and have the peace of mind that the plugin is backed by an experienced development team with a focus on optimization.

How To Speed Up WordPress

I’ve grouped the recommendations by impact (high, medium, low and none) and then ordered each group by difficulty. As you will see there are only a few things you can do that will have a high impact and most of them are difficult to implement. While that may not be encouraging to hear, it does reflect the honest reality of website performance which many other guides choose to omit.

Table Of Contents

hide

High Impact

Update PHP

Keeping your PHP version up to date is important for security and the smooth operation of your website. It also brings substantial performance improvements – roughly speaking PHP 7 is twice as fast as its predecessor PHP 5.6. That doesn’t mean your website will be twice as fast if you upgrade from PHP 5.6 to 7 as there are other factors at play, but it should make a considerable difference.

A Different Approach

Most lists on “how to speed up your website” are effectively a collection of twenty-plus best practices thrown together with no consideration given to a) the work required to implement the recommendations, or b) the impact of each recommendation.

The problem is that without any context on the amount of effort required and the potential impact you can’t make an education decision on which recommendations to prioritize. You could spend hours implementing a recommendation that increases speed by 1% while ignoring another that could have been done in less time and have a much larger impact.

That’s why I’ve taken a different approach in this guide. Recommendations are first organised by impact, then difficulty.

High and Medium Impact recommendations will give the biggest bang for your buck and that’s where you should start. Only once those recommendations have been explored should you consider the Low Impact items.

A Helping Hand

There are two premium plugins which you can use to automatically implement 80% of the recommendations, potentially saving you hours of work. They are not strictly required to implement any of the below, but they will save you a lot of time compared to the modest cost.

One thing to be wary of is that PHP upgrades can include “breaking changes”, which means that if your theme or plugins contain code that hasn’t been tested with the latest versions it can cause problems.

Don’t let that dissuade you from upgrading to a modern version of PHP, the security and performance benefits are too great. Instead, research what options your host offers to mitigate the risk. Nowadays most hosts offer staging environments which allow you to test any changes safely. Also, since version 5.2 WordPress has also included Fatal Error Protection to reduce the risk of code errors bringing down your site.

Use High-Performance Hosting

Your choice of host will have a bigger impact on your site speed than 90% of items on this list.

If your hosting server takes an extra second longer to load your page than an alternative would, then there is no way you can overcome that with any of the recommendations below.

Unfortunately it’s also one of the hardest things to change. Many people are technically or contractually tied to their existing host. Some hosts (including Kinsta) offer a free migration service to help ease the technical difficulty of changing hosts.

In hosting you get what you pay for. Managed hosts (Kinsta, WPEngine, Pantheon) are more expensive but usually faster than the low-cost shared hosts (Siteground, Bluehost, Hostgator). I personally recommend Kinsta and Siteground to all my clients as in my experience they are the best in their respective price points, both in performance and support.

Limit Third-Party Scripts

A third-party script is one which connects to an external website or service and then executes code on your website. Google Adsense is a popular example.

The problem with third-party scripts is that your page speed is at the mercy of the provider. If they are taking three seconds to complete the request then your page will take three seconds longer to load.

There are ways to reduce the impact that third-party scripts have on your website. However, many third-parties, especially advertising networks, are very explicit in how they want you to implement their code. They tell you exactly where it must be placed and which code should load before or after it, which severely limits the steps you can take to reduce the performance impact.

Rather than trying to optimize the scripts, it’s more productive to check if you need them at all. It’s not uncommon to have lingering scripts that you are not using but haven’t removed yet. Common examples include:

• Tracking Scripts
• Advertising Scripts
• Social Network Embeds

At the start of this guide I told you to test your using perform a speed test, if you scroll down on the results page you will see a table detailing all the requests your page made. You can order the table by Load Time (descending) to see which requests are taking the longest. By identifying which requests are taking the longest you can audit whether they are required at all. If they are then speak to the provider to see if there is any way to optimize the delivery.

Audit Your Plugins

Most WordPress plugins are not built with performance in mind. Instead they are built and marketed around adding features and functionality to your website. Performance is a secondary consideration at best.

This means that for maximum performance you need to carefully audit each plugin you add to your website and assess the impact it is having.

• Is it adding third-party requests to the frontend?
• Does the frontend seem slower when it’s activated?
• Does wp-admin seem slower when it’s activated?

Unfortunately in WordPress there isn’t an easy way to see which plugins are slowing your site down. There are tools than can help but they are most for professional users, Debug Bar and New Relic are two examples.

A non-technical way to assess the impact of each plugin is to disable all plugins, perform a speed test and then re-activate them one at a time, making a note of the performance each time.

Medium Impact

Implement Static Caching

There are two main types of caching: browser caching and static caching.

Browser caching is mostly handled by the browser and fairly optimized, so we worry about that for now.

Static caching on the other hand can result in huge performance gains when implemented properly. That’s what we will be focusing on.

Some background: WordPress builds your pages from a combination of template files (header, footer, etc.) and content from the database (post content, menus, comments, widgets, and so on). This process is called “dynamically generating” the page and is repeated for each pageview. On the server level it’s an expensive process, that’s why when you ask the server to do it hundreds of times at once (a traffic spike) your website can crash.

A more optimized solution is to build the page once, store it in an efficient format (static HTML) and then serve that file to every visitor, instead of dynamically generating the page each time. On a basic level that’s an explanation of what static caching is.

Static caching has two benefits. The first is that it makes your pages quicker to load as there is less work for the server to do. The second benefit is that because the server isn’t working as hard it can serve more visitors at once. That means with static caching your website is both faster and better equipped to handle high traffic events.

Adding a static cache to your website is as simple as enabling a plugin. I recommend either Cache Enabler (free) or WP Rocket (Premium). Some hosts also offer their own solutions – Siteground has a plugin and Kinsta features a built-in caching-system.

Use a CDN (Content Delivery Network)

Like caching, CDNs can cause confusion because there are different solutions using the same name. One feature all CDNs share is that they have servers scattered across the globe which they can distribute your content from. In comparison your website is likely hosted on one server in one place (example: San Francisco, USA).

The Cloudflare network spans over 200 cities in more than 100 countries.

Proximity matters when measuring page speed, if a user is located in Europe but your server is in the USA, then it will take longer to load that page than if the same user was in the USA (all else being equal).

Traditional CDNs make a copy of your static files (images, CSS and Javascript) and place them on their distributed servers. You then configure your website to serve the files from the CDN instead of your server, most of this is done automatically by plugins. KeyCDN and Jetpack Site Accelerator are examples of traditional CDNs.

Reverse Proxy CDNs offer much more than just the hosting of your static files. They also provide security by acting as a guard between your website and potential attackers. By checking traffic before it hits your server they are able to eliminate a lot of bot and malicious traffic. Cloudflare is the most well-known example of a reverse proxy CDN.

Cloudflare’s 51 Tbps network blocks an average of 72 billion threats per day, including some of the largest DDoS attacks in history.

Unless your host has a CDN built-in (like Kinsta does) then your best bet is to use Cloudflare. It’s completely free and the set up is fairly simple. You just need access to your domain registrar account to change the nameservers.

Optimize Images

Images imported from cameras, mobile phones and stock photography websites are often super high quality and multiple MBs in size, which is big in website terms. However, in most cases they can be compressed to less than 30% of their original size without any noticeable loss in quality.

There are two ways to optimize your images. The first option is to use an online tool such as tinypng.com to optimize images individually before you upload them to WordPress. The second option is to use an image optimization service which performs the optimization automatically whenever you upload an image to WordPress.

An added benefit of the second approach is that you can also optimize all your pre-existing images with the click of a button. If you are going to go down this route I suggest looking into ShortPixel. They are free for up to 100 images per month and their paid plans start at just $5/month for 5000 images.

Lazy Load Images

Images are usually the heaviest elements (in KBs) on a page. Especially if you use a lot of them. Lazy loading is the process of not loading images until they are on or near the visible part of the screen.

Lazy loading has proven to be a worthwhile strategy for improving performance, so much so that browser companies are now beginning to implement the functionality directly into the browser.

Lazy loading images is as simple as installing a plugin, or if you are using either WP Rocket or Perfmatters plugin it’s the flip of a switch as both plugins include the functionality.

Optimize Font Performance

Fonts are an example of a third-party request, a topic we’ve already explored. However, they are a particularly big request, especially when used incorrectly, and require a different method of optimization. So I’m covering them separately.

In the past I’ve wrote extensively on how to optimize Google Fonts performance. Here’s the short version:

1. Remove unnecessary font requests using this plugin – https://wordpress.org/plugins/disable-remove-google-fonts/
2. If you are going to use Google Fonts then add them using Fonts Plugin as it’s built with performance in mind.
3. Remove font variants that won’t be used using Selective Font Loading.
4. Host the fonts locally so you are not reliant on Google’s third-party server.

Combine HTTP Requests

Most web pages have at least 10+ HTTP requests comprising of three main types: CSS, Javascript and images.

In the past it was the case that the browser could only process a limited amount of requests at once and the rest would wait in a queue. This limitation meant that the number of requests was causing a bottleneck, not just the size of each request.

Request size does directly affect load time but combining HTTP requests isn’t related to that so we won’t be exploring it here.

This led to an optimization technique called “combining requests”, where you would combine all of the .css/.js files into one (bigger) .css/.js file and reference that in the code instead. Additionally, the combining process could be easily automated using a plugin.

Nowadays most websites and servers support a protocol called HTTP/2 which doesn’t limit simultaneous requests and can instead process them all at once. This mostly negates the need for combining requests. A better solution is to work on removing unnecessary requests entirely and minimizing the size of the remaining requests.

Low Impact

Enable GZIP Compression

GZIP is an effective form of compression that happens on the server-level. 50%+ reductions in size are not uncommon when enabling GZIP. The great news is that most hosts enable GZIP by default. Even if you are on cheaper shared hosting, there are usually simple ways to enable GZIP compression, ask your host about this.

Minify Assets

HTML, CSS and Javascript files use blank spaces and comments in the source code to improve readability for developers. Basic minification simply removes these extraneous elements to reduce the file size. As a general guide you can expect between a 10-50% reduction in file size. But unlike images, these files are not usually big to begin with, so the improvement is not as pronounced.

WP Rocket supports HTML, CSS and Javascript minification.

Clean The Database

Some plugins interact with the database at all, but many do. Generally speaking, the more complex a plugin is, the more interaction it has with the database. WooCommerce for example stores a lot of information in the database and has its own table.

The more data that is stored in a database the bigger it becomes in size. The bigger the database is, the longer each interaction (query) with it takes. Large databases and complex queries can easily add multiple seconds to your page load time.

As your website grows and there is more data to store it’s inevitable that the database will grow, but what we don’t want to do is fill it with unused, unnecessary or expired data.

Here are some examples of data that can increase the database size without providing any benefit:

• Spam Comments
• Old Post Revisions
• Plugin Logs

The best plugin I’ve found for cleaning your database is Advanced DB Cleaner (free). It allows you to perform the basic cleaning tasks in a click and also explains each option so you can understand what is happening under the hood.

Another useful feature is that the plugin displays the size of each database table so you can see if any are spiralling out of control.

Remove Query Strings

Browsers cache CSS and Javascript files as its quicker to load them from the local cache than it is to retrieve them from an external server each time.

The problem is that if the original file on the server changes there is no way for the browser to know and it will keep using the out of date version from the cache (until the cache is cleared or expires).

Query Strings solve this problem by appending a version number to the end of the file, like this:

style.css?ver=2.2.1

When the code updates, the version number increments and the browser knows that using the version from the cache will no longer be valid.

This creates a new problem. Some CDNs are unable to cache files with query strings – thats why most speed test tools recommend you remove them.

Removing query strings from static resources is as simple as installing a plugin, or if you are using the Perfmatters plugin it’s the flip of a switch.

Disable Embeds

WordPress includes a small script on each page that automatically embeds supported content when you paste a link to it. An example of this would be Tweets or Facebook posts. The script is named wp-embed.min.js and while it’s small, if your website doesn’t utilize embeds then there is no need for the extra HTTP request.

Disabling embeds is as simple as installing a plugin, or if you are using the Perfmatters plugin it’s the flip of a switch.

Disable Emoji

WordPress includes a small script on each page that increases the compatability of emoji. The script is wp-emoji-release.min.js and while it’s small it’s still unnecessary for most websites as they don’t use emoji.

Disabling emoji is as simple as installing a plugin, or if you are using the Perfmatters plugin it’s the flip of a switch.

Host Gravatars Locally

Gravatar is the service that WordPress uses to display personalized author and commentator avatars. Without Gravatar avatars would be impersonal place holders.

Gravatars are implemented in an optimized way by default, the images themselves are compressed and they use DNS prefetching.

Gravatar can add a lot of external HTTP requests to your page. For example if your page has 100 comments then that is 100 requests to the Gravatar API to retrieve them.

Ultimately it is up to you to decide wether it’s worth the performance cost to show user avatars instead of placeholders. To disable Gravatars you can use a plugin, or to potentially achieve the best of both worlds you can lazy load the avatars using the Perfmatters plugin.

Disable or Limit Post Revisions

Post revisions are an excellent feature of WordPress. Each time you update a post or page, the previous version is saved as a backup. By default there is no limit to the number of saved revisions a post can have.

It’s not unusual for a post to have 10+ revisions. Now imagine if you had 200 posts, that’s 2000+ revisions in the database. Post Revisions aren’t free, they come at the cost of increased database size, which can ultimately slow down your website.

A better solution is to place a sane limit on revisions, 3 is a good starting point. WordPress will then only keep the 3 most recent revisions and automatically delete older ones.

To limit Post Revisions you can use a plugin, or use the Perfmatters plugin.

Delete Old Post Revisions

When you lower the limit on post revisions, WordPress won’t automatically remove the existing revisions that exceed this limit. Instead you will need to use the tools I shared in the Clean The Database section to remove those.

Use Resource Hints (Prefetch) 

HTTP requests are broken up into different stages. The first stage is for the browser to figure out where to retrieve the data from so it can connect to the external server, that’s called a DNS Lookup.

DNS Lookups are performed when the browser is ready to start the HTTP request. As we can see from waterfall graphs browsers don’t load everything at once, instead they load different parts sequentially.

Modern browsers support an optimization called ‘DNS Prefetching’ where instead of performing the lookup as the requests starts, you can preemptively perform all the Lookups as soon as the page begins to load. Initiating them right away (and all at once) means the browser doesn’t have to wait when it reaches that part of the process.

DNS Lookups don’t take a long time, usually between 0 and 100ms, so this optimization won’t have a massive effect, but it has no downsides so it’s worthwhile to do.

Some examples of resources you can prefetch:

• Tracking & Analytics
• Custom Fonts
• Advertisements
• Gravatars
• CDNs

Ideally the plugins responsible for the items above should handle the resource hints for you. In Fonts Plugin we add a DNS-Preconnect for fonts.gstatic.com and WordPress adds a DNS-Prefetch for gravatar.com. It is possible to implement your own resource hints using Perfmatters, but it’s highly-technical so I would avoid doing that unless strictly necessary.

DNS Lookups can be cached. If the browsers has already connected to a resource, Google Analytics for example, then a DNS Lookup will not be required next time the browser connects to the same resource, even on different websites.

Audit Your WordPress Theme

WordPress themes generally focus on the appearance of a website whereas plugins focus on functionality. As such there isn’t as much scope for damaging website performance. Although there are two exceptions:

1. Badly written themes

It’s hard to know if a theme is “badly written” without a full code review. Choosing themes from the wordpress.org/themes directory is a smart move as they have high standards for inclusion. Well-established theme providers like ThemeIsle, WPZoom and ThemeKingdom can also be relied on.

2. Themes that include a lot of Javascript

Interactive features like sliders, loading screens and scrolling effects are built using Javascript. While there is nothing inherently bad about JS, when implemented carelessly it can be heavily detrimental to your page speed.

If you think your theme might be problematic, temporarily enable one of the default themes and see if your page speed improves. The default themes are very minimalist in code and features so provide a good baseline.

Little or No Impact

Update WordPress

While it’s a good practice to keep WordPress up to date, there are not usually significant performance improvements between releases.

• Updating WordPress

Disable XML-RPC

XML-RPC is a mechanism that facilitates the connection between applications and WordPress. Mobile writing apps that can publish directly to your website are an example of a tool that uses this connection.

In more recent times the WordPress REST API has been favored for this use-case. However the XML-RPC protocol still exists for legacy reasons.

There is nothing inherently wrong with XML-RPC from a performance or security standpoint. However, it does leave the door open to potential DDOS attacks. If you are not using any tools or services that require it then it makes sense to disable it.

Disabling XML-RPC is as simple as installing a plugin, or if you are using the Perfmatters plugin it’s the flip of a switch. Some hosts (like Kinsta) also disable XML-RPC by default.

Note: The Jetpack plugin uses XML-RPC so you may need to keep it enabled if you are using that plugin.

Remove WordPress Version Meta Tag

In the source code of your website WordPress outputs a line of code denoting the version you are using, it looks like this:

<meta name="generator" content="WordPress 4.9.15" />

Some people consider this a security risk, as it makes it very easy for malicious users to identify websites running insecure version of WordPress, so you might want to remove the tag on that basis. But removing it won’t have any positive effect on page speed.

Remove wlwmanifest link

The wlwmanifest link is a meta tag that tells the Windows Live Writer software how to interact with WordPress. It looks like this:

<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://fontsplugin.com/wp-includes/wlwmanifest.xml" />

If you don’t use Windows Live Writer this meta tag is useless, but there isn’t any benefit in removing it from a performance standpoint either.

Removing the wlwmanifest link is as simple as flipping the switch in Perfmatters:

Remove RSD link

The RSD (Really Simple Discovery) link is another WordPress feature that is added by default but very few people use.

<link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://outstandingsetup.com/xmlrpc.php?rsd" />

Removing it will not improve performance but if you want to do it anyway it’s super easy using a plugin or Perfmatters.

Remove WordPress Shortlink

By default WordPress creates a shortlink for every page on your website which redirects to the full URL. For example this page is https://fontsplugin.com/speed-up-wordpress but you could also use https://fontsplugin.com/?p=9586 to access it instead.

WordPress references the shortlink in the source code of your website like this:

<link rel='shortlink' href='https://fontsplugin.com/?p=9586' />

Removing the shortlink reference from the source code of your website will not improve performance but if you want to do it anyway it’s super easy using a plugin or Perfmatters.

Disable RSS feed

Every WordPress website has a built-in RSS feed at /feed, ours is https://fontsplugin.com/feed

RSS Feeds can be used by readers to effectively subscribe to your website using a ‘Feed Reader’. They can also be used by software that needs to retrieve a simplified version of your content. For example tools that repost your content to Facebook.

Disabling your websites RSS feed will not improve performance and it might exclude some readers. But if you want to disable it anyway it’s easy to do using a plugin or Perfmatters.

Conclusion

At the start of this guide I set you some load time targets: one second (or less) for text-based pages and two seconds for media-heavy pages. If you focus on implementing the recommendations in this guide I’m confident that you will have no problem reaching those numbers.

If you’ve found this guide useful please like it on Facebook or Twitter so more people can discover it too.

The original post is here and this has been reposted with permission from Dan Cooper from Fonts Plugin.

The post How to speed up WordPress (a non-technical guide) appeared first on Freelance Wordpress developer Melbourne | Sydney | Gold Coast | Brisbane |.

With the help of a few plugins, you can optimise your wordpress site for SEO in half a day (depending on size.)

SEO can be majorly divided into 3 areas. • on-page SEO• off-page SEO• technical SEO
In this blog post, I’ll show you how to perform out on-page and technical SEO on your WordPress website with zero coding skills.

Using plugins

There are a multitude of plugins you can use for SEO, but I’ll go with the ones that are tried and tested for my clients web projects:• Yoast SEO (Free & paid)• RankMath (Free)• All in One SEO Pack (Free & paid)For this guide, I’m going to use the SEO by YOAST plugin, as it’s the one I have had the most experience with, and it’s the most user friendly interface for small business owners to use. Let’s press on, shall we?

First, add an XML sitemapA sitemap is imperative so search bots can crawl and index your site. You are seriously disadvantaging yourself by not having a sitemap installed.
An XML sitemap displays the page structure of a website and helps search engines to easily find the content they are looking for.

Once you install the Yoast SEO plugin, it will automatically add an XML sitemap to your WordPress website.

See the below steps to view your website’s XML sitemap on Yoast SEO plugin.

1. Click on Yoast SEO options on the left in your WordPress dashboard

2. Select General

3. Select Features

4. Find XML sitemaps option

5. Turn it on

6. Click on the question mark to view the sitemap (See the image below)

Without plugins

Add a robots.txt fileA robots.txt (case sensitive) file tells search engines how to crawl pages on your website.Here is the basic format.User-agent: [user-agent name]Disallow: [URL string not to be crawled]User-agent indicates the name of the bot. This would be Googlebot in the case of Google.

Apart from allow or disallow, crawl delays can also be mentioned in a robots.txt file. The robots.txt file should be placed in a website’s top-level directory.

The TLD is your root folder, where your website files liveE.g. www.example.com/robots.txtIf your website has a page that you do not want search engines to crawl, you can block it on the robots.txt file.

This is common in case of thank you pages or dedicated landing pages where you often offer a free giveaway download.

For sites not using Word press, you will need to generate a robots.txt file manually in a text editor such as VS Code.

If you are using WordPress, Adding robots.txt file is taken care by Yoast SEO plugin on a WordPress site. Here is where you can find them.

1. Go to Yoast SEO options on the left in your WordPress dashboard.

2. Go to tools.

3. Select file editor. File editor will show you a page where you can edit your robots.txt file. You can read more about robots.txt file here.

3. Optimize your title tags

Title tag is what you see on the top of every browser window. It normally should contain the title of the web page, and most importantly the main keyword you want to rank for.

For example, if you want your page to rank for the keyword ‘Freelance Word press developer, it is essential that you have it in your title tag. I am using multiple location/cites in my country as well.
This is something the SEO plugin also takes care of for you, which is why it’s so popular.

It will tell you the presence of your keyword in the title tag, its optimal length (50 characters) and will also show you a preview of how it looks in the search results.

3. Optimize the meta description

Meta description is the content below the title of the page in the search results. Just like the title tag, it is important to have the main keyword in your meta description. The optimal length for a meta description is now 155 – 160 characters The Yoast SEO plugin in WordPress will help you set up a meta description and optimise it with keywords. You can read the guide here https://yoast.com/meta-descriptions/.

4. Optimize URLs
Make your URLs less than 75 characters and place your keyword within the URL. Don’t use URL’s longer than 75 characters. For example, if your target keywords are pest control in Melbourne you would have your URL as:www.example.com/pest-control-in-melbourne-cost

Another way to get URL ideas is to use long tail keywords and use those as URL titles.
In WordPress, you can directly edit the slug for every page or post. Go to your permalink settings and make sure you have selected ‘post’ as the type. This is easiest to read.

5. Use h1 tag for the main heading
If you use a software like SEM rush you will get a list of seo errors, and one of the common ones is “there are 37 pages without a h1 title tag” (as an example.)

Always make sure the main heading is a h1 tag. You only want one h1 tag on each page as well, let’s not confuse the bots when they crawl your page.

A h1 tag will look like this:<h1> Here goes the heading </h1>In the Gutenberg, you can readily choose your heading tags. Make sure your heading element is a h1 element.

7. Add alt tags for imagesAlt tags are a must for all images and videos. Go to your Word press media library and add the description in the alt tags. These images will come up if someone is searching for the same title as your alt tag, which is why it’s a good seo practice.

To really boost your SEO add your target keywords into your alt tags. For example if your target keyword is “pest-control-melbourne” you add this in your alt tag with a description of the image.

Alt tags are so if the image does not display on your site, there is a description showing what the image is. When a search engine bot crawls your website, it picks up on the alt tag content and relates those keywords to search terms of the same value.

8. Run your site through core web vitals

The most important speed metric is passing Core Web Vitals. Core web vitals is part of google page speed insights, and to “pass” you need a score above 90. Now as a professional web developer, I can tell you above 90 takes work to achieve, but it is next to impossible on mobile.

That’s because devices are often using roaming internet instead of wifi connection, and the page load times are much slower.

For example, this site passes desktop but not mobile. Most developers I know go off the desktop page load time, and consider over 90 a pass. Run your site through page speed insights and see if you pass core web vitals.

If you get a bad score don’t panic. You can click on the waterfall to see exactly what assets/delivery methods are slowing you down and work on those items to improve your speed.

9. Convert images to webp

If you use images on your site, make sure to convert them to webp. You can do this manually through many online converters like Convertio, or you can use a plugin such as imagify if you are on WordPress.

If you are running your proxy through Cloudflare, and you have the pro plan go the optimize settings:
And select lossless compression:

10. Caching is a must for a php website

Word press is a PHP framework, and because of the many database requests that happen during the HTTPS process, caching is a must.

whenever a user visits your website, the browser has to download all the files of your website from the server, after making a database connection. If your browser has to do this every time, it’s going to produce slower load times. Cache means storage, so your browser is storing the website information so it can load it faster next time.

IF you are using cloudflare, just turn on caching. You will see how many requests are hitting cache, and how much your site is improved with caching on.

If you have a WHM hosting environment, I would use a plugin such as:
• Litespeed cache• Wp Rocket (handles CSS/JS optimization as well as caching)
Litspeed cache is an excellent and free option for a WordPress plugin.

11. Minification of CSS/JS

The delivery of CSS and JS assets and how long that process takes greatly affects your website loading speed.
Minifying HTML, CSS and JavaScript on your website will reduce the loading time and is a well known method of faster content delivery.
These are my best options:

Without a plugin Cloudflare pro. Cloudflare handles caching, proxy servers, CSS/JS deferred assets, lazyloading of images, lossless compression, and minification all with the click of a button.
With a pluginWith a plugin, you can select “minify” in the options tab, and the files will be minified for you. File minification reduces loading time. My top two plugins for handling this are:
• Wp Rocket (paid) • Autoptimize

12. Check your website is responsive

Responsiveness on devices is a must since 60% of your traffic are mobile users. This is also a core metric for google search bots, as it ties into web standard accessibility. If you are using a pre built theme like Elementor, most of the block elements should be responsive out of the box and you can toggle the mobile icon to see how it looks on mobile devices.

However, even with these options you may not be able to completely fix everything on the page, and if that’s the case get in touch and we can fix it for you.

13. Link to internal pagesYou should always link to internal pages of your site. It means that visitors are likely to stay for longer, and this time spent on page metric is important to google bots because it gives your page credibility. From a business point of view, a longer time spent on site means a higher chance you will convert that person to a customer.

14. Add outbound links
Outbound links are links that point from your website to another.They are often used within content to add more context and to link a reader to another source that will add additional and important information to the topic at hand (source) https://www.semrush.com/blog/outbound-links/While linking out, try and use high domain authority sites to link to.

If you aren’t really sure about the authority of a site, ‘rel=nofollow’ tags should be used in your outbound link. When you use ‘nofollow’ tags, it doesn’t pass link equity to the site you are linking out to. If you haven’t used a nofollow tag on a link, it will stay as dofollow. That means it is going to pass on link equity and impact the rankings of the target page or site.

For a HTML websiteMake sure all the links in the code and add rel=nofollow tags on to the link if you want them to be nofollow tags, and add rel=dofollow for follow tags.

For a WordPress website

In WordPress when to add a link in Gutenberg, there in an option to select the link be a no-follow link:
If you don’t toggle this button, the link will be a do follow link.

15. Use keywords in content

In the past, people use to just cram their content full of keywords. So you would read a page and there would be just a list of keywords there so bots can crawl and rank that site for keywords. This is both tacky and unnecessary. Using practices like this can get you Panda’d by google. Don’t get Panda’d.
https://en.wikipedia.org/wiki/Google_Panda
What you should do is appropriately inject your keywords into your content, in a way that flows naturally and doesn’t sound cheesy. Ideally you should place your keywords in the first paragraph.

16. Write articles over 1000 words, if not 2000

I’ll be blunt about this: any SEO strategy that doesn’t include content writing is a SHAM. Yes a sham. There are plenty of SEO companies out there happy to take your money, and perform technical seo but without content that is relevant to your industry, your site will struggle to rank highly in organic listings.
Good content draws traffic to your site, and more traffic = better SEO results. Google bots interpret higher traffic and relevant content as a credible, authority in your niche website and that is the long game to aspire to here.

17. Use keywords in your blog posts

Think about the last time you searched “ how to unblock a sink.”

After the paid ads, I bet the first result was an article with the exact title of “how to unblock a sink.” There may have been an extension to the title such as “in 2022” or “without a plumber” but you get the idea.

The titles of your blog post matters. You can think of blog post titles as being like email subjects: write something relevant and catchy, and most related to the search term.

18. Use LSI keywords

LSI stands for Latent Semantic Indexing. It is a mathematical method used to determine the relationship between terms and concepts in content.What!?

OK let me explain it this way. Have you ever been to the bottom of googles first page and noticed a bunch of related search terms shown that you can click on? These are LSI keywords.

In the example of our how to unblock a sink search:
These LSI keywords give us similar search terms people are looking for, and it’s a good idea to add them to your content where appropriate to boost your rankings. Do a google search for your main keyword to find the LSI keywords.

19. Publish helpful content

Content is still king, or queen in my case. If you are consistent in publishing educational, high value content you will definitely boost your traffic. This is THE single most important thing you can do to boost traffic. It does get forgotten about, because while paid ads give you an instant boost, content marketing is like dripping a tap into a bucket- it seems futile at first but over time produces good results.

A good place to get content ideas is to login to google search console, and go to “Queries.” This will show you the exact search terms they are using to find your website. So basing your content around these terms is great start. How unique your content is, is also important. If there’s a new SEO trend and I’m the first one to post about it, I will likely get the most traffic without competition.
The point here is, content builds authority and authority builds trust = sales.

20. Social sharing
Using social sharing buttons is a great way to enable readers to quickly share your content on social media. This expands your reach even further, and also increases traffic.
On a static siteJust find the fontawesome icons you want, embed them and add the href to the social channel. On a WordPress siteI use shared counts. It’s by a well respected developer in the WordPress community and it’s easy to get up and running quickly. You can download it here https://sharedcountsplugin.com/

21. Avoid duplicate title tags

This may sound like a no brainer, but I have worked on client sites where they have multiple pages with very similar title tags. There may be one or two words that are different, but google picks up on the parts that are the same and scores you negatively for it. Its not hard to find a new page title, and there are many benefits to doing so.

22. Update your SSL
Theres really no excuse to not have an SSL certificate in 2022, but surprisingly many businesses do not. Nothing is worse than the google warning saying that this sit is not safe to visit, because attackers may steal your information.
Would you visit that site?
Your hosting company should provide free SSL, so log a ticket and get SSL installed today.

23. Promote your content on social

If you have the budget, promote your content on social media. This is a sure fire way to attract visitors to your site, and also build followers to your page. You don’t have to spend a lot, you can start with $2 a day budget in Facebook ads manager.

So as you can see, there is a lot you can do to make sure your site increases in visibility, and ranks higher in organic search results. We are all aiming for the illustrious first page, and by conducting these practices over time, it becomes a realistic goal.

The post 23 SEO hacks for your wordpress site in 2022 appeared first on Freelance Wordpress developer Melbourne | Sydney | Gold Coast | Brisbane |.

Today, i’m going to show you how I setup the site using the Wpforms Pro plugin, which you can purchase here. This guide that is coming is posted here, but I am doing a walkthrough as for this particular project the client is using Buddyboss platform as a membership site, which is not outlined in the Wpforms guide.

First, you need to download and install the WP forms pro plugin.

Once you have done that and activated your license, you need to go to add ons and install the user registration extension which looks like this:

Now you need to add a new form and choose the user registration form template:

Once you have selected the user registration form, go ahead and populate it with the fields you require.

And finally, make sure to configure the notifications and confirmation settings.

Now, we’re going to add the whitelist of allowable domains to your functions.php file. You can copy the gist below, and in the array replace ‘icloud.com’, ‘me.com’ with the email extensions you wish to whitelist.

The whitelist contains ‘allowable’ email form fields, but if your list of extensions is very large, you may wish to just add a blacklist instead, which is likely to contain less extensions. Once again, change the values to the email extensions you wish to whatever values you wish to blacklist.

And that is it! Simple easy, and only requires a few modifications to your functions.php file.

For the particular project I used this for, all users on the whitelist who register for the membership site, are then automatically joined to the backend BuddyBoss platform. As BuddyBoss has an integration with WPforms, there were no further code snippets or plugins required to achieve this.

Happy days! If you gave this a go and got it working (or not) please comment and I’d love to hear from you or help you out.

Jane James is a WordPress web developer based in Melbourne, Australia but also services clients from Sydney, Brisbane, Newcastle, Perth, Adelaide, Darwin and Hobart.

The post How to restrict/whitelist email extensions on your contact forms for your wordpress membership site appeared first on Freelance Wordpress developer Melbourne | Sydney | Gold Coast | Brisbane |.