Part 2: Guidelines for clear links, headings and lists

Part 2: Guidelines for clear links, headings and lists

In the work of improving ABC’s website, the project group considers a lot of the design possibilities available on each website. They know very well how important it is to wisely formulate links, headings and lists. They can then maximise visitor’s ability to first find the site and then navigate through it.

They also recognise the importance of removing barriers for all site visitors, regardless of their functional ability. They know that clear headings make navigation easier, and that lists highlight the structure. They start by going through the links on the pages that should remain.

Logical links guide visitors to the right place

While they have prioritised and cleared the pages, the project participants have noticed that many pages contain links that don't say much about where they lead: links like Read more or Click here.

The project team decides to replace all those links and formulates this principle: Write each link so that it has the same name as the title of the page it leads to (target page). The link to the page about ABC’s business, for example, they name, very descriptively, What ABC does. At the same time, they check that the page title of the target page (the one shown in the search results) is What ABC does, and that the main heading on the page is also What ABC does .

Headings empower users

On the actual pages, the project group continues to work on the subheadings. They know that headings are important for both search engines and visitors.

They therefore formulate headings that describe the content and give visitors an overview. Visitors should only need to scan the page to understand what the text contains, and so be able to move on to the section that interests them. The principle they follow is: The headings on a page must describe the content of the sections on the page and be formulated as a statement or a question that is answered directly under the heading. For example, ABC has a page about working at ABC: Working for us at ABC. On this page, they use the headings Vacant positions at ABC, ABC’s values and Meet ABC’s employees.

Stylesheets make pages searchable and give visitors an overview

As the project team goes through the pages, they are careful to format the headings with the style sheets that are available in the publishing tool, instead of just marking the headings with, for example, bold. They do this for the sake of search engines and accessibility. They know that search engines punish Web pages that have unformatted subheadings — and subheadings that do not describe the content.

People who read a webpage with screen readers also need correctly formatted headings. A screen reader can read out all the headings on a page, and thus also give visitors an overview of the page’s various sections — especially if the subheadings describe the content well.

In the guidelines, the project team talks about how the headings should be formatted on ABC’s website.

• Each web page should have a single header with the header tag <h1>.
• The highest level of intermediate headers should have the header tag <h2>.
• Next level should have the tag <h3>.
• If more in-depth heading levels are needed, they should be in the order <h4> , <h5> and <h6>.

Lists highlight content on the page

The project team makes sure to make bullet points where they fit on the web pages. Bullet points help to make the pages clear and highlight what is important on the website.

There are many rules for creating easy-to-read and symmetrical bullet points. The project team knows that the rules can be overwhelming for many writers. They therefore decide to produce three types of bullet points that the writers can use as role models. They urge writers to only use these types.

Type 1: Use whole sentences, both in the introduction and in each point. Capitalise and punctuate as usual. Put a colon after the introduction.

At ABC, we have three main communication channels:

• Facebook is used to promote our products and services.
• On LinkedIn, we communicate company news, but do not sell anything.
• Instagram shows who we are in text and images, with posts about internal activities and customer activities.

Type 2: Start with a full sentence and let each bullet be a word or a few words. Complete the introductory sentence with a colon. Put a period at the end of the bullet list.

We work with the following organisations:

• sports clubs
• non-profit organisations
• cooperatives.
  

Type 3: Make the whole list a single sentence starting with the introduction and ending after the last bullet point.

If you work at ABC, you will receive

• competent colleagues
• regular skills development
• flexible working hours.
  

Continuously improve guidelines

The project team is working on, and is constantly supplementing the guidelines for the website with new advice — now about headings, links and lists. They continuously inform and train everyone who will need the guidelines in the future. Now it is partly new groups that receive training: not only the experts and the small web editorial staff, but also the many people who produce content for the website.

A new wave of relief washes over ABC: “Now we know what to do.”

With guidelines for clear links, headings and lists, you can contribute to these goals

All pages left on the ABC website now have descriptive links, content-rich headings and bullet points that highlight content. But which of the UN’s Sustainable Development Goals has the project group contributed to?

• Goal 7: Sustainable energy for all
  The project has probably reduced ABC’s need for energy by reducing the number of clicks back and forth on the website. With good links and headings, users can find their way straight away.
• Goal 8: Decent work and economic growth
  Employees at ABC have received guidelines that remove stress and help them feel good at work.
• Goal 16: Peaceful and inclusive communities
  The website can now be navigated by everyone, regardless of functional capacity.

Read more about the organisation ABC in parts 1 and 3 of our blog. Part 1 explained how ABC took control of the content on the website. Part 3 deals with the linguistic expression of the website.