Web-stories-wp: Search Console erroneously marking stories as invalid

[rubenalonsoes]

Hi guys I got some issue with the Google stories plugin when I add a link in any text layer and I try to validate it in the AMP tester.

Testing

I have a web story (https://miposicionamientoweb.es/stories/7-pasos-para-crear-un-blog/) with a link in the final page and this causes two errors in the AMP tester:

• The "target" attribute of the "$reference_point" tag has been set to the value "_top", which is not valid.
• The label "a", secondary label of "AMP-STORY-GRID-LAYER animate-in", does not meet the criteria of the reference point "AMP-STORY-GRID-LAYER animate-in".

I've create a copy of this story without links in (https://miposicionamientoweb.es/stories/pasos-para-crear-un-blog/) and this works fine without errors in the AMP tester.

Do you know what could cause the problem?
Thanks!

[swissspidy]

Hmm, it looks fine in the AMP validator, whereas I can see the same issue as you in the AMP test tool.

We'll take a closer look!

[rubenalonsoes]

Yes, it's weird because in the code doesn't really show that target="_top", but it does show it later in the AMP test tool. :(
Thanks Pascal!

[swissspidy]

So this seems to be an issue with the AMP test tool itself, which might simply need an update. I've relayed this information to folks working on it, and they are taking a look.

Unfortunately I can't give you any update on how long that will take or anything.

I am closing this issue for now since it's not a bug in the Web Stories WordPress plugin itself.

[rubenalonsoes]

Thanks a lot Pascal!

[fabiorlobo]

Hey guys, I think I got it.

I'm facing the same issue in my stories: https://search.google.com/test/amp?id=yj7m1aanmx5M2cIaf8qvsQ

The problem is really the target=_top attribute. And the Web Story plugin does not add the target attribute of any kind – Google is adding it for some reason.

Testing

So, I tested some of these examples for comparison.

This story have a link with "target" attribute and is valid.

There is one difference, though: they use _blank instead of _top.

I copied the HTML from here for a quick test: I put target="_blank" on my link and uploaded the file here.

I tested and... ta da! It is valid now.

Possible solution

I think the solution is adding target="_blank" on all links. It makes sense, as the structure of a Web Story is different from a web page.

Any thoughts? I hope this can help, @swissspidy.

Thanks!

[swissspidy]

Hi @fabiorlobo, great research and interesting thought with the target="_blank".

The problem is indeed that the testing tool is erroneously adding this and then complaining about it. I'm following up with some folks to see what the status is on addressing that issue.

Your story is indeed _valid_ as-is, so there's nothing you need to worry about. It shouldn't have any negative impact.
As for the target="_blank" part, it's something we'll consider adding an option for. (Enabling it by default would impact accessibility and usability — see e.g. https://css-tricks.com/use-target_blank/ for an overview)

In any case, I am sure the actual issue with the test tool gets addressed way before we implement such an option :-)

[fabiorlobo]

Hey @swissspidy!

Actually the testing tool is not adding it – Google is ;\

I think is because the plugin doesn't add a target attribute.

I tested it and my web stories isn't indexing as AMP because of the target=_top attribute that Google is adding.

So it's not valid at all!

My test was indexed as AMP because it's valid: https://www-fabiolobo-com-br.cdn.ampproject.org/c/s/www.fabiolobo.com.br/test/test1.html

The original post was not indexed as AMP because it's not valid: https://www-fabiolobo-com-br.cdn.ampproject.org/c/s/www.fabiolobo.com.br/stories/quem-e-fabio-lobo (it's redirecting to the official URL, so Google has not indexed as AMP)

I have other AMP articles indexed like this one, that's why I'm using this kind of URL for testing.

Also, if you compare the link above with the official url, you can see that there is no target attribute in my links. On the other hand, there is target=_top in the Google version. It proves that Google is adding it to all links that don't have a target attribute, right?

Google Search Console itself says that my Web Stories have errors, so they are not indexed as AMP:

When you search for site:fabiolobo.com.br cls, a story I posted 2 weeks ago, you can see it is not listed as AMP, nor Web Story.

As you can see, the rich results, the main feature of AMP and Web Stories, isn't working because my web story is not a valid AMP. Just beacuse of a target=_top attribute. ;\

@rubenalonsoes created another version of its story, without the link, so it is valid and indexed as AMP.

So, by using the Web Story plugin, we can only get a valid page when there is no link on it. My whole test is based on that – it's a bug!

A weird one, but we need to fix it.

I hope I explained it better this time :D

Thanks for your help and sorry for my poor english.

[swissspidy]

Thanks @fabiorlobo, really appreciate you digging through all of this!

The tools in play here are a bit intertwined, so from the outside one cannot easily tell where exactly the origin of the problem is.

I just want to reiterate that it appears to be a problem with the tools involved here, and not an issue with your story. I have passed this issue along internally and am following up with the involved teams as I am writing this message.

Of course people should be able to find your content, so I'm sure you understand I'm making sure this is treated with the right priority!

[swissspidy]

@fabiorlobo @rubenalonsoes Update! We've identified this to be an issue with Cloudflare's "AMP Real URL" option as they seem to use an older version of that feature.

While we'll reach out to them about it, can you try to turn off that option in Cloudflare for your site to see if this resolves the issue for you?

[fabiorlobo]

@swissspidy done! And I think you nailed it: https://search.google.com/test/amp?id=NikKW6AC4EgT5XCDu8Ae1w

Yes, you nailed it :D

Thanks a lot!

[rubenalonsoes]

That's it!!! Now works @swissspidy thanks!!! :)

[swissspidy]

Awesome, glad to hear it's working for you! 🎉 🎉

Please do not hesitate to let us know if you encounter anything else in the plugin. It's still brand new, so it can be a bit rough around the edges.

Just note that we're trying to centralize all support efforts on the WordPress.org support forums in the future, keeping GitHub mostly for development.

On that note, if you both would consider leaving a review if you're otherwise happy with the plugin, it would really make my day! 😊