修复 AMP 页面错误

在 Google Search Console 的报告了,可以看到本站有一百多个 AMP 错误。主要就是 Invalid usage of AMP tags。这么多的错误,还是需要修正的。于是就做了如下的检查和修正。

在 Google Chrome 的开发者工具里的控制台内,查看这些 AMP 页面,只要网址加上 #development=1 就可以了。

看到的错误主要有四部分。

1) 在标签 a 里面,有 onclick 属性,这个是 AMP 无效属性。

2) 在标签 p 或者 span 内,有 style 属性,这同样是无效的。

3) 在标签 amp-img layout="responsive" 里面,有 style 属性,同样要去掉。

4) 标签 iframe, 要替换成 amp-iframe 标签。

修复的过程主要参考了这篇文章,没全部看,因为是日文的,看不懂,大概的参考了中间这一段。

在我的 AMP 模板中的写法是这样的。

此处略去相关代码,请查看桌面标准版文章。

在上面的正则表达式的写法,可能未必是最好的,可以用 RegExr 工具来调试。

过一段时间再去看看 Google Webmaster 后台是否已经去除这些错误了。