]> XHTML with Twitter cards: No metatags found 🌐:aligrant.com

XHTML with Twitter cards: No metatags found

Alastair Grant | Sat 18 Nov 2017

I'm not a big user of twitter personally - lots of people (largely companies) shouting adverts at each other, or people complaining to said companies about bad service.  But I do appreciate that many people do use it and they want web-site links to show up in one of those pretty little boxes instead of just a URL.

I started to have a look at the mass of meta-data needed to generate what Twitter refer to as a "card".  It seems that they are generally RDFa compliant and will take data from there, but you do have to add a few things - see Twitter's Card documentation.  To check you can copy and paste with the finest, they also have a testing tool - which seemed to highlight to me, that I can't copy and paste.  I was recieving and "Unable to render Card preview":

INFO:  Page fetched successfully
WARN:  No metatags found

After much mucking about and using other testing tools I slowly narrowed it down to the Twitterbot - the piece of code that fetches your website to generate the card.  It seems that it does not support XHTML (5 or otherwise).  XHTML is a stricter than HTML and will use an XML parser instead of a DOM parser, it enforces computer-readable code.  I'm not sure if it is stumbling over the content-type being "application/xhtml+xml" instead of "text/html", or extra definitions in the DOCTYPE to handle entities.

As an XHTML document will be happily parsed by the looser HTML DOM parser of a browser, you can downgrade your response for Twitter.  Just search out "Twitterbot" in the user agent string and serve-up sub-standard code.

2020 Update

It's not just Twitter that fails to handle properly typed serialised HTML.  I've noticed other social-networks such as LinkedIn do it as well.  Is it time to abandon strict coding for the sake of sloppy code?  I'm not convinced yet.

Breaking from the voyeuristic norms of the Internet, any comments can be made in private by contacting me.

Related