Taking Our Own Medicine: What We Found When We Audited Our Own Website

We spend a lot of time telling people to look at their websites properly. Not glance at them — actually look: run the audit, read the warnings, check it on a phone. It's good advice. It turns out we hadn't taken it ourselves in a while.

So this week we put our own site through the same checkup we'd give a client's. The medicine works. It's just a little humbling when the patient is you.

The Checkup

The first pass was an automated audit, the kind of tool that crawls every page and reports back. It came back with 133 search engine issues, nearly a thousand HTML validation warnings, and a letter grade for our security setup: F.

That last one stung. We sell security audits.

Not Every Warning Is a Problem

Here's the first thing worth knowing about audit tools: they're very good at finding things and very bad at telling you which things matter.

Most of our 133 search issues weren't on our site at all. They were on old archived copies of retired client sites that we keep online so the portfolio can link to them — pages that were already hidden from search engines and were never going to rank for anything. Once we told the tool to skip them, the real list was short.

The validation warnings were even more misleading. The tool turned out to be checking our pages against rules from 2006 — before modern HTML existed — and reading our text in the wrong character set, so every em dash and curly quote showed up as an “invalid character.” Hundreds of warnings, almost none of them real.

None of that is a reason to ignore an audit. It's a reason to have someone read it who knows which warnings to act on. A raw report with a scary number at the top tends to produce one of two reactions: panic, or giving up. Neither one fixes anything.

What Was Actually Wrong

Under the noise, there was a real list, and it was the same list we find on client sites all the time:

• Page titles and descriptions that were too long, so search results cut them off mid-sentence.
• A page search engines could find that they shouldn't — an easter egg, of all things.
• Broken markup: a link that never closed, a stray quotation mark, a button inside a link. Invisible on screen, confusing for screen readers.
• Form fields on the contact page that weren't explicitly tied to their labels.
• No security headers at all. That was the F.

Security headers are small instructions a website sends to your browser: only ever connect to me securely, don't let other sites wrap me in a frame, don't guess what kind of file this is. They take an afternoon to set up properly, they cost nothing, and most small business sites don't have them. Ours didn't either. Now it does.

After a couple of rounds, the search issues went from 133 to zero.

The Wall of Text

The audit didn't flag the biggest problem, because no tool would. Our site was a wall of text.

Not because there was too much of it — most pages were a normal length. The problem was shape. There wasn't a single bulleted list anywhere on the site. Most of the service pages had no images at all. Our IT Services page was twenty-two paragraphs in a row, and the “cards” meant to break it up were just more paragraphs in boxes.

We briefly considered going all in and turning the whole site into an old Mac desktop, with icons to double-click and windows to drag around. It would have been fun for about a minute, and then it would have been a site nobody could use on a phone, sitting under a pitch that says technology shouldn't be confusing. So we went smaller.

The site already looked like a classic Mac, so we built a handful of pieces in the same spirit and used them to break pages up: windows with title bars, sticky notes for the short version, Get Info panels for the facts, checklists instead of paragraphs, and alert boxes for the things that matter. The IT Services page went from twenty-two paragraphs to six — and here's the interesting part — the word count barely changed. Same information, better shape. People don't read web pages, they scan them, and you have to give them something to scan.

We also gave the portfolio its own page, because it's (hopefully) going to keep growing, and we let a little more personality in. Read the About page closely and there's a robot and a tuba involved.

The Bugs Nobody Reported

Redesigning every page meant looking at every page, on every screen size, and that turned up a handful of bugs that had been sitting there quietly.

The best one: on a phone, the menu bar was wider than the screen, so “Blog” and “Contact” were sitting just off the right edge. The page still loaded. Everything looked fine. You just couldn't easily get to the contact page from a phone, which for a small business website is roughly the one job it has.

Nobody had told us. Nobody tells you. Visitors don't file bug reports; they just leave.

The Point

None of this was dramatic. Nothing was hacked, nothing was down, nothing was on fire. That's exactly why it had been sitting there: a site that mostly works doesn't ask for attention. The problems only show up when somebody goes looking on purpose.

If you'd like somebody to go looking at yours, that's what our security and SEO audits are for. We'll run the tools, read the results so you don't have to, and tell you plainly which parts matter.

Come Have a Look

The best way to see what changed is to click around. A few places to start:

• The home page, where the old wall of text is now a handful of windows and notes.
• IT Services, the twenty-two-paragraph page. It's six now.
• Our Work, the portfolio's new home.
• About, for the robot and the tuba.
• Any page, refreshed a few times. The desktop pattern behind the site changes each time, the way old Macs let you pick your own.

And if you find something we missed, let us know. We'd rather hear it from you than from an audit tool.