Why Google cuts your title by pixels, not characters

The 60-character rule, and why it half works

Almost every guide to title tags says the same thing: keep it under 60 characters. The advice survives because it is roughly right for ordinary text. Mixed-case English at the size Google uses for result titles averages a little over 9 pixels a character, and a desktop title has about 600 pixels to fill, so around 60 characters fit.

But the limit was never in characters. Google’s own documentation says there is no cap on how long a title can be; the title shown in results is cut as needed to fit the width of the device. The cut is made on the rendered line, and characters are only a proxy for it. When the characters are unusual, the proxy breaks.

Same length, different width

These widths are measured with the browser’s text metrics, at 20 pixels in Arial, which is the standard working model for a desktop result title.

Text	Characters	Width
Free invoice generator with PDF export and no sign-up	53	486 px
FREE INVOICE GENERATOR WITH PDF EXPORT AND NO SIGN-UP	53	633 px
40 × the digit “1”	40	387 px
40 × the capital “M”	40	666 px
little illicit filling tilling trellis filings	46	290 px
WORLDWIDE WAREHOUSE MANAGEMENT SOFTWARE	39	530 px

The first two rows are the same words and the same character count. In lower case the title fits with 114 pixels to spare. In capitals it is 33 pixels over the line and loses its ending. A character counter would call both identical. The last two rows show the same effect from the other direction: a title with 7 fewer characters can be almost twice as wide.

The reason is that letters are not the same width at all:

Character	Width at 20 px Arial
lowercase i and l	4.4 px
t, capital I, space, full stop	5.6 px
hyphen	6.7 px
e, n, o, a and the digits	11.1 px
w	14.4 px
m, M	16.7 px
W	18.9 px
em dash	20 px

A capital W costs more than four lowercase i’s. An em dash costs almost as much as two letters, which is a lot for a separator. Capitals, wide letters such as m and w, long numbers and dashes are what push a title over; spaces and narrow letters are nearly free.

What Google actually does with the width

• Desktop shows the title on one line of roughly 600 pixels.
• Mobile uses a narrower column, roughly 490 pixels, but allows two lines.
• Descriptions get about two lines of the same width on desktop and about three on mobile.

These are working models rather than published numbers, and Google adjusts the layout from time to time, which is a good reason to keep some margin.

Truncation always removes the tail. Whatever you write last is what you risk, so the promise belongs at the front and the brand name, if it matters at all, at the end.

Google may also replace your title with different text, taken from the page’s headings or elsewhere, when a title is empty, too long, stuffed with keywords, repeated across many pages or does not describe the page. A clear title that fits, specific to its page, is the version most likely to be left alone.

What this site’s own audit found

The numbers above are easy to quote and easy to get wrong in practice, so here are the ones from this site, measured on all 41 of its pages.

In August a pixel audit of the site’s own titles found 11 that ran past 600 pixels, the worst at 707. They were rewritten, and the longest title now measures 597 pixels. That is deliberately close to the line, which works only because the measurement uses the same font model as the estimate; with a few pixels of difference in Google’s rendering, the last word of that title could go.

The descriptions are a better illustration of the character trap. 9 of the 41 descriptions are longer than 160 characters, the longest being 169. A character-based audit flags exactly those nine, every week. Measured in pixels, the widest is 1,053 pixels, which is two lines on desktop and well inside the three lines mobile allows. The audit is right about the characters and wrong about the thing that matters, which is whether anything is cut.

A safe budget

• Desktop title: stay under about 580 pixels. The extra 20 pixels is margin for rendering differences between operating systems and for the next layout tweak.
• Mobile title: if the desktop title fits, it will normally break onto two lines on mobile without losing words. Check it anyway; a long unbroken word is where it fails.
• Description: keep the whole text under about 1,100 pixels at 14 px, and put the reason to click in the first line.

Measuring it yourself

Open the browser console on any page and paste this:

const ctx = document.createElement('canvas').getContext('2d');
ctx.font = '20px Arial';
ctx.measureText('Your title goes here').width;

The result is the width in pixels. Use 14px Arial for a description. The SERP snippet preview does the same thing as you type, for desktop and mobile side by side, and wraps the description the way a result would.

Mistakes that cost the most pixels

• Trusting a character counter. The green and red bars in many SEO plugins count characters and ignore the width.
• Writing in capitals. As the table shows, it adds nearly a third to the width.
• Spending the first words on the brand. The widest, safest part of the line should carry the promise.
• Decorating with dashes and symbols. An em dash costs as much as nearly two letters. A short separator is enough.
• Translating without re-measuring. The same message can run wider in another language, so each version needs its own check; see the hreflang guide for how to keep the versions paired.
• Forgetting the other cards. Social networks cut shared titles differently from search; the social preview shows each. If you are counting characters for ad copy, where the platforms do count them, use the ad copy length checker instead.