Connect with us

WordPress

How to Improve Page Speed for More Traffic & Conversions

Published

on

Jeremy Knauff


Page speed is a critical factor in digital marketing today. It has a significant impact on:

  • How long visitors stay on your site.
  • How many of them convert into paying customer.
  • How much you pay on a CPC basis in paid search.
  • Where you rank in organic search.

Unfortunately, most websites perform poorly when it comes to page speed, and that has a direct negative impact on their revenue.

There is an almost infinite number of things we can spend our days doing as digital marketers, and there’s never enough time to do them all. As a result, some things get pushed to the back burner.

One of the things that seem to get pushed back most often is optimizing page speed. This is easy to understand because most people don’t truly comprehend the importance of this often overlooked detail, so they don’t see the value in investing time and money to improve it by a few seconds or less.

What may seem like an inconsequential amount of time to some marketers, including those who focus solely on search engine optimization, has been proven to be monumental by data from industry giants all the way down to our own analytics data.

I’ll assume that you’re like me and you want to maximize your results, and of course, your revenue, right? Then let’s get started in making your website faster than greased snot! (That’s quite a visual, isn’t it?)

1. Ditch the Budget Web Hosting

We’re all trying to save money these days, after all, those subscriptions to Raven, SEMrush, Moz, and all the other tools we use on a daily basis add up quickly. It’s almost like having an extra kid.

One way a lot of people try to save money is by choosing the kind of cheap shared hosting that crams as many websites as they can fit onto a server, much like a bunch of clowns piling into a single car. Performance be damned!

Sure, your website will be available most of the time as it would with most any web host, but it will load so bloody slowly that your visitors will leave frustrated without ever converting into buyers.

“But it’s barely noticeable!” these bargain shoppers insist.

Here’s the thing — it might be barely noticeable to you because it’s your baby and you love it.

But everyone else only wants to get in and get out of your website as quickly as possible.

People want to be on your site for just long enough to do what they came to do, whether that means to get an answer, buy a product, or some other specific objective. If you slow them down even a little bit, they will be likely to hate their experience and leave without converting.

Think about it like this:

Most people love their own kids unconditionally. But someone else’s kid screaming, throwing things, disrupting their night out at a restaurant? They hate that kid. It’s the same with your website.

How Much of a Difference Does It Really Make?

According to a study conducted by Amazon, a difference of just 100ms — a unit of time that a human can’t even perceive, was enough to reduce their sales by 1%. Walmart found similar results.

If that tiny unit of time has that much direct impact on sales, what kind impact do you think an extra second or more will have?

But it doesn’t stop there because how quickly (or slowly) your website loads also has an impact on organic search ranking and pay-per-click costs.

In other words, if your website loads slowly, you should expect your competitors who have invested in this critical area to eat your lunch.

Bottom line: skip the budget web hosting. If they are selling it like a commodity (based mainly on price) then they’ll treat their customers like a commodity too.

There are a lot of web hosts that are optimized for speed, particularly for WordPress websites, and some of them are priced similarly to the budget options.

So ask around, do some testing, and invest in a web host that will give you the performance to satisfy both your visitors and Google.

2. Reduce HTTP Calls

Every file needed for a webpage to render and function, such as HTML, CSS, JavaScript, images, and fonts require a separate HTTP request. The more requests made, the slower that page will load.

Now if you’re anything like most of the people I talk to, you’re probably thinking “Oh, I don’t need to worry about that, Jeremy. I know what I’m doing and I don’t add a bunch of bloated garbage into my website!”

That may be partially true. You may not add a bunch of bloated garbage to your website, but for 90+% of the websites that I encounter — it’s still there anyway.

That bloat isn’t there because the Bloat Fairy snuck it in while you were sleeping. It’s there because a majority of web designers, regardless of skill or experience, don’t make page speed a priority. The sad truth is that most don’t even know how.

Here’s where the problem starts:

Most themes load one or more CSS files and several JavaScript files. Some, such as Jquery or FontAwesome, are usually loaded remotely from another server, which dramatically increases the time it takes a page to load.

This becomes even more problematic when you consider the additional CSS and JavaScript files added by plugins. It’s easy to end up with half a dozen or more HTTP requests just from CSS and JavaScript files alone.

When you factor in all of the images on a page, which each require a separate HTTP request, it quickly gets out of hand.

  • Merge JavaScript files into one file.
  • Merge CSS files into one file.
  • Reduce or eliminate plugins that load their own JavaScript and/or CSS files. In some cases, as with Gravity Forms, you have the option to disable them from being loaded.
  • Use sprites for frequently used images.
  • Use a font like FontAwesome or Ionic Icons instead of image files wherever possible because then only one file needs to be loaded.

3. Include the Trailing Slash

Omitting the trailing slash on links pointing to your website, whether from external sources (link building efforts) or from within your own website, has an adverse impact on speed.

Here’s how:

When you visit a URL without the trailing slash, the web server will look for a file with that name. If it doesn’t find a file with that name, it will then treat it as a directory and look for the default file in that directory.

In other words, by omitting the trailing slash, you’re forcing the server to execute an unnecessary 301 redirect. While it may seem instantaneous to you, it does take slightly longer, and as we’ve already established, every little bit adds up.

https://example.com (this is bad)

or

https://example.com/services (this is also bad)

vs.

https://example.com/ (this is good)

or

https://example.com/services/ (this is also good)

4. Enable Compression

Enabling GZIP compression can significantly reduce the amount of time it takes to download your HTML, CSS, JavaScript files because they are downloaded as much smaller compressed files, which are then decompressed once they get to the browser.

Don’t worry — your visitors won’t have to do anything extra because all modern browsers support GZIP and automatically process it for all HTTP requests already.

5. Enable Browser Caching

With browser caching enabled, the elements of a webpage are stored in your visitors’ browser so the next time they visit your site, or when they visit another page, their browser can load the page without having to send another HTTP request to the server for any of the cached elements.

Once the first page has been loaded and its elements are stored in the user’s cache, only new elements need to be downloaded on subsequent pages. This can drastically reduce the number of files that need to be downloaded during a typical browsing session.

6. Minify Resources

Minifying your CSS and JavaScript files removes unnecessary white space and comments to reduce the file size, and as a result, the time it takes to download them.

Fortunately, this doesn’t have to be a manual process because there are several tools available online to convert a file into a smaller, minified version of itself.

There are also several plugins available for WordPress that will replace the links in your website head for your regular CSS and JavaScript files with a minified version of them without modifying your original files, including popular caching plugins such as:

  • W3 Total Cache
  • WP Super Cache
  • WP Rocket

It may take a bit of effort to get the settings just right because minification can often break CSS and JavaScript, so once you’ve minified everything, be sure to test your website thoroughly.

7. Prioritize Above-the-Fold Content

Your website can appear to the visitor to load more quickly if it’s coded to prioritize above-the-fold content — in other words, the content that is visible before a visitor scrolls.

This means ensuring that any elements that appear above the fold are also as near the beginning of the HTML code so the browser can download and render them first.

It’s also critical to include any CSS and JavaScript that are required to render that area inline rather than in an external CSS file.

8. Optimize Media Files

Because mobile devices with high-quality cameras are common and modern content management systems such as WordPress makes it convenient to upload images, many people simply shoot a photo and upload it without realizing that, often, the image is at least four times bigger than is necessary.

This slows your website down considerably — especially for mobile users.

Optimizing the media files on your website has the potential to improve your page speed tremendously, and doing so is relatively easy, so it’s a good investment of your time.

Optimizing Images

  • Opt for the ideal format. JPG is perfect for photographic images, while GIF or PNG are best for images with large areas of solid color. 8-bit PNG files are for images without an alpha channel (transparent background) and 24-bit files are for images with an alpha channel.
  • Ensure images are properly sized. If an image is displayed at 800 pixels wide on your website, there is no benefit to using a 1600 pixels wide image.
  • Compress the image file. Aside from being the top image editing program, Adobe Photoshop has awesome image compression capabilities and starts at $9.99/month. You can also use free WordPress plugins – such as WWW Image Optimizer, Imsanity, and TinyJPG – that automatically compress uploaded images.

Optimizing Video

  • Choose the ideal format. MP4 is best in most cases because it produces the smallest file size.
  • Serve the optimal size (dimensions) based on visitors’ screen size.
  • Eliminate the audio track if the video is used in the background as a design element.
  • Compress the video file. I use Adobe Premiere most of the time, but Camtasia is a solid choice too.
  • Reduce video length.
  • Consider uploading videos to YouTube or Vimeo instead of serving them locally and use their iframe embedding code.

You shouldn’t stop there though because that only scratches the surface.

To truly optimize the media on your website, you need to serve the appropriately-sized images based on the screen size rather than simply resizing them.

There are two ways to handle this, based on the implementation of an image.

  • Images within the HTML of your website can be served using src set, which enables the browser to select, download, and display the appropriate image based on the screen size of the device a visitor is using.
  • Images placed via CSS – typically as background images, can be served using media queries to select the appropriate image based on screen size of the device a visitor is using.

9. Utilize Caching & CDNs

Caching enables your web server to store a static copy of your webpages so they can be delivered more quickly to a visitor’s browser, while a CDN allows those copies to be distributed to servers all over the world so that a visitor’s browser can download them from the server closest to their location. This improves page speed dramatically.


Image Credits

Featured Image: Paulo Bobita



Continue Reading
Click to comment

You must be logged in to post a comment Login

Leave a Reply

WordPress

5 Essential Schema Plugins for WordPress

Published

on

Julia McCoy


Not all website elements are created equal.

Some matter – and some matter a ton.

So what are your site’s standout elements? Here are five:

  • Customer reviews.
  • Ratings.
  • Product pricing.
  • Recipe ingredients (if your website is about cooking).
  • Your company’s operating hours.

It’s pretty obvious to you how important these elements are to your site.

But how can you make search engines understand that?

The answer is with schema markup and rich snippets.

What Are Schema Markup & Rich Snippets?

Rich snippets are the extra pieces of information that appear around your website’s link.

Schema markup is HTML code used to create rich snippets.

Take a look at this example.

5 Essential Schema Plugins for WordPress

Let’s say you want to buy a Darth Maul toy lightsaber.

You go on Google and type “Star Wars Darth Maul Lightsaber.”

The photo above shows you the results.

As you can see, you don’t only get links to the different websites selling the toy.

You also get a bunch of additional information to help you decide which link to click.

Amazon shows you star ratings and reviews.

Entertainment Earth includes the toy’s price, length, height, and weight.

Valuable pieces of information, right?

These are your rich snippets.

And if you add them to your site, you’ll naturally boost it higher on Google’s SERPs.

How Rich Snippets Boost Your SEO Ranking

Technically, rich snippets don’t directly affect your site’s ranking on Google’s SERPs.

However, they can still get you ranked higher on Google.

For instance, let’s say you want to bake a Black Forest cake for a loved one’s birthday.

You go on Google and type “Black Forest Cake Recipe.”

Here are the results you get:

5 Essential Schema Plugins for WordPress

As a busy cake-lover, which recipe would you most likely click? One that is rated 5 stars and takes 2 hours and 45 minutes to bake? Or one that is rated 4.9 stars and takes 3 hours and 45 minutes to bake?

Naturally, you’d choose the first option.

The star rating, votes, and description (all rich snippets) encourage you to go to livforcake.com for your recipe.

This is how your rich snippets increase your click-through rate.

And the higher your click-through rate, the more likely Google will notice you.

So how do you add rich snippets to your site?

The Top 5 Schema Plugins for WordPress

The great news is if you’re using WordPress, you don’t have to touch a single line of code.

Simply choose a schema plugin, and creating rich snippets will be easy.

Here are the top five marketers love.

1. Schema Pro

5 Essential Schema Plugins for WordPress

Schema Pro makes adding rich snippets to your site fast and easy.

In a matter of minutes, you can add your preferred configurations to all your pages and posts.

Schema Pro supports 13 useful schema types. These are:

  • Reviews (music, movies, products, books, etc.).
  • Services.
  • Recipes (you can create your own attractive schema rich card that’ll boost your click-through rate).
  • Software applications (add reviews and star ratings to give your applications a boost).
  • Video objects.
  • Books.
  • People.
  • Products (give searchers detailed information on what you’re selling).
  • Local businesses.
  • Articles (news, blogs, etc.).
  • Courses.
  • Job postings.
  • Events.

Price: $79/month or $249/lifetime

2. All in One Schema Rich Snippets

5 Essential Schema Plugins for WordPress

All in One Schema Rich Snippets is one of the simplest plugins you can find for schema markup.

Although it’s simple, it provides you with snippets for reviews, ratings, events, articles, and software applications.

One great thing about this plugin is you can use it for free.

It doesn’t have a ton of fancy designs to select from, but it does have the basics you need for rich snippets on your site.

The downside of using this plugin is it doesn’t support automation.

You’ll have to add schema markup to each page of your site manually.

What’s interesting about All in One Schema Rich Snippets is it’s made by the same maker as Schema Pro.

In fact, its dashboard heavily advertises Schema Pro.

So how to choose between the two?

Use Schema Pro if you’re running a bigger online business.

The price will be worth it for the automation, unique designs, and schema markup support for local businesses.

If you’re just starting out and want to try something for free?

Go with All in One Schema Rich Snippets.

Price: Free

3. Schema and Structured Data for WP & AMP

5 Essential Schema Plugins for WordPress

Schema and Structured Data for WP & AMP supports 33 schema types.

Three unique ones include:

  • How To (list the steps in your how-to article to be featured in your rich snippets)
  • Q&A (if your article is in a question and answer format, you can feature the most relevant questions and answers in your rich snippets)
  • Audio object (add details about audio you upload like date of upload, length, etc. to your rich snippets)

The best part? If the schema type you’re looking for isn’t part of the 33 this plugin offers, you can request a customized type!

Here are other features this plugin offers:

  • Reviews pulled from over 75 sites.
  • Your own customized review rating boxes with schema markup.
  • Compatibility with other schema plugins like SEO Pressor and WP SEO Schema.

Price: Personal: $99, Webmaster: $149, Freelancer: $299, Agency: $499

4. WP Review Plugin

5 Essential Schema Plugins for WordPress

If you run an ecommerce site, WP Review is a good plugin option for you.

This is because its main focus is increasing your consumer interaction with product and service ratings and reviews.

If you’re a blogger, this plugin is also great because you can use it to rank and rate tools, software, recipes, or anything else you review.

Here are the top features you’ll get with WP Review:

  • Rating systems using points, percentage, or stars.
  • Unlimited color changes for individual reviews.
  • Lightweight, won’t slow your site down.
  • Supported by most WordPress themes (both free and paid).
  • 2 templates for review boxes to choose from.

WP review is easy to install and configure, making schema markup simple for the least tech-savvy person.

Price: Personal (one site): $49/year or $236/lifetime, Developer (more than one site): $149/year or $596/lifetime, Agency (affiliate marketer): $299/year or $1,196/lifetime.

5. WP SEO Structured Data Schema

5 Essential Schema Plugins for WordPress

WP SEO Structured Data Schema is a free plugin that contains all the basics you need for schema markup and rich snippets.

It supports schema types including organizations, local businesses, videos, events, and ratings.

You can also add geo coordinates, people’s names, logos, business descriptions, working hours, and more.

Price: Free

How to Find the Schema Plugin for WordPress That Fits You

Schema markup and rich snippets are essential to your site SEO.

They make your site look attractive.

They encourage people to click your link.

They help you stand out in the sea of other websites.

So how can you choose the one that’s right for you?

It’s simple.

All you must do is determine your needs.

Do you have a simple site that doesn’t require detailed rich snippets? Go for a free, user-friendly plugin.

Are you an affiliate marketer with five websites and blogs? An investment in a plugin with the latest features will be worthwhile.

As soon as you’ve chosen and installed the right plugin, you’re ready to use a powerful tool that’ll make your click-through rate soar.

More Resources:


Image Credits

All screenshots taken by author, December 2019



Continue Reading

WordPress

The dangers of misplaced third-party scripts

Published

on

The dangers of misplaced third-party scripts


I was recently helping one of my team members diagnose a new prospective customer site to find some low hanging fruit to share with them.

When I checked their home page with our Chrome extension, I found a misplaced canonical tag. We added this type of detection a long time ago when I first encountered the issue.

What is a misplaced SEO tag, you might ask?

Most SEO tags like the title, meta description, canonical, etc. belong in the HTML HEAD. If they get placed in the HTML BODY, Google and other search engines will ignore them.

If you go to the Elements tab, you will find the SEO tags inside the <BODY> tag. But, these tags are supposed to be in the <HEAD>!

Why does something like this happen?

If we check the page using VIEW SOURCE, the canonical tag is placed correctly inside the HTML HEAD (line 56, while the <BODY> is in line 139.).

What is happening here?!

Is this an issue with Google Chrome?

The canonical is also placed in the BODY in Firefox.

We have the same issue with Internet Explorer.

Edge is no exception.

We have the same problem with other browsers.

HTML parsing vs. syntax highlighting

Why is the canonical placed correctly when we check VIEW SOURCE, but not when we check it in the Elements tab?

In order to understand this, I need to introduce a couple of developer concepts: lexical analysis and syntax analysis.

When we load a source page using VIEW SOURCE, the browser automatically color codes programming tokens (HTML tags, HTML comments, etc).

In order to do this, the browser performs basic lexical analysis to break the source page into HTML tokens.

This task is typically performed by a lexer. It is a simple, and low-level task.

All programming language compilers and interpreters use a lexer that can break source text into language tokens.

When we load the source page with the Elements tab, the browser not only does syntax highlighting, but it also builds a DOM tree.

In order to build a DOM tree, it is not enough to know HTML tags and comments from regular text, you also need to know when a tag opens and closes, and their place in the tree hierarchy.

This syntactic analysis requires a parser.

An English spellchecker needs to perform a similar, two-phased analysis of the written text. First, it needs to translate text into nouns, pronouns, adverbs, etc. Then, it needs to apply grammar rules to make sure the part of speech tags are in the right order.

But why are the SEO tags placed in the HTML body?

Parsing HTML from Python

I wrote a Python script to fetch and parse some example pages with errors, find the canonical anywhere in the HTML, and print the DOM path where it was found.

https://gist.github.com/franciscobatista356/bd1fdb71c984ef3d1c6ad736ef6d4d96

After parsing the same page that shows misplaced SEO tags in the HTML Body, I find them correctly placed in the HTML head.

What are we missing?

Invalid tags in the HTML head

Some HTML tags are only valid in the HTML BODY. For example, <DIV> and <SPAN> tags are invalid in the HTML head.

When I looked closely at the HTML HEAD in our example, I found a script with a hardcoded <SPAN>. This means, the script was meant to be placed in the <BODY>, but the user incorrectly placed it in the head. 

Maybe the instructions were not clear, the vendor omitted this information or the user didn’t know how to do this in WordPress.

I tested by moving the script to the BODY but still faced the misplaced canonical issue.

After a bit of trial and error, I found another script that when I moved it to the BODY, the issue disappeared.

While the second script didn’t have any hardcoded invalid tags, it was likely writing one or more to the DOM.

In other words, it was doing it dynamically.

But, why would inserting invalid tags, cause the browser to push the rest of the HTML in the head to the body?

Web browser error tolerance

I created a few example HTML files with the problems I discussed and loaded them in Chrome to show you what happens.

In the first example, I commented out the opening BODY tag. This removes it.

https://gist.github.com/franciscobatista356/95c41ad6be7202023734092cc4c03307

You can see that Chrome added one automatically. 

Now, let’s see what happens if I add a <DIV> inside the HTML HEAD, which is invalid.

https://gist.github.com/franciscobatista356/d9cc6a6fcbe326f8bdbc3f6d2d0eb5ce

This is where it gets interesting. Chrome closed the HTML HEAD early and pushed the rest of the HEAD elements to the body, including our canonical tag and <DIV>.

In other words, Chrome assumed we forgot an opening <BODY> tag!

This should make it clear why misplaced tags in the HEAD can cause our SEO tags to end up in the BODY.

Now, let’s look at our second case where we don’t have a hardcoded invalid tag, but a script might write one dynamically.

https://gist.github.com/franciscobatista356/b5239152867159ac1876c1a96ad807f0

Here you see that if a script writes an invalid tag in the HTML head, it will cause the browser to close it early as before. We have exactly the same problem!

We didn’t see the problem with our Python parser because lxml (the Python parsing library) doesn’t try to fix HTML errors.

Why do browsers do this?

Browsers need to render pages that our Python script doesn’t need to do. If they try to render before correcting mistakes, the pages would look completely broken.

The web is full of pages that would completely break if web browsers didn’t accommodate for errors.

This article from HTML5Rocks provides a fascinating look inside web browsers and helps explain the behavior we see in our examples.

“The HTML5 specification does define some of these requirements. (WebKit summarizes this nicely in the comment at the beginning of the HTML parser class.)

Unfortunately, we have to handle many HTML documents that are not well-formed, so the parser has to be tolerant about errors.

We have to take care of at least the following error conditions:

The element being added is explicitly forbidden inside some outer tag. In this case, we should close all tags up to the one which forbids the element, and add it afterward.

Please read the full article or at least make sure to read at least the section on “Browser’s Error Tolerance” to get a better context.

How to fix this

Fortunately, fixing this problem is actually very simple. We have two alternatives. A lazy one and a proper one.

The proper fix is to track down scripts that insert invalid HTML tags in the head and move them to the HTML body.

The lazy and quickest fix is to move all SEO tags (and other important tags) before any third party scripts. Preferably, right after the opening <HEAD> tag.

You can see how I do it here.

We still have the same invalid tag and script in the HTML head and the SEO tags are also in the head.

Is this a common problem?

I’ve been seeing this issue happening for many years now, and Patrick Stox has also reported seeing the same problem happening often to enterprise sites.

One of the biggest misconceptions about technical SEO is that you do it once and you are done. That would be the case if the sites didn’t change, users/developers didn’t make mistakes and/or Googlebot behavior didn’t change either.

At the moment that is hardly the case.

I’ve been advocating technical SEOs learn developer skills and I hope this case study illustrates the growing importance of this.

If you enjoyed this tip, make sure to attend my SMX West session on Solving Complex JavaScript Issues And Leveraging Semantic HTML5 next month. Among other things, I will share advanced research on how Googlebot and Bingbot handle script and HTML issues like the ones I mentioned here.


Opinions expressed in this article are those of the guest author and not necessarily Search Engine Land. Staff authors are listed here.


About The Author

Hamlet Batista is CEO and founder of RankSense, an agile SEO platform for online retailers and manufacturers. He holds U.S. patents on innovative SEO technologies, started doing SEO as a successful affiliate marketer back in 2002, and believes great SEO results should not take 6 months.

Continue Reading

WordPress

9 Best AMP WordPress Plugins for Speed, Search & Tracking

Published

on

John Lincoln


If you want your website to load quickly on a mobile platform, you should make use of Accelerated Mobile Pages (AMP) technology.

Fortunately, that’s easy to do if you’re using WordPress because there are quite a few AMP plugins available.

Even better: many of them are free.

You will, however, need to invest some time to configure them properly. You might even need to make some design tweaks.

Still, it’s worth the effort if Google rewards your site with a top rank in mobile search.

Quick note, before you try any of these AMP plugins for WordPress, make sure you:

  • Create a backup version of your website.
  • Ensure it works in your hosting environment.
  • Make sure it matches your goals for the site.
  • Have a developer on hand to make sure it can be configured properly.
  • Make sure it works with your theme.

Here are some of the best AMP plugins for WordPress in the market.

1. The Official AMP Plugin for WordPress

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

If you’re unsure which plugin to choose from in this list, you almost certainly can’t go wrong with the one that’s designed by the official AMP project.

Here are some of its capabilities:

  • Support for core themes: The plugin is compatible with the “core” themes (such as Twenty Twenty).
  • Compatibility tool: Sometimes, it’s not possible to automate AMP markup insertion. When that happens, the plugin will show which components are causing problems so you can address them manually.
  • CSS tree-shaking: The tool will remove unused cascading style sheets (CSS) so you can stay under the AMP-mandated 50k limit.
  • AMP Stories: While still in beta as of this writing, the plugin enables you to create, edit, and publish AMP Stories.

You can also configure the tool to follow one of three template modes:

  • Standard: Use the AMP plugin for your entire site. There’s no need to separate AMP and non-AMP content.
  • Reader: Shows pages with a simplified design that meets AMP standards. Each page has a canonical URL as well as an AMP URL.
  • Transitional: Delivers AMP and non-AMP experiences with the same look and feel.

The plugin also receives frequent updates. If you’re someone who’s into always getting “the latest and greatest,” that’s another argument in its favor.

2. AMP for WP – Accelerated Mobile Pages

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

One of the more highly rated options in this list is the AMP for WP plugin.

Yes, it even has a better average rating than the one produced by the official AMP project.

AMP for WP also offers a rich feature set that includes:

  • AdSense support.
  • Contact Form 7 support.
  • Email opt-in support.
  • Call To Action support.

In other words, if you want to transform your website into something resembling a mobile app and use it for digital marketing, this plugin might be your best bet.

The tool also plays nicely with some of the more popular WordPress SEO plugins, including Yoast SEO, All in One SEO, SEOPress, Rank Math, and The SEO Framework.

Additionally, AMP for WP also integrates with WooCommerce. If you’re selling products online, that feature alone can give you a nice competitive advantage.

The developers of the plugin offer premium support if you’d need a hand getting things up and running.

3. Schema & Structured Data for WP & AMP

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

How would you like to add markup to your pages so that they appear as rich snippets in search results?

If so, then have a look at the Schema & Structured Data for WP & AMP plugin.

Please note: this option isn’t an AMP plugin per se. However, it supports AMP. That’s the important takeaway here.

The tool also supports 33 different schema types, including blog posts, news articles, local business details, recipes, products, and videos.

If the schema type you want to use isn’t supported, the developers say that you can request it and they’ll add it for you.

The tool even supports conditional display fields, so you get to decide which posts, pages, or other content gets marked up.

You can even import markup data from other schema plugins, including SEO Pressor and WP SEO Schema.

The premium version of the tool enables you to add reviews and offers priority support.

4. PWA for WP & AMP

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

If you’d like to transform your website into a progressive web app (PWA), take a look at the PWA for WP & AMP plugin.

Use the tool to take your user experience up a notch with the latest and greatest web tech bells and whistles.

For starters, and most importantly for this article, the plugin offers full AMP support.

It also comes with UTM tracking, multi-site support, and a cache expiration option.

PWA for WP & AMP also offers a service worker feature that optimizes your website. That translates to faster load times for visitors.

And maybe best of all: the tool includes offline support. Visitors can load the site in a jiffy even when they aren’t connected to WiFi.

The premium version of PWA for WP & AMP gives you access to a loading icon library, calls to action, and data analytics.

5. Glue for Yoast SEO & AMP

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

If you have the Yoast SEO plugin and the Official AMP Plugin for WordPress then you’re going to need the Glue for Yoast SEO & AMP plugin as well.

Why? Because it’s the “glue” that enables the two plugins to work together.

It also gives you an easy way to customize your AMP content.

Additionally, Glue adds rudimental styling so you can retain at least a little bit of the site’s look and feel for AMP visitors.

It’s developed by the same developer who created the Yoast SEO plugin.

6. AMP WP – Google AMP for WordPress

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

This one appears to be a fairly new entry in the library of AMP plugins. As of now, it’s only got a thousand active installations.

Still, the AMP WP plugin demonstrates promise. According to the product description, you can get as much as a 5x faster load with the tool.

Also, the developer claims that it’s 100% compatible with Yoast SEO.

Here are a few other features you get with the plugin:

  • GDPR support (for Europe).
  • Slider support.
  • Related posts view.
  • Support for third-party analytics (like Google Analytics).
  • Ability configure AMP for specific taxonomies (tags and categories).
  • Optional sticky header.
  • Image lightboxes.

7. weeblrAMP CE

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

The weeblrAMP plugin goes beyond what other plugins offer by empowering you to create a nearly complete AMP version of your entire site.

Additionally, weeblrAMP integrates with numerous other tools, including:

  • Disqus
  • Google Analytics
  • Google Tag Manager
  • Facebook pixel
  • Yoast SEO
  • Jetpack
  • WooCommerce
  • Contact Form 7
  • Gravity Forms

Also, the plugin also enables you to fully customize the AMP experience with template overrides.

As of now, weeblrAMP only has 700 active installs. However, it’s got a 4.5-star rating.

8. AMP It Up!

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

AMP It Up! bills itself as another “set it and forget it” plugin. All you have to do is install and activate it and you’ve magically got an AMP-compliant website.

Truth be told, though, nothing is that simple. Especially in web development.

You’re going to have to do some manual configuration.

The tool offers support for:

  • GDPR
  • HTTPS
  • Google Analytics
  • YouTube
  • BrightCove

You can even add your own custom JavaScript to your AMP-enabled website. That gives you some flexibility with the functionality.

Additionally, AMP It Up! automatically adds social share buttons to your pages. You won’t have to fish around for another plugin for that purpose.

Also, the tool will automatically convert content with several pictures into an AMP-compliant carousel.

AMP It Up! only has a few hundred installs at this point but it’s got a 4-star rating.

9. AMP Stories for WordPress

9 Best AMP WordPress Plugins for Speed, Search &#038; Tracking

Want a way to create fast-loading full-screen content on the web?

You can use AMP Stories to get website visitors more engaged with your brand.

And yes, they’re just like Instagram Stories.

You can include images, animations, videos, audio, and text in your own AMP Stories.

If you like the idea of using AMP Stories, you should take a look at the AMP Stories for WordPress plugin. It enables you to create a Story by just filling out a form on a post.

The tool also enables you to include a URL on your Story. That can come in handy if you want to redirect people to another part of your site (for example, to place an order).

The pro version of AMP Stories for WordPress includes bookend management, support for extra content at the end of Stories, and Facebook integration.

The tool currently enjoys a 5-star rating.

Wrapping It Up

In this mobile era, you need a website that loads quickly on mobile devices.

Fortunately, that’s easy to do with AMP.

What isn’t so easy is to manually implement AMP technology on your website.

However, if you’re using WordPress, there are plenty of plugins that will do it for you.

If you haven’t already added AMP support to your WordPress site, why not grab one of the plugins listed here and get the ball rolling today?

More Resources:


Image Credits

All screenshots taken by author, December 2019



Continue Reading

Trending

Copyright © 2019 Plolu.