{"id":2485,"date":"2016-06-10T14:51:25","date_gmt":"2016-06-10T13:51:25","guid":{"rendered":"https:\/\/blogs.kent.ac.uk\/webdev\/?p=2485"},"modified":"2017-07-07T14:00:31","modified_gmt":"2017-07-07T13:00:31","slug":"building-well-designed-content","status":"publish","type":"post","link":"https:\/\/blogs.kent.ac.uk\/webdev\/2016\/06\/10\/building-well-designed-content\/","title":{"rendered":"Building well-designed content"},"content":{"rendered":"<p class=\"lead\">Good content can be designed well, to fit both the needs of the person consuming it and the needs of the business providing it. Here are some tools to help you.<\/p>\n<p><span style=\";\"><strong><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Building-content-research.pdf\">Download worksheet (1.4MB)<\/a><\/strong><\/span><\/p>\n<p>It\u2019s easy to see design in terms of how pretty things look. And yet I think people are intuitively aware that something is well designed only\u00a0when it\u00a0fits what they need it to do. If you\u00a0need it to look good, that\u2019s good design. If you\u00a0need it to be functional, that\u2019s good design too.<\/p>\n<p>Good web content is no exception. It can be designed well, to fit both the needs of the person using\u00a0it and the needs of the person or business\u00a0providing it.<\/p>\n<p>This blog post lists some tools and techniques that I\u2019ve found helpful in making well-designed content. It\u2019s not an exhaustive list, and may even be overkill for your needs.<\/p>\n<p>A lot of the ideas here were inspired by Meghan Casey\u2019s excellent <a href=\"http:\/\/thecontentstrategytoolkit.com\">Content Strategy Toolkit<\/a>, and a <a href=\"http:\/\/2016.uxlondon.com\/speakers\/ellen-de-vries\">brilliant UX London 2016 workshop<\/a> by Ellen de Vries.<\/p>\n<h2>Personas &#8211; who are your users?<\/h2>\n<p>Understanding your users is one of the keys to great content.<\/p>\n<p>And yet understanding the world from another person\u2019s point of view is one of the hardest things we ever have to do in life. This is what makes design and UX so interesting, and why we need techniques and tools to help us take a step back.<\/p>\n<p>Central to thinking about users is building up a picture of a typical set of imaginary users &#8211; personas.<\/p>\n<figure id=\"attachment_2489\" aria-describedby=\"caption-attachment-2489\" style=\"width: 750px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.14.54.png\" rel=\"attachment wp-att-2489\"><img loading=\"lazy\" class=\"wp-image-2489\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.14.54-1024x618.png\" alt=\"Kent's 7 key personas\" width=\"750\" height=\"453\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.14.54-1024x618.png 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.14.54-300x181.png 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.14.54-768x464.png 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.14.54.png 1418w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/a><figcaption id=\"caption-attachment-2489\" class=\"wp-caption-text\">Kent&#8217;s 7 key personas<\/figcaption><\/figure>\n<p>&nbsp;<\/p>\n<p>At Kent we have 7 primary personas, although you could make up more for specific types of content. For example, you could have several prospect personas for content focussed on undergraduate courses and lifestyle.<\/p>\n<p>Key things to think about when you make your own persona are:<\/p>\n<ul>\n<li>Name, age, job<\/li>\n<li>Their environment<\/li>\n<li>What brands do they identify with?<\/li>\n<li>What do they fear?<\/li>\n<li>What are they preoccupied with?<\/li>\n<\/ul>\n<h2>Users &#8211; the 5 golden questions<\/h2>\n<p>Here are 5 questions to ask yourself when you think about your users. Obviously in reality everyone is coming to your website for subtly different reasons, but this exercise will really help you try to view things from someone else\u2019s point of view.<\/p>\n<ol>\n<li>What are they skeptical about in relation to what you offer?<\/li>\n<li>What problems do they have in relation to what you offer?<\/li>\n<li>Why are they coming to your site?<\/li>\n<li>What\u2019s changed for them now they\u2019ve found your site?<\/li>\n<li>What would their life be like if they listened to you?<\/li>\n<\/ol>\n<h2>Content compass &#8211; what do we want users to think about us?<\/h2>\n<p>Great content also needs to fulfil certain business needs. After all your site is ultimately going to be \u201cselling\u201d something.<\/p>\n<figure id=\"attachment_2043\" aria-describedby=\"caption-attachment-2043\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2015\/07\/Screenshot-2015-07-17-16.37.24-e1437579073183.png\" rel=\"attachment wp-att-2043\"><img loading=\"lazy\" class=\"wp-image-2043 size-medium\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2015\/07\/Screenshot-2015-07-17-16.37.24-300x164.png\" alt=\"An example of building a content compass\" width=\"300\" height=\"164\" \/><\/a><figcaption id=\"caption-attachment-2043\" class=\"wp-caption-text\">An example of building a content compass<\/figcaption><\/figure>\n<p>The content compass helps us to start to look at the relationship between the business and the users, and\u00a0helps us define in broad terms where we stand, and how we want our users to think of us.<\/p>\n<p>I&#8217;ve written a <a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/2015\/07\/22\/content-compass\/\">blog post about the content compass<\/a>\u00a0if you&#8217;d like to find out more.<\/p>\n<h2>Data analysis &#8211; what are our users actually doing?<\/h2>\n<p>Assuming you already have a website or some kind of online presence, you\u2019ll need to know what people make of your existing content.<\/p>\n<p>Some easy and useful data you can pull out from google analytics would be\u2026<\/p>\n<h3>Quick stats<\/h3>\n<ul>\n<li>Pageviews\/sessions per year<\/li>\n<li>Time on page<\/li>\n<li>Bounce<\/li>\n<li>Exit<\/li>\n<li>Age<\/li>\n<li>UK\/EU vs Overseas<\/li>\n<\/ul>\n<h3>Journeys<\/h3>\n<ul>\n<li>Previous pages<\/li>\n<li>Entrances vs Previous pages<\/li>\n<li>Next pages<\/li>\n<\/ul>\n<p><strong>Drawing too many conclusions from data alone can be dangerous<\/strong>. A common mistake is to assume that <em>pageviews = value<\/em>. It absolutely does not.<\/p>\n<p>A page with relatively low visibility but rich in information for an important sub-group of users could be a key\u00a0goal.<\/p>\n<p>Another common mistake is to <a href=\"http:\/\/uxmyths.com\/post\/746610684\/myth-21-people-can-tell-you-what-they-want\">ask people what they want, and assume they know the answer<\/a>.\u00a0Very often people only pretend to know what they want. They are actually desperate for someone to help them figure this one out!<\/p>\n<p>Ultimately you\u2019ll need to do three things to get well-designed content:<\/p>\n<ol>\n<li>talk to your users <strong><em>and<\/em><\/strong><\/li>\n<li>use analytics data <strong><em>and<\/em><\/strong><\/li>\n<li>experiment. Luckily for you the web is a very flexible medium. Don\u2019t be afraid to try things out for a while and see what happens. If it doesn\u2019t work out, look at the data. Talk to your users. Figure out what\u2019s not working and try something else!<\/li>\n<\/ol>\n<h2>Key goals<\/h2>\n<p>So by now you\u2019re starting to understand your users, and you\u2019re clearer about how you want them to see you.<\/p>\n<p>The next step is to think about what you want your website to <strong><em>achieve<\/em><\/strong>, and what your users want to get out of your website. There may be lots of different needs here, so how do you prioritise them?<\/p>\n<ol>\n<li><strong>focus on things that are important to both you and your users<\/strong>. An example might be a product catalogue. It should be very easy and very obvious to your users how to find your products.<\/li>\n<li><strong>drive users to content which is important to you<\/strong>. An example might be talking about your global reputation, awards, or valued testimonials. People might be interested in this, but will likely need a little sugar-coated coaxing to view it and care about it. Whatever you do, do <em>not<\/em> add a link to you homepage along the lines of \u201cwe\u2019re amazing\u201d and expect people to care. In these hardened and cynical times you\u2019ll just have to work harder than that!<\/li>\n<li><strong>guide users to content only they care about<\/strong>. An example could be complaints, refund procedures, or information on delivery costs. This isn\u2019t something your business may want to prioritise, but users will want to see it and will thank you for making it easy to find. So you should guide them there in an appropriately caring way.<\/li>\n<li><strong>meh<\/strong>. This is content which no one is particularly bothered about. It\u2019s a very low priority and shouldn\u2019t really even be on your website. Nonetheless, it\u2019s amazing how many websites have a <em>lot<\/em> of this sort of content.<\/li>\n<\/ol>\n<h2>User scenarios<\/h2>\n<p>You can use key goals in a series of user scenarios to start to really tie together your personas, users, and data.<\/p>\n<p>At all times, keep asking yourself: <em>\u201cWho are these people and what are they trying to do?\u201d<\/em><\/p>\n<figure id=\"attachment_2492\" aria-describedby=\"caption-attachment-2492\" style=\"width: 750px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.28.png\" rel=\"attachment wp-att-2492\"><img loading=\"lazy\" class=\"wp-image-2492\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.28-1024x621.png\" alt=\"user scenarios worksheet example\" width=\"750\" height=\"455\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.28-1024x621.png 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.28-300x182.png 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.28-768x466.png 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.28.png 1458w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/a><figcaption id=\"caption-attachment-2492\" class=\"wp-caption-text\">user scenarios worksheet example<\/figcaption><\/figure>\n<h2>Core model<\/h2>\n<p>Now you have a really good idea of who your users are, what kinds of tasks they\u2019re trying to do, how they view your business and how your business wants to be viewed. You even know the sorts of content that you need to prioritise.<\/p>\n<p>Time to build a core model. This is a really great tool <a href=\"http:\/\/www.slideshare.net\/aregh\/corepaths-a-design-framework-for-findability-prioritization-and-value\">presented\u00a0by Are Halland\u00a0at the IA Summit 2007<\/a>. Ida Aalen has provided\u00a0<a href=\"http:\/\/alistapart.com\/article\/the-core-model-designing-inside-out-for-better-results\">a really nice discussion of the core model<\/a>\u00a0on A List Apart.<\/p>\n<figure id=\"attachment_2493\" aria-describedby=\"caption-attachment-2493\" style=\"width: 750px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.38.png\" rel=\"attachment wp-att-2493\"><img loading=\"lazy\" class=\"wp-image-2493\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.38-1024x704.png\" alt=\"core model worksheet example\" width=\"750\" height=\"515\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.38-1024x704.png 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.38-300x206.png 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.38-768x528.png 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2016\/06\/Screenshot-2016-06-10-10.15.38.png 1528w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/a><figcaption id=\"caption-attachment-2493\" class=\"wp-caption-text\">core model worksheet example<\/figcaption><\/figure>\n<p>&nbsp;<\/p>\n<p>You can start to focus on content with the core model. It\u00a0helps you think about:<\/p>\n<ol>\n<li>who is using the content and what task are they involved in.<\/li>\n<li>what are the business goals around this content?<\/li>\n<li>where have your users come from to get to this content?<\/li>\n<li>where are they going next?<\/li>\n<li>how do you focus users on primary goals? How do you drive people\u00a0to things that are important to you, and guide people to things that are important to them?<\/li>\n<li>what\u2019s the priority of content and messages within the page itself? How would you order things if you had limited space on a mobile device?<\/li>\n<\/ol>\n<h2>Summary<\/h2>\n<p>I&#8217;ve shown a process you can go through to help you create better content. You can apply some or all of these steps to your content. They don&#8217;t have to work sequentially, although I&#8217;ve tried to present them in an order that makes sense to me!<\/p>\n<ol>\n<li>Personas and Users. The 5 Golden Questions.<\/li>\n<li>Content compass. Helping you\u00a0work out how you\u00a0want people to think of you.<\/li>\n<li>Data analysis. Quick ways to work out how people are using your\u00a0existing content.<\/li>\n<li>Key goals. How to prioritise your content.<\/li>\n<li>User scenarios. What are people trying to get done?<\/li>\n<li>The Core Model. Pulling it all together.<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Good content can be designed well, to fit both the needs of the person consuming it and the needs of the business providing it. Here are some tools to help you.<\/p>\n","protected":false},"author":2,"featured_media":2487,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[79447,79395],"tags":[569,79464,521,79463,23153,79392],"_links":{"self":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/2485"}],"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=2485"}],"version-history":[{"count":11,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/2485\/revisions"}],"predecessor-version":[{"id":2765,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/2485\/revisions\/2765"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media\/2487"}],"wp:attachment":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media?parent=2485"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/categories?post=2485"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/tags?post=2485"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}