Improving Page Titles and Headlines

Linda recently posted about how meaningful titles and descriptions engage site visitors. Her post covered the importance of micro content in enticing people to read your content – particularly since content is displayed differently depending on the device used.

In this post I’m going to focus on how you can improve page titles and headlines to help people find your page and encourage them to read it.

Page titles should be clear and descriptive

Page titles help convey your primary message; its important they are clear and descriptive. This is so that your reader can quickly see what your page is about.

As argued by Jakob Nielsen, online headlines are different to printed headlines because they are used in different ways.

In print a headline is tightly associated with photos, decks, subheads, and the full body of the article, all of which can be interpreted in a single glance.

Jakob Nielsen, NNg

The contextual information that accompanies a printed headline means that it can afford to be cleverer and less descriptive. However, as pointed out by Nielsen, online headlines can appear out of context. For example they could appear in search results, news feeds, social media or navigation.

Headline text has to stand on its own and make sense when the rest of the content is not available

Jakob Nielsen, NNg

Since your page title could be displayed in a number of different places, and on a number of different screen sizes which may reduce the amount of information displayed, it’s essential they make sense out of context.

It’s also best if headlines don’t contain jargon or wordplay. For example, take a look at this example headline:

‘Cutting-edge Research’

This is vague and could be about any topic and relate to any organisation. It’s meaningless on its own as it provides no indication of what the content will be about.

Now take a look at this title:

‘Newcastle Student Unearths Rare Roman Jewellery’

This title is much more descriptive and gives a clear idea of what the article will be about. The reader can then quickly decide whether the content will be useful or of interest to them.

You only have precious seconds to grab your reader’s attention and if you waste those seconds forcing them to fathom out what your title means, they’ll lose patience and leave without reading your content.

Begin with key words

To help with search engine optimisation (SEO) your page titles should contain keywords.

For example, it’s unlikely that a vague title like ‘Students’ Union’ will appear high in search results. It will be competing with other universities who will be using the same general phrase. If we tweak the title to ‘Newcastle University Students’ Union’ this will help with SEO because the title is more specific. People will be more likely to find your page if your title contains words used by your readers.

It’s better if keywords appear at the beginning of your titles if possible, as this will help with scan reading.

Moving keywords to the front of titles increases the likelihood that they get noticed

Hoa Loranger, NNg

Eye tracking research conducted by the Nielsen Norman group shows that people read differently online in an F shaped pattern, and tend to see the first two words in a sentence.

Keep page titles short

Keeping page titles concise will also help with scan reading. Our recommendation for page titles is 50 characters (including spaces). This might not sound like many words to play with, but remember that your page title could be viewed on a small screen. If it’s too long it will run over several lines; making it much harder to read and understand.

Headline Analyzer tool

In Corporate Web Development we use a free online tool called Headline Analyzer to help write headlines for blog posts.

As shown from the screenshot below you simply type your headline into the headline field and click the ‘Analyse Now’ button. You’ll then be given a score for your headline and tips on how to improve it.

Screenshot of Headline Analyzer tool

Admittedly this tool is more useful for writing headlines for blogs than webpages. However, what I find helpful is the chance to see how my page title will look in search results. This helps me decide whether it will make sense out of context:

Screenshot of a headline displayed in search results using the Headline Analyzer tool

Have a go and see what you think!

Summary

What you call your page is crucial in helping people find it. If you use keywords that your readers will be using and if a title is descriptive of your content this will help with SEO. Furthermore, the more descriptive a page title is, the more likely people will select and read your content. This is because they will be able to quickly see whether the content is relevant to them and will help answer their questions.

References

Jakob Nielsen, Microcontent: How to Write Headlines, Page Titles, and Subject Lines, Nielsen Norman Group (NNg), 6 September 1998

Hoa Loranger, Headings Are Pick-Up Lines: 5 Tips for Writing Headlines That Convert, Nielsen Norman Group (NNg), 9 August 2015

Related posts

Share this post:
Share

How to Create a Customised Google Analytics Dashboard

Most of the conversations I have with our web editors about Google Analytics start like this:

Editor: I’ve got access to Google Analytics but I didn’t know where to start. There’s so much data, it’s overwhelming!

Me: We know how daunting Google Analytics can be, so we’ve created a standard dashboard you can copy and customise to get all the key metrics for your website.

It’s true. With our standard dashboard you can get data on:

  • how people are getting to your site
  • the keywords people are using to find your site
  • what devices people are using to access your site
  • the location of your audience
  • your most popular pages
  • the total number of visitors to your site
  • whether your visitors are new or returning

Here’s an example of what your dashboard will look like. This one is set up for the About section of the University website.

Customised Google Analytics dashboard for www.ncl.ac.uk/about

Customised Google Analytics dashboard for www.ncl.ac.uk/about

Once you’ve got the dashboard set up you can:

  • view data for different time periods
  • download the report as a PDF
  • schedule reports to be emailed to you on a regular basis.

The first step to getting the dashboard is to request access to the University’s Google Analytics (University login required). Once you have access you can customise the standard dashboard for your website. We’ve got step-by-step instructions on how to do this, plus a demo video on our website (University login required).

Our next post will cover how to make use of the data in your dashboard. If there are other analytics topics you’d like us to cover please leave us a comment below.

Share this post:
Share

Editing Images for Use on Your Website

Last week, Jane wrote about how to improve your website images and videos. Her post focused on image selection and placement. Go and read it if you haven’t already, it’ll set you up for what’s to come.

Welcome back.

In this post I’m going to cover some tips for editing images for your website.
Our new template has a much more visual feel than our current design. There are a number of ways you can use images to enhance your written content.

Grids

These can include landing page and news grids.

Example of a homepage gridMastheads

Mastheads provide a visual opener to a page. The image slider used in our current design gives a similar effect.

Example of a mastheadIt’s a full width image with a text overlay. This means that you need to think carefully about where the focus of your image lies. If it’s on the left of the picture then it’s going to be obscured by the text. We’ve got a visual guide to the safe zones which highlights where the danger areas are.

Details of safe zones for a masthead imageThe safe zones logic applies to the image slider in the existing template too. An example of this in use is the Newcastle University London website.

Content images

You can also add images into the main content area. The default alignment for these is on the right (like our current design). On mobile they stretch to fill the full width and flow below the content.

This behaviour requires landscape images. If you’re using our current template we recommend you use landscape images too – this means your images are more likely to be reusable in the new template.

Tools for cropping and resizing images

We’ve assessed a variety of online photo editing tools and found one for you that’s easy to use and retains the high quality of your original photography. It’s called Fotor.

See our image guide (University login required) for details of the required sizes for each type of image and a step-by-step guide to using Fotor.

Share this post:
Share