An Accounting Office Site That Only Works in Internet Explorer

The site

A small accounting office in a row of professional offices: two partners, a bookkeeper, personal and small business returns. Its website was built about eight years ago and has barely changed.

The home page has a grey banner, a row of drop-down menus for services, and a button marked Upload Your Documents. The footer says the site is best viewed in Internet Explorer.

On the office's own computers everything works. The menus drop down when the mouse passes over them, and the upload form sends scanned slips to a folder on the server.

On a client's laptop running Chrome, or on a phone, the menus do nothing and the upload button does not respond.

The inference a visitor makes

A client has spent an evening scanning T4 slips and receipts. She chooses the files, types her name, presses Upload, and nothing happens: no message, no error, no confirmation.

She presses it again, then gives up and emails the files, or drops them off at lunch. Either way, she now wonders what else at the office is out of date.

For a firm trusted with incomes, bank details and social insurance numbers, that impression matters. Clients judge care with their information partly by what they can see.

What breaks outside one browser

The site was only ever tested on the office's own computers, which all run Internet Explorer. Elsewhere, several things fail:

• The drop-down menus, which open only through code written for Internet Explorer.
• The upload form, whose submit button runs a script other browsers stop on.
• The layout, which relies on an old display mode and shifts elsewhere.
• Phones and tablets, which have no mouse to hover with.
• The footer badge, which tells every other visitor they chose the wrong browser.

None of this shows up in the office, which is how a site like this lasts for years.

A menu written for one browser

The menus date from a time when developers often wrote separate code for each browser. This menu checks for a feature only Internet Explorer has, and runs only if it finds it.

In Chrome, Firefox and Safari the check fails, and the code has nothing else to try. The headings stay as plain text, and the pages beneath them cannot be reached.

Current menus are built from ordinary links, styled with CSS that every browser reads the same way. If a script fails or is switched off, the links underneath still work.

An upload form that stops at the first error

The upload form runs a short script to check the fields before sending. The script uses commands that only Internet Explorer understands.

Other browsers reach the first such command, stop the script, and never get to the line that submits the form. The error shows only in the browser's developer console, which no client opens.

The fix is a form that submits as plain HTML on its own, with checks written in standard code and repeated on the server, where they cannot be skipped.

An old display mode for the layout

The pages ask Internet Explorer to display them the way an older version did, a setting added when newer versions began breaking older sites. Other browsers ignore that request.

They lay the page out by current standards instead, and boxes positioned for the old mode overlap or drift. On some screens the upload button sits partly under the sidebar.

Nothing works by touch

A phone has no mouse, so a menu that opens on hover has nothing to respond to. A tap follows the heading's own link, if it has one, or does nothing.

The layout is fixed at desktop width, so the phone shrinks the whole page, and the upload form's small fields need zooming before anyone can type in them.

Many clients would rather photograph a slip and send it from the phone. A form that works there saves them a trip to the scanner.

A worked example

An accounting office with two partners in a commuter town heard from clients in February that the upload button did nothing. A partner tried the site on her own tablet and saw the same.

The developer who built the site had retired. A new developer tested it in four browsers and on two phones, and found the menu script, the form script and the old display setting.

With tax season under way, the upload form came first. It was rebuilt as a plain HTML form on a secure connection, with checks on the server and a confirmation page listing the files received.

The menus were rebuilt the following week as ordinary links styled with CSS, and the footer badge was removed. A full redesign for phones is planned for after the filing deadline.

Each part now relies only on what every current browser shares, so a client's choice of browser or device no longer decides whether the slips arrive.

One browser in the office, many outside it

Single-browser sites usually come from testing only on the office's own computers. Every change should now be checked in Internet Explorer, Chrome, Firefox and Safari, and on an iPhone and an Android phone.

Windows XP stops receiving security updates on April 8, and many offices are replacing older computers this spring. Newer versions of Internet Explorer may not run the old code the same way either.

The counter-case within the site

Much of the old site is worth keeping. The service descriptions are accurate, the fees page is clear, and the phone number and office hours are easy to find.

Rebuilding the menus and the form keeps all of that. The office does not need a new site to fix this; it needs the two broken pieces built to the standards every browser follows.

A redesign for phones is still worth planning, once the busy season is over rather than squeezed into March.

What to change

1. Open the site in Chrome, Firefox and Safari.
2. Try the menus on a phone and a tablet.
3. Send a test upload from each browser.
4. Rebuild the upload form as plain HTML on a secure connection.
5. Rebuild the menus as ordinary links styled with CSS.
6. Remove the badge naming one browser.
7. Test every change in several browsers before it goes live.

Step four comes first in tax season. The upload form is where clients hand over their documents, and it has to work on whatever they happen to own.

Why an upload page on the firm's own site is a better home for tax slips than email is set out in client documents too large for the office mailbox.

Frequently asked questions

West Coast Media Solutions Inc. provides web design, web development, hosting, digital marketing, and business consulting to organisations across Canada, drawing on more than twenty-five years in the field.