{"id":3173,"date":"2018-01-22T16:31:03","date_gmt":"2018-01-22T16:31:03","guid":{"rendered":"https:\/\/blogs.kent.ac.uk\/webdev\/?p=3173"},"modified":"2018-07-20T16:22:25","modified_gmt":"2018-07-20T15:22:25","slug":"finding-your-way-around-designing-content-for-staff-and-students","status":"publish","type":"post","link":"https:\/\/blogs.kent.ac.uk\/webdev\/2018\/01\/22\/finding-your-way-around-designing-content-for-staff-and-students\/","title":{"rendered":"Finding your way around: designing content for staff and students"},"content":{"rendered":"

Until now we\u2019ve aimed our web redesign project squarely at externally-focused marketing content. The consumers tend to be prospective students, parents, or other external users looking to find out more about Kent.<\/p>\n

A lot of our content is directed at staff and students. Sometimes the information those people are looking for is also useful for people thinking about working at Kent, or prospective students. So it\u2019s handy to have it on a public website. Other information is definitely for internal audiences only.<\/p>\n

Whether it\u2019s on an intranet or public website, content always needs designing. This blog post outlines how we\u2019re looking to achieve a simpler, flatter, task-based design structure for internal content.<\/p>\n

Finding things quickly<\/h2>\n

We tend to assume people know what they\u2019re looking for. On marketing or e-commerce sites people are often looking for fairly clear types of things: products, contact details, corporate ethics.<\/p>\n

Audiences such as existing students and staff usually need to find out how to do<\/em> things, quickly and easily. They\u2019re not so interested in the things themselves at first<\/em>, because they don\u2019t know enough details. Tasks not things. \u201cHow do I borrow a book?\u201d, \u201cHow do I go about getting a parking permit?\u201d<\/p>\n

Task-driven v object-driven (verbs v nouns)<\/h2>\n

Task-driven content tends to be quite broad in scope, narrowing down to the things you need to find out or get done.<\/p>\n

The first time you apply for a parking permit you won\u2019t have a clue what you\u2019re looking for. Task-based. The second time you might remember the page or form you had to complete. It starts to become object-based.<\/p>\n

Complex tasks might involve all sorts of steps and exceptions. Making this clear is almost always a challenge.<\/p>\n

In our designs we looked to sites like gov.uk<\/a> and nhs.uk<\/a> to see how they organise and structure their content. We concluded the following:<\/p>\n

    \n
  1. Keep the user focused. Don\u2019t show too many related links on the page. People might be looking for something else closely related. If they are, just put a link in the main content.<\/li>\n
  2. Group related pages within a single topic into Guides.<\/li>\n
  3. Keep the information structure flat. Avoid too many complex menus. Users don\u2019t know or care about complex navigation and internal organisational structures. They just want to do something as quickly and easily as possible.<\/li>\n<\/ol>\n

    We tackled (and continue to tackle) these issues as outlined below.<\/p>\n

    Be focused: minimal navigation<\/h2>\n

    We wanted to keep menus and navigation to a minimum, so the user could stay focused on the content. However we also wanted to ensure that each page of content sticks to a single focused theme, rather than branching off to lots of other pages. Some pages might therefore end up fairly long, with quite a few sub-headings.<\/p>\n

    To help with this we\u2019ve adopted a fairly common practice of using a \u2018sticky\u2019 menu of jump links – kind of like a mini table of contents. This allows a user to scroll down a page, all the while able to see a list of key sections on that page, and to jump to them by clicking.<\/p>\n

    \"Screenshot<\/a>
    A right-hand menu for jump links to sections of content on the page.<\/figcaption><\/figure>\n

     <\/p>\n

    Ultimately there has to be some trade-off between number of pages and the amount of content on a single page. There is good evidence that people are happy to scroll through a page to read content, given a reason to scroll. (There are many sources, but this is a good place to start<\/a>.) We\u2019re not too sure yet what exactly our guidance will be on when to break out into a new page. This is one of the reasons why we\u2019ll need to run some trials first.<\/p>\n

    We\u2019ve also tried to reduce the amount of \u2018related links\u2019 menus by encouraging publishers to put any links in highlighted blocks in the main content, rather than in side menus. Users are more likely to see these useful links that way, as they scan through the content.<\/p>\n

    \"A<\/a>
    Related links. We’d encourage people to put relevant and useful links in a highlighted callout block.<\/figcaption><\/figure>\n
    \"A<\/a>
    A callout, with some useful link or important information, in the flow of content.<\/figcaption><\/figure>\n

     <\/p>\n

    As part of the focus on internal audiences we plan to modify the global header and Kent Bar. Basically removing the global navigation menu (\u2018Research, Study, Discover\u2019) from all pages with an internal focus, and simplifying the Kent Bar.<\/p>\n

    \"screenshot<\/a>
    The proposed new Kent Bar showing fewer navigation options, and a global search box.<\/figcaption><\/figure>\n

     <\/p>\n

    Again, this helps users to keep focused on what they need. From practical and aesthetic points of view it also helps free up some space for page titles and Guide headings, so the user can more easily see the key navigation on the page. Users may scroll, but ‘the fold’ – the part of the page users see first – is still important.<\/p>\n

    Guides: based around tasks<\/h2>\n

    We also noticed that internal content is often broken down into groups of pages. For example pages about printing, copying and scanning.<\/p>\n

    In the old theme these tended to be pages and folders within folders. Navigating through the pages would fall to yet another side menu, sometimes getting lost in the noise of side-menus. Sometimes the pages would have further tabs, menus and callouts within the content. It just became too complicated.<\/p>\n

    So instead we\u2019re looking at using what we call Guides. This is something used on the gov.uk site and very simply covers a group of pages based around a single task. An example is a set of gov.uk pages<\/a> which help answer the question: \u201cIs an HE institution officially recognised?\u201d There are various separate issues, categories and parts to answering this question.<\/p>\n

    \"Screenshot<\/a>
    Guides have a heading section listing the pages in the guide. You’ll notice how the large dark blue global navigation bar (the one with the Research, Study, and Discover titles) isn’t there.<\/figcaption><\/figure>\n

     <\/p>\n

    Guides are sometimes – but not always – sequential. They\u2019re sometimes based around an action, and sometimes based around information.<\/p>\n

    Guides have a clear heading section, listing all the pages in the guide.<\/p>\n

    Not all our content need be part of a Guide. We\u2019ll of course still have many stand-alone pages of content. But they will still follow the same principle of focus.<\/p>\n

    Flat structure: services, not organisational structure<\/h2>\n

    Staff and students often want to know how to do something. They don\u2019t – and shouldn\u2019t – care too much about who provides the service. They certainly should not<\/em> care about who published the content telling them what they need.<\/p>\n

    Because of our organisational structure we tend to present content in different ways, depending on who\u2019s responsible for the content. You could say why does that matter? It\u2019s just presentation. But if everywhere on our website has different menus, different ways of navigating, as well as a different style, we\u2019re just making things harder for everyone.<\/p>\n

    The new designs attempt to move away from that kind of fragmentation. Content will still be under the control of different people around the organisation. It\u2019s just that from the user\u2019s point of view the content will appear more homogeneous.<\/p>\n

    Summary<\/h2>\n

    We\u2019ve recently been looking at how we can help make better-structured content which is primarily aimed at internal University audiences. This is work which we\u2019re hoping to refine and experiment with on a couple of projects over the coming months.<\/p>\n

    Our design work uses several key principles:<\/p>\n

      \n
    1. Keep the user focused. Don\u2019t show too many related links on the page.<\/li>\n
    2. Group related pages within a single topic into Guides.<\/li>\n
    3. Keep the information structure flat. Avoid too many complex menus.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"

      Until now we\u2019ve aimed our web redesign project squarely at externally-focused marketing content. The consumers tend to be prospective students, parents, or other external users … Read more<\/a><\/p>\n","protected":false},"author":2,"featured_media":3175,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[79410,79395,79439],"tags":[79464,521,79492,79463,79384,79393,23153,79392],"_links":{"self":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/3173"}],"collection":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/comments?post=3173"}],"version-history":[{"count":7,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/3173\/revisions"}],"predecessor-version":[{"id":3186,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/3173\/revisions\/3186"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media\/3175"}],"wp:attachment":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media?parent=3173"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/categories?post=3173"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/tags?post=3173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}