Team update: 20 August – 2 September

Posted on 2 September, 2015 by Jiajun

The team’s not back to full capacity just yet due to holidays but there’s still been lots going on over the past couple of weeks…

Go Mobile programme

It was an exciting day yesterday as the first two sites in the programme went live: Information for Schools and Colleges and Open Day.

The Undergraduate site has been successfully tagged and migrated back into T4. Now the real fun begins: checking, fixing, and adding new content and images.

Proofreading of sites begins in earnest: The Law School, Institute for Social Renewal, Biology and Architecture, Planning and Landscape are all being checked to make sure they meet our content standards.

Design & Technical developments

We’ve been making last minute refinements to components and have been finalising the footer design for all sites in phase one.

Training and support

Last week Anne ran two workshops: a T4 CMS workshop for editors of Agriculture, Food & Rural Development and Athena SWAN websites, and the monthly Contribute workshop. She also ran a Site Manager session for editors of the Accommodation website.

We’ve received 35 support requests through the NU Service Helpdesk and have resolved 15 of them.

Campaigns and web developments

Lisa wrote a blog post about when to use expandable content, and has made some updates to the international pages of the Pre-Arrival site.

Linda wrote this month’s newsletter for the blog.

Plans for the next few weeks

September’s going to be a busy month for us as we get ready to launch the remaining sites in phase one of Go Mobile.

We’re also busy planning for phase two of the programme.

Hide or Not to Hide…When to use Expandable Content

Posted on 26 August, 2015 by Jiajun

Expandable content, or an accordion as it is sometimes referred to, is a content type that allows you to show and hide information on a webpage.

When the content is collapsed it appears as a heading on the screen.

After the user clicks on the heading it expands to display hidden content.

Expandable content can be used on both desktop and mobile, or simply on mobile.

In our recent Go Mobile training, there were a few questions about when to use expandable content.

Let’s look at some of the advantages and disadvantages of this content type to help you decide when, or if, you should use expandable content on your site.

Helps reduce scrolling and provides an overview

Expandable content makes content more compact so it helps to reduce page length and scrolling. This is particularly beneficial for mobile devices, where reading is more difficult.

Expandable content also provides an overview of content on a page.

“The mini-IA provided by the accordions helps readers understand the structure of the page and lets them focus on the relevant pieces.”

Hoa Loranger Nielsen Norman group (NNg)

This helps your users decide more quickly whether your page contains the information they’re looking for, and again reduces scrolling.

Direct access

As pointed out by Raluca Budiu (NNg), expandable content also gives people direct access to information rather than forcing them to read content that may not be relevant to them.

This is really useful if you have some content that is specific to certain audiences.

For example, we use expandable content on our Open Day website for the travel page. It works well for this content as people only need to expand the information relevant to them. If people are planning to travel to the University by train they’re not forced to read information about travelling by car and parking in the city.

Similarly, expandable content is used on our undergraduate website to display the range of qualifications accepted for undergraduate degrees. Prospective students only need to click to expand the qualifications that are applicable to them.

Extra click to access information

Giving users the choice to view content is useful, but can be problematic as they may choose not to view your content.

This means that content hidden behind an accordion may not be seen by your users.

“An extra step is required to see the information. Headings and titles must be descriptive and enticing enough to motivate people to “spend” clicks on them.“

Hoa Loranger (NNg)

Since content in an expandable box could be overlooked by your users this demonstrates that essential information should never be hidden.

It’s important that your main messages can still be understood, even if your users don’t click to view your expandable content.

Expandable content can also be frustrating to your users if they need to read all of the information on your page.

“Forcing people to click on headings one at a time to display full content can be cumbersome, especially if there are many topics on the list that individuals care about.“

Hoa Loranger (NNg)

Visual line on the screen

Another issue with expandable content is that it acts as a visual line on the screen.

We found, through user testing, that people often don’t expect content to follow expandable boxes and stop scrolling.

We therefore recommend using this content type near the end of your page if possible.

Summary

There’s no hard and fast rule about when to use expandable content. It’s use depends on the nature of your content and the audiences you’re writing for.

If content is audience-specific then expandable content is a good way to give users direct access to information that is most relevant to them – on both desktop and mobile.

Expandable boxes are also useful for secondary and supplementary content, particularly on mobile, as they save space and reduce scrolling. However, to encourage users to click expandable content it’s crucial that you’re headings are meaningful.

Use this content type sparingly – remember it’s an extra click for users to access hidden information.

If content is essential information and applicable to all of your users don’t hide it.

References

Hoa Loranger, Accordions Are Not Always the Answer for Complex Content on Desktops, Nielsen Norman Group (NNg), 18 May 2014

Raluca Budiu, Direct Access vs. Sequential Access: Definition, Nielsen Norman Group (NNg), 13 July 2014

Jakob Nielsen, Mobile Content Is Twice as Difficult, Nielsen Norman Group (NNg), 28 February 2011

Time and the 24 Hour Clock – Editorial Style Update

Posted on 24 August, 2015 by

We’ve recently updated our editorial style guide to reflect a change in our content standard relating to time.

We’re now using the 24 hour clock to represent times on our website. We find it’s better for international audiences and for displaying time in lists and tables.

See the full update to our editorial style guide on our website (University login required).

Team Update: 6 – 19 August

Posted on 19 August, 2015 by

The last two weeks seem to have passed by in a blur, here’s what we’ve been up to.

Go Mobile programme

All sites in the first phase are nearing completion.

Lisa has been working with the editor of the Open Day website to finalise content updates. Linda proofread the Open Day site – it’s looking good!

Emma C has been testing out a new content type for profiles on the Institute for Ageing site. And is making final preparations for the Schools and Colleges website to go live.

Lisa has proof read the Schools and Colleges website. Anne is proofreading the Research website.

Steve is working with the Digital Institute to create a new responsive website.

Planning for phase two of the Go Mobile programme is underway.

Design & Technical developments

The design and build of components is almost complete. We have added an image gallery and carousel function to allow us to display multiple logos on sites.

We are making last minute refinements and planning for the re-import of some content (such as news, events and staff) before the sites go live.

Training and support

We’ve hosted two Go Mobile drop-in sessions. Anne’s also run a couple of short Sitemanager sessions with editors from CEAM and Accommodation.

We’ve received 34 support requests through the NU Service Helpdesk and have resolved 23 of them.

Campaigns and web developments

Business as usual never stops.

We ran Clarity Grader reports on the Postgraduate site. This will help for the Postgraduate Team to improve the readability of their content.

There have been ongoing updates to the Clearing website as Clearing and Adjustment takes over the University!

We’re providing support to the Conference team to help improve the structure of their site.

Steve is working with the International Relations team on a new website to showcase the breadth of international connections and partnerships.

Emma B has produced a new site for Philosophical Studies as it moves from SAgE to the HaSS Faculty.

Our plans for the next few weeks

Lisa is writing a blog post about when to use expandable content.

Anne will be running another T4 CMS training session, as well as the monthly Contribute workshop.

We’ll begin tagging the undergraduate site for migration into the new content types in T4.

And the holidays continue.

How Meaningful Titles and Descriptions Engage Site Visitors

Posted on 17 August, 2015 by

As we move into our responsive design (and T4), we’re introducing ways to make our content work better for mobile and tablet users.

This means that our editors are changing the way they write web ‘pages’. In fact, let’s scrub that. The web page doesn’t exist anymore.

You are not writing for desktop.

The way the content looks on your computer, in your browser, is not the only way that it will look.

Writing for our new responsive design

Some of our new content types have different behaviour depending on where they are used.

You should always check your content on other devices (or use this handy responsive design emulator).

Titles and navigation

Titles as a style aren’t new, but are important when writing content for smaller screens. They might be the only thing your reader sees. They can also appear as navigation and part of search results.

It’s important that what you write makes sense out of context.

News items called ‘Congratulations’ and sections called ‘Additional Information’ aren’t going to encourage people to read more.

Teaser content

We’ve introduced teaser content into some of our new content types. It’s used here as the text overlay on the Masthead.

It’s important that it’s meaningful. It should summarise the page content as it displays in this order on mobile:

This content could be the difference between someone reading the page or going somewhere else.

Descriptions

We’ve used descriptions in news and events for years:

Adding a short description to the news content types doesn’t appear on the news article page. It does appear in all sorts of other places where news is syndicated:

News grids
News lists

This micro content acts to entice your site visitor to read more – it needs to work for you.

This example is vague:

Title: Call for Papers
Description: Submit now

This example gives some context, you know if it’s for you and if it is, you want to read more:

Title: Call for Papers: Environmental Planning
Description: Submissions close on 31 October. The School encourages researchers to read the submission requirements.

Introductions

We’re aiming to make sure all core pages to have an introduction. The intro style works well on mobile. It pulls out (and styles differently) the first piece of content.

We recommend a focused 50-word statement about what the page covers. It helps users decide whether to read more. (50 words sit well as a chunk of content viewed on most mobile screens.)

Expandable/mobile collapse

We’ve a new expandable content style that allows us to hide content. Users have to choose to select to read the content – they can’t see it at a glance.

This means that the heading you choose for the content is important:

We don’t want to see vague terms like ‘More information’, ‘Additional details’, ‘Other’. If the content contains details about your facilities call it ‘Facilities’ or even better ‘Libraries and laboratories’.

Using terms that are more specific, help your readers find what they need.

Write chunks of content

We’ve had some comments about how it feels more complicated and takes longer to build up web content.

Writing for mobile forces you to think about the order of your message.

We could have slapped a responsive template on your desktop-focused content. If content was too long we could have hidden it in expandable boxes (or truncated lengthy titles).

The page would still look okay on desktop (it wouldn’t work very well on mobile).

Rewriting your content and thinking about how people read on mobile, makes sure your users don’t get a sub-standard experience.

Everyone who wants to read your message, can.

Get in touch

Let us know if you need help in reworking your content (University Login required) or post questions in the comments.