Meta Tag Generator

A title containing a closing title tag ended the title

The generator escaped the double quote and nothing else — exactly the right instinct for a content="…" attribute, and not enough for the element in between the tags. Six awkward strings, run through both the old escaping and the new one, then read back with a real HTML parser rather than by eye:

Given Read </title> now as a title, the title of the resulting document is Read — one word. Everything from that closing tag onward became loose text in the head. Rare on purpose rather than rare by accident: anyone writing about HTML hits it, and the tool meant to generate correct markup is a poor place to find out.

The other break is quieter and affects both positions. Titles and content attributes both decode character references, so a description written as Fish & chips — because the author wanted those characters on the page — came back as Fish & chips. Nothing errors, no parser complains, the description is simply not the one that was written.

Escaping the ampersand first, then the brackets and the quote, fixes both. The order is not decoration: replacing the brackets first would leave their output for the ampersand rule to escape a second time, and a bracket would arrive on the page as visible text.

What the angle brackets turned out not to need

This is the opposite of what you would guess, which is why it is worth recording.

A title containing <b>everything</b> was already safe. The content of a title element is not parsed as markup — only its own closing tag ends it — so the tag came through as text. A less-than sign in a content attribute was safe too, because it means nothing inside an attribute value. Of the 6 strings above, only 2 broke in the title and one in the attribute.

They are escaped now anyway. A rule with two exceptions in it is worse than a rule, and escaping them costs nothing.

Three of the four Twitter tags are saying it twice

A card reader falls back to the Open Graph tags when the Twitter ones are absent, so most of the Twitter block repeats what has already been said a few lines above.

3 of the 4 say nothing new. twitter:card is the exception: it chooses the shape of the card, and Open Graph has no equivalent. It follows from whether you gave an image — a large card with one, a small one without.

They are still emitted, because some scrapers read only the twitter: names and the cost is three lines. Worth knowing they are three lines of insurance rather than three lines of requirement — and worth knowing which one of the four you cannot remove. A field you leave blank emits no tag at all, rather than an empty one for a crawler to puzzle over.