How and when we use links, including links in text, links to downloads, templates and external sites.
Writing descriptive links
Descriptive hyperlinks are important — readers want to know where they’re going if they click something.
We use the title of the page we’re linking to — or we describe what’s on the page if the title doesn’t give the user enough context.
- put URLs directly into text
- use ‘click here’, ‘see more’ or ‘more information’ on their own as our hyperlink text — we make sure the link text tells the user what to expect on the new page.
Adding links in text
- put links where they’re useful – directly below the sentence or list they refer to
- use the ‘List of Files’ block if linking to more than one document.
We include the name of the page and the website it’s on, and set the link to open in a new tab.
Who can pay or receive child support? - Inland Revenue
Media release from Children's Minister - Beehive website
We use less descriptive link text if linking to internal pages – we don’t need to include the name of the website, but we try to include the name of the page.
Example – same website:
We include the full phone number in the text. To hyperlink to a phone number use the same process as you would to link to a web page but write 'tel:' before the number.
Talk to us on 0508 326 459 if you're thinking about placing your child for adoption.
Linking to documents
When we add a link using the ALOT block, information about the file’s format and size will automatically be displayed so users know what they're clicking on.
When we link to files or downloads in text, we use the title of the document to create the link text.
If linking to a document on another website:
- We usually link to the page it is on to provide the context.
- If the page on the website has more than one download link, we can link directly to the file (include file type and size).
Links are designed to be accessible and helpful for users' navigation. This includes the following:
- Links do not only rely on colour — they are signified either by an underline or panel.
- Visited links are a different colour.
- There is a clear hover state for links, such as underline or colour change.
- Links to external websites are identified by an external icon.
- Links to download files include the file type and size.
Published: February 25, 2022