Guides

Tap-to-Call Above the Fold: The Emergency Setup

How to build tap-to-call on an emergency dental page: the markup, the sticky bar, hours beside the button, the out-of-hours state and the tracking.

5 min read
Tap-to-Call Above the Fold: The Emergency Setup
GuidesDentistsConversion
910 words5 min read

The one element that has to work

A patient with an abscess at nine in the evening has one intention, and it is to speak to somebody. Everything else on the page is secondary to whether the phone number is visible, tappable and honest about when it is answered.

Most practice sites fail this in a boring way. The number is in the header at desktop width and disappears into a burger menu on a phone, or it sits in the footer, or it is baked into a logo image. Here is the setup that works, step by step.

The number has to be an anchor with a tel: href, in international format, with no spaces in the href itself. Spaces and brackets are fine in the visible text.

HTML
<a class="call-button" href="tel:+441614960000">
  <span>Call now</span>
  <strong>0161 496 0000</strong>
</a>

Never place the number only inside an image or an SVG. A patient cannot tap it, a screen reader cannot read it, and Google cannot associate it with your listing.

2. Put it in the first screen, at every width

Above the fold means above the fold on a small phone in portrait, not on your monitor. Test at 360 by 640 with the browser chrome and any cookie banner in place.

The order that works in the first screen is: what you are and where, the call button, the hours line, then the fee and today's availability. Nothing above the button that pushes it down: no full-height hero image, no video, no carousel.

3. Add the sticky bar for the rest of the scroll

Once the patient scrolls into the guidance sections, the button has to come with them. A slim fixed bar at the bottom of the viewport on phones, carrying Call and Book, is the standard pattern and it works.

Keep it slim, give the page bottom padding equal to the bar height so it never covers the last paragraph, and make the tap targets at least 44 pixels tall. Check it does not collide with your cookie banner, which is the single most common way this button is lost.

4. Write the hours next to it, in words

A phone button with no hours beside it creates the call you least want: the one at two in the morning that rings out. Beside the button, in plain words: when the line is answered, and what happens outside those hours.

If you run an out-of-hours rota, say so and say the hours. If you do not, say when you open next and point to the appropriate local urgent dental service. Do not imply cover you do not have.

5. Change the button when you are closed

The strongest version renders differently outside opening hours. During hours it says Call now with the number. Outside them it says the line opens at eight tomorrow, keeps the number tappable in case the patient wants it anyway, and puts the booking button and the out-of-hours route first.

Drive that from the same opening-hours data that feeds your structured data, so a rota change updates the button, the page text and the markup together. Two sources drift within a month.

6. Do not send the call somewhere unfamiliar

Some practices route the site number through a tracking number to measure calls. That is a reasonable thing to want, but check two things first: that the number displayed matches what patients see on your Google Business Profile and other listings closely enough not to confuse anyone, and that the routing does not add a delay or an announcement before the phone rings. A patient in pain hangs up on a menu.

The lighter alternative is to keep your real number and count taps instead.

7. Track the taps

Fire a call_click event on every tap, with the page and the position, header, hero or sticky bar, as parameters. Compare it monthly against the calls reception actually logs.

That comparison is the only way to find out whether the button is being tapped and the line is not being answered, which happens more often than anyone expects on evenings and weekends.

8. Test it as a stranger

On your own phone, on mobile data, in a private window, at night. Tap the number from a search result, from the emergency page, from a social link opened inside the Instagram or Facebook in-app browser. All of them should dial. Repeat after every design change, because a button this important is usually broken by something unrelated.

What the button must never do

It must not open a contact form. It must not scroll to a contact section. It must not be the only route, so keep the booking button beside it for the patient who cannot speak or does not want to.

And any first-aid or what-to-do-now wording near the button is clinical content: it must be written and approved by a clinician at your practice, dated and reviewed. A web team never drafts that.

Where this sits

Tap-to-call in the first screen, sticky through the scroll, with the hours beside it and an honest closed state, is the first thing we build on an emergency dentist website, and it runs through the wider dental practice websites we make. What each package includes is on pricing. If only one thing on the page works, make it this.

All writingSee packages and prices