Put the full address, the entrance, parking and directions in text beside any embedded map, with a plain link that opens the address in a map app. The map can stay, as an extra rather than the only source.

Find us

Many contact pages are built the same way: a heading that says find us, an embedded map with a red pin, and a phone number. The address itself appears nowhere else on the page.

For many visitors that works well enough. They see the pin, recognise the street and tap through to their own map.

For a visitor using a screen reader, the map is mostly noise. On a phone it gets in the way of scrolling. And for anyone who wants to copy the address, it offers nothing to copy.

Who the map leaves out

The fifth group is larger than it sounds. People paste addresses into a taxi app, a text to a friend, or a different map from the one the site embedded, and a map gives them nothing to select.

What a screen reader meets

A screen reader reads a page aloud, element by element.

An embedded map is a frame, a separate page set inside yours. The code copied from a map's share menu usually arrives without a title saying what the frame holds.

So the listener hears that there is a frame, and little else. Inside it is a run of controls: a link to a larger map, zoom buttons, terms of use, a link to report a map error.

The address, if the map shows one at all, sits somewhere among them. A map showing only a pin carries no address in words anywhere.

A keyboard user tabbing down the page passes through the same controls before reaching anything below the map.

On a phone

On a phone, an embedded map usually fills the width of the screen. A thumb scrolling down the page lands on it, and the map either moves instead of the page or asks for two fingers.

Its own links open Google's map, which may be a browser page rather than the map app the visitor uses every day. An iPhone opens addresses in Apple Maps by default; the embedded map does not.

A written address does better here. Many phones recognise an address in text and offer to open it in a map or copy it with a long press.

The address in words

Write the full address as text on the page, near the top: business name, street address, unit or suite, city and postal code, exactly as it appears on your Google listing.

Then add what a map cannot show, which matters most to the visitors it fails: which entrance has no steps, whether there is an elevator, where the accessible parking is, and the nearest bus stop.

Make it real text, not part of an image or a scanned flyer. Text can be read aloud, enlarged without blurring, copied and translated; a picture of an address can do none of that.

Keep the sentences short, and in the order somebody arriving would need them.

A worked example

A denture clinic in White Rock sees mostly older patients. Many come with a family member, and a few use screen readers or magnifiers because of failing eyesight.

Its contact page was a heading, a full-width map and the phone number. The address did appear in the footer, but as part of an image that also held the logo.

The clinic is on the second floor of a building with two entrances. The front one has six steps; the step-free one is at the back, beside the parking. The map's pin sat on the front.

Patients phoned to ask for the address, and staff regularly walked people round from the front steps. A patient's daughter mentioned that her mother's screen reader had read the contact page as a frame and a phone number.

The page now opens with the address in text, then a short section: use the back entrance by the parking for step-free access, two accessible stalls beside the door, elevator to the second floor, bus stop on the corner.

Beneath that are links to open the address in a map app, then the map, now with a title. The footer address became real text.

Links to map apps

A plain link that opens the address in a map app is more useful on a phone than the embedded map itself. It lands the visitor in the map they already know, ready for directions.

Label it with what it does, such as open this address in Google Maps, rather than click here. Screen reader users often jump from link to link, and the label is all they hear.

A second link for Apple Maps can sit beside it for iPhone users.

If the map stays

The map can stay. It is genuinely useful to visitors who can see it, and nothing here argues for removing it.

Give its frame a title that says what it is, such as map showing the clinic's location. Place it after the written address, not before, so nobody has to pass through it to reach the words.

The accessibility standard most rules refer to, WCAG 2.0, asks for a text alternative to non-text content such as a map. The written address and directions are that alternative.

The counter-case

A business that never receives visitors, such as a trade working from a yard customers never see, may need no map at all, only its service area in words.

A site that already shows the address as text on every page has the basic need covered. What is usually still missing is the entrance, the parking and step-free access.

But wherever a map is the only place the address appears, put the address in words beside it.

This week

  1. Find every page with an embedded map.
  2. Write the full address as text above it.
  3. Add the entrance, floor and parking.
  4. Describe step-free access plainly.
  5. Add a labelled link to a map app.
  6. Give the map's frame a title.
  7. Replace any address shown as an image.

Step four matters more than it looks. A visitor who uses a wheelchair or a walker needs to know about the back entrance before setting off, and a map pin cannot tell them.

Another setting a screen reader depends on is covered in the language setting on a bilingual site.


Frequently asked questions

Why is an embedded map not enough?

A screen reader hears a frame and a run of controls, phone visitors find it in the way of scrolling, and nobody can copy an address from a pin.

What should be written beside the map?

The full address as on your Google listing, which entrance to use, the floor and elevator, parking and accessible stalls, the nearest bus stop and a landmark or two.

Should I remove the embedded map?

No. It helps visitors who can see it. Place it after the written address, give its frame a title, and treat it as an extra rather than the source.

How should links to map apps be labelled?

With what they do, such as open this address in Google Maps. Screen reader users often jump from link to link, and the label is all they hear.

Does WCAG cover maps?

Yes. WCAG 2.0 asks for a text alternative to non-text content, and a map is non-text content. The written address and directions beside it provide that alternative.

Why describe step-free access in words?

Because a visitor using a wheelchair or walker needs to know which entrance has no steps before setting off. A pin shows the building, not the door.

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.

Address only inside the map?

Send us your contact page. We will write the address, entrance and parking details so every visitor can use them.

Start a Conversation