Links to phone numbers and email addresses


On this page

When linking to a phone number or email address:

  • Use the phone number’s digits or the ‘bare’ email address as the clickable link text.
  • Ensure the URL address field for the link contains the prefix ‘tel:’ before the full phone number or ‘mailto:’ before the email address.
  • Include a link title indicating who or what that number or email address will reach.

Email and phone links should have consistent presentation so all users have a simple and predictable experience across the University’s web estate.

When email and phone links for contacting the same person or thing are shown together, they should be placed in a bulleted list and be cued with the terms ‘Phone:’ and ‘Email:’. For example:

You can contact the Student Services Centre via:

  • What and why: When a screen reader calls out link text of a phone number or email address, it can be hard for a user to tell who or what they would reach via that sequence of numbers or address. A link title/screen tip makes this clearer while allowing the link text to provide easy access to the phone number or email address for copying into another app/program or device. Applying a link to email addresses and phone numbers retains one-touch usability for many people.

    Return to the top of the page.


    How to

    The University web estate currently has a mix of Jadu types. Setting links to phone numbers and email addresses works slightly differently in each.

    Linking to phone numbers

    How to link to a phone number in older versions of Jadu
    1. Select the phone number you want to use as the link.
    2. Select the link icon in the editor toolbar.
    3. In the ‘Web or Email Address’ field, write ‘tel:’ and then the phone number that should be dialled. For example, ‘tel:+441133438877’.
    4. In the ‘Title’ field, note who or what the phone number is for. For example, ‘Phone the Student Services Centre’.
    How to link to a phone number in Jadu Continuum

    Note: This process may not be possible in all versions of Jadu Continuum used in the University at this time.

    1. Highlight the phone number you want to add a link to and go to the Jadu toolbar and select the ‘Insert Telephone Link’ icon .
    2. In the ‘Telephone Link Properties’ pop-up window, add the telephone number details in the ‘Number as displayed on website’ field and the ‘Link number’ field and press the ‘OK’ button.
    3. Right-click the telephone number on the page to ‘Edit Link’ or highlight the number and go to the link icon on the Jadu toolbar to show the ‘Link’ pop-up window.
    4. Go to the ‘Advanced’ tab and type into the ‘Advisory Title’ field who or what the phone number is for. For example, ‘Phone Student Services Centre’.

    Linking to email addresses

    How to link to an email address in older versions of Jadu
    1. Select the email address you want to use as the link.
    2. Select the link icon in the editor toolbar.
    3. In the ‘Web or Email Address’ field, enter the email address you want to link to. For example, ‘ssc@leeds.ac.uk’.
    4. In the ‘Title’ field, note who or what the email number will reach. For example, ‘Email the Student Services Centre’.
    How to link to an email address in Jadu Continuum
    1. Highlight the email address and go to the link icon on the page editor toolbar.
    2. In the ‘Link’ pop-up window set the ‘Link Type’ drop-down to ‘Email’. Add the email address in the ‘Email Address’ field.
    3. Select the ‘Advanced’ tab and type into the ‘Advisory title’ field who or where the email will go to. For example, ‘Email Student Services Centre’.

    Return to the top of the page.


    Note: It isn’t currently possible to add a link title to phone numbers and email addresses in WordPress.

    How to link to a phone number in WordPress

    1. Highlight the phone number and select the ‘Link’ button in the toolbar.
    2. Select the ‘Link options’ button which looks like a cog.
    3. In the ‘URL’ field type in ‘tel:’ followed by the phone number, eg tel: +44113 3438877.

    How to link to an email address in WordPress

    1. Highlight the email address and select the ‘Link’ button in the toolbar.
    2. Select the ‘Link options button which looks like a cog.
    3. In the ‘URL’ field type in ‘mailto:’ followed by the email address, eg mailto: webcomms@leeds.ac.uk

    Return to the top of the page.


    How to link to a phone number in Word

    1. Highlight the phone number and select the ‘Link’ button in the ‘Insert’ tab of the toolbar, or right-click and select ‘Link’.
    2. In the ‘Text to display’ section, keep the ‘bare’ phone number displayed as on the page.
    3. In the ‘Address’ field, write ‘tel:’ followed by the phone number to dial. For example, ‘tel: +441133438877’.
    4. Select the ‘ScreenTip’ button and note what the link allows a person to do. For example, ‘Phone the Student Services Centre’.

    How to link to an email address in Microsoft Word

    1. Highlight the email address and select the ‘Link’ button in the ‘Insert’ tab of the toolbar, or right-click and select ‘HyperLink’.
    2. Type the email address in the ‘Text to display’ field.
    3. In the ‘Address’ field use the ‘mailto:’ prefix before the full email address.
    4. Select the ‘ScreenTip’ button and note what the link allows a person to do. For example, ‘Email the Student Service Centre’.

    Return to the top of the page.