Web awareness and web writing March 2013

Course content what you need to know about online content what is good content? planning your content how to write for the reader tone of voice using the Inverted Pyramid web standards good page layout use meaningful headings make lists link text images being aware of the legal bits what’s next?

It’s the web you don’t know who the user is …or what they will see well authored content will be accessible to everyone, always, everywhere. You shouldn’t assume anything about your reader or what they will be using – but you can guarantee their access to your content by respecting web standards.

What you need to know about online content reading from the screen is slower than from the page web readers tire quickly people will read and understand more of short, simple texts your readers may not be native speakers most users don’t read, they just scan text. Eye tracking results produce mainly an ‘F’ or ‘E’ pattern on the web page.

What is good content? Exercise 1: Imagine you are a prospective student trying to find and apply for student accommodation. Take a look at some of these sites and note down what you think are examples of good and bad content. 1.Abertay Dundee: 2.Warwick: 3.Edinburgh: 4.UCL: 5.York: Good content effectively communicates its intended message to its intended audience.

Planning your content Who are you writing for? do you have more than one group of readers? how old are they? what do they do? where do they live? what device might they be using? What do you know about their characteristics, behaviours and attitudes?

Planning your content Why are you writing? to encourage people to act, think or feel? to enable people? How can we engage? share stories pass on information share facts

What is the purpose of your site? Exercise 2: Find the web pages you will be editing or think about the site you want to create and write down: Who is your audience? What do you think they want to do? What do you want them to do? How do you think you could engage with your audience? How do you think you could improve your pages?

How to write for the reader Clear and concise: to the point avoiding jargon and acronyms Short: one brief, memorable sentence Active: make every sentence active Positive: talk about what can be done, not what can’t be done Specific: address a particular challenge or issue Credible: use facts and examples to back up your message Organise content around users needs, not your convenience. Always focus on what your reader needs to know – not what you want to tell them.

Active/passive voice 1.“Books may be borrowed from the library.” 2. “It is recommended that...” Plain English “…subsequent approval of which will be a pre-requisite to the raising of any internal order mechanism.” “You can borrow books from the library.” “We recommend that...” “You will need approval before we can raise an internal order.” How to write for the reader

Tone of voice Our tone aims to be: clear and concise honest and open friendly and professional personal and direct Self-references try to avoid using ‘the University of Bath’ or ‘the University’ use ‘we’ and ‘our’ instead ‘Bath’ should not be used (unless talking about the city!)

Using the Inverted Pyramid What does it do? turns the traditional paragraph upside down begins with the topic sentence which summarises the facts used in journalistic writing Why use it? the most important information is more likely to get read!

Why are these important? Having web standards means working towards a unified look and feel across the external website: to position the University and to produce high quality, audience-focused web content What do they contain? Visual Identity: layout on web pages for videos, photos, quotes, tables and how to use the header and footer, tone of voice and more. Web Standards: web writing, headings, images, linking, file and folder names, calls to action and more. go.bath.ac.uk/visid go.bath.ac.uk/webstandards Creating standards

Good page layout Page header Vital text Call to action Section header Image Important text 6 Page header summarises vital text Vital text: ‘must have’ info, one idea… Call to action: ‘apply’, ‘buy now’,’ Section header: readable, clear Bulleted list: more ‘must have’ info Important info: short, relevant, one idea… White space: to rest the eye Image placement: supporting, apparent Inverted pyramid: ‘conclusion’ first Least important Call to action 3

Using meaningful headings What should you know? headings let users see what’s available at a glance they also allow screen readers to detect structure search engines also read your headings What should you do? use headings generously make your headings outline your structure keep them simple and descriptive use meaningful page titles too use sentence case

Make lists Because: lists are easy to read users can quickly identify items in a list browsers and screen readers help users with lists lists make things easier for you

How to use lists If the sentence before the bullets ends with a colon (like this one): start each point with a lower case letter don’t punctuate at the end of each line finish the last one with a full stop. If the bullets are a self-contained list (ie there’s no sentence ending in a colon before them) do them like this. Capital letter at the start of each one. And a full stop at the end of each one. If your bullet points are all questions, ignore the above and start them with caps (even if you’ve got a colon). Because otherwise it looks a bit weird.

Link text What you need to know: users rely on informative link text search engines do too link text is really important for users of non-visual browsers What you should do: write link text which makes sense on its own make link text long enough to click easily never use ‘here’ or ‘click here’ use action phrases for action links e.g. Order a prospectus rather than prospectusOrder a prospectus prospectus

Link text Exercise 3: Try rewriting these examples of bad link text: Click here to download SafariClick here Visit our website to learn about our researchVisit our website For information about the medical centre click here.click here Click here to order nowClick here Tell me more about Web DesignTell me more Download a brochure herehere

Images images should always be appropriate for the content of the page they should be supporting not distracting look at the visual identity for photography guidelinesphotography guidelines always use alt text Alt text we provide alt text as an alternative to the image say in words what the image says in pictures don’t describe the image, say what it shows Photography guidelines:

The legal bits… Copyright for example, don’t use photographic content without consent or paying for it Advertising standards we should always be legal, honest, decent and truthful Equality Act (2010) use inclusive language (according to race, religion, culture, gender, age, disability and so on) don’t create a two tier level of provision that discriminates. Freedom of Information (FOI) the publication scheme and right of access request Data Protection and Privacy Statement always gain consent to use personal information. For example, using a model release form, permission to use names and addresses Disclaimer

What’s next? Editing in the CMS (essentials) training Course covers: using web awareness and web writing principles using the CMS to make simple page changes creating links to pages pasting content from another source adding contact details from Person Finder

Questions and general discussion Do you have any questions? Thinking about your website/pages – How do you think you could improve them now? Are there any issues you’d like advice on? How could you use the tools we’ve discussed?