New Business School website

BusinessSchool_desktop

The new Business School website was launched earlier this year. It’s the first of the University’s College sites to move to responsive templates which are optimised for viewing across a number of platforms including mobile and tablets. The website launch date was timed to support the Business School’s submission for EQUIS re-accreditation and includes new information about the Business School’s interdisciplinary research clusters as well as additional careers and employability info.

EQUIS is the European quality improvement system for Business Schools, its accreditation is one of the most prestigious accolades that can be bestowed upon an institute for Business and Management education. The EQUIS peer review visit was conducted at the end of September, initial feedback from the review team was very positive, but the official result of the inspection will not be revealed until December.

The website showcases the 5 new Business School research clusters which consist of world-renowned academics, research students and distinguished international visitors. The research clusters include expertise from all specialisations across the Business School. The clusters are:

BusinessSchool_devices

Careers and employability is a high priority for the Business School, the new website also contains additional information for students and potential employers. The Business School was proud to be ranked #1 in the UK for Business and Management graduate employability in 2015 (DHLE).

The website has received positive feedback from the different user groups. Work is ongoing to add additional information and functionality. The next college website to move to responsive templates will be the Medical School, with other colleges to follow.

Paul Collins (Web Marketing Officer for The Business School)

A Day in the Life of the University of Exeter

dayinthelife

On Wednesday 28th September 2016 we ran our first ‘Day in the Life’ social media event.

Using the hashtag #LoveExeter, we encouraged staff, students and Alumni from across all our campuses to come together to share their day and give an insight into how the University works, what our community is like, and what it’s like to be a student or member of staff here.

We wanted to celebrate the many facets of the University and show a side that most people don’t get to see. By using social media we saw an organic and revealing celebration of all that the University does without it being over-produced.

User generated content was key and so we encompassed many social media channels – Facebook, Twitter, Snapchat and Instagram. This allowed contributions from everyone – staff and students – using whichever medium they felt most comfortable with. We welcomed video clips and photos telling us about their day. The Digital Team were out and about on campus capturing content throughout the day with help from colleagues in CaMs.

The content forms part of our Diamond Jubilee Digital Archive. The feed that was created has been brought together on the Diamond Jubilee social wall.

Our overall winning posts for the day were:

The event was a huge success with over 6.6 million timeline deliveries on Twitter and the hashtag #LoveExeter was trending in the UK for around two hours.

On Instagram we received close to 200,000 impressions and reached almost 40,000 on Facebook.

As Social Media Manager, I am always able to offer advice and guidance if required. You can email me on c.s.sweet@exeter.ac.uk. You may also wish to take a look at the University’s social media guidance and policy.

Charley Sweet (Social Media Manager)

New students site redesign – a case study

In this blog post we have used the recent redesign of the New Students website as a case study, to demonstrate some of the considerations and processes involved in redesigning a part of the University website.

Map what we have

Before initiating the redesign we created a site map in order to get a feel for the site and how its pages related to each other.

We then conducted a complete content review with the help of Google Analytics, which showed us how many views each page received and when, as well as average times spent on pages and the device they were viewed on. The aim was to streamline the content for a responsive site and get rid of any dated or unnecessary content.

Old_new_students

The site before our redesign.

Plan the project

We set objectives for the site, and established a set of user tasks – the things a user will come to the website to accomplish.

  • Example objective: To help students know who to contact if they have a problem, so less time is spent redirecting queries.
  • Example user task: “As a new student, I want to know what I need to do before freshers’ week starts, so I am prepared to start university.”

We also created some personas – imagined examples (based on focus group findings) of realistic students who might use the site, and the kinds of concerns and priorities they have. This informed the way we wrote new content and put the site together.

Personas_1

Our personas.

Content first

For the New Students site, we decided to concentrate on drafting all of the content before we thought about how it would look on the site. We used a card-sorting technique to group different pieces of information together in a way that would make the most sense to someone looking at the site for the first time.

Once we had all the content ready, we were able to think about how to position it on the page and how the different pages in the site should relate to one another.

The home page was the last part of the site to be designed, and changed a lot from our initial ideas thanks to feedback from user testing.

User focus

With all of our sites, the primary focus is on who is going to be using the site and what they will use it for. We gathered this information through a mixture of analytics and talking to users in interviews and focus groups, and used our findings to create user stories.

When we had drafted a version of the site, we undertook usability testing: one-to-one sessions in which we observed a student navigating around the site, to see whether it worked in the way they expected, and tested how easy it was for them to accomplish the user tasks.

Some of the key changes we made after user testing were:

  • Reducing the amount of information on the home page.
  • Making Freshers’ Week information more prominent on the home page.
  • Removing an ‘International students’ feature box from the home page, as information throughout the site applies to international students, so this was seen as confusing.
  • Adding links between pages: for example, students can now click an in-page link button in the ‘When you Arrive’ page that takes them straight to Freshers’ Week information.

Results

As well as meeting our objectives, the final product has helped the user complete the primary tasks of the site more efficiently and with less effort. We will continue to check that the site is working with more testing, asking for feedback and by regularly reviewing the analytics.

Visit the New Students site

The new responsive site, as it appears on a desktop, laptop, tablet and mobile screen.

Frank Zirger and Lucy Corley
Web and Digital Communications Assistants (GBP)

T4: Common Conundrums

There are some T4 issues that frequently pop up. Below we’ve listed 4 common conundrums and their solutions. If you have encountered other quirks while using T4, please get in touch and let us know.

1. Is the text on your page formatting incorrectly or looking odd?

Internships_faulty

This is an example we created on the Career Zone.

To fix this and get your text formatting correctly, you need to view the text in T4, then:

  • cut the faulty text so that it’s saved to your clipboard (highlight it, then press Ctrl and X on the keyboard),
  • click the ‘Paste as plain text icon’ in the text editor toolbar (highlighted below),
  • and paste it back in (press Ctrl and V).
  • Then you can highlight the text and re-format it how you want it using the ‘Format’ drop-down menu.

Paste_as_plain_text_icon

2. Have you made changes to your page in T4 but they’re not taking effect on the live site?

This could be because of a few different causes:

  • T4 hasn’t yet finished publishing the page.  This should resolve itself after an hour or so – if you’ve waited and it still isn’t appearing check the options below.
  • You clicked ‘update’ rather than ‘update and approve’ which would leave the content ‘pending’ and not ‘approved’ and therefore not added to the publish list. To remedy this make sure you click ‘update and approve.’
  • Your internet browser cache has stored an older version of your page so that it is able to load it faster. To update it to the current version you must refresh your page by holding down the Ctrl key and pressing the F5 key.
  • If you still can’t get your page to update, please contact your web marketing officer or a member of the web team.

3. Do you ever find that your content in T4 bounces up and down? 

This glitch is simple to fix: click the arrow buttons to make the site structure on the left-hand side wider or narrower. Giving the right-hand content more (or less) space will toggle buttonsusually solve the problem and make your content readable again.

If you click the left-hand arrow a couple of times, the site structure will disappear from the screen, but it’s easy to retrieve – just click the right-hand arrow to expand it again.

If this fix isn’t working, you can also try re-sizing your browser window.

Jumping_content

4. Are your images missing from the media library?

Occasionally a media library folder fails to display any media items when you open it. If you know there should be images or files in there, re-size your browser window. Changing the size of the window usually solves this T4 quirk and makes the items display again.

Frank Zirger and Lucy Corley
Web and Digital Communications Assistants (GBP)

How do people really read on the web?

how-people-read-on-webHow often do you go to a website with the intention of carefully reading its content?

Most of us use the web to get things done, so we scan websites hurriedly for the words we are looking for and ignore anything we don’t think looks relevant.

Web usability expert Steve Krug summarises the difference between how we write and what a web user sees:

We’re thinking “great literature” (or at least “product brochure”), while the user’s reality is much closer to “billboard going by at 60 miles an hour.”

This tendency to speed-browse is even greater in many students: web users in the 18-25 age
group are used to using Google to find information instantly, and have a ‘click first, ask
questions later’ attitude. (Read more about how young adults use the web.)

However, it is very easy to forget this when writing content for a webpage. So, we’ve pulled together some tips to help optimise your web content for the way users actually read.

4 top tips to enhance web content

1. Emphasise key words

Put the important words students are looking for in page headings to catch their attention. This also makes the page more likely to show up if students search for these words on Google. Short, task-focused headings can be especially useful, e.g. ‘Apply for funding’, ‘How to pay’.

2. Be consistent with headings

Create a clear visual hierarchy on a page by ensuring the most important things on the page are formatted as Heading 1, then sub-headings as Heading 2, etc.

3. Cut out needless words

With so much information whizzing past on the web, a user is more likely to stop and read short, concise paragraphs that get straight to the point.

4. Position your content carefully

The top-left corner of a webpage tends to be where a user’s eyes will focus, while the bottom-right gets far less attention. The Accommodation homepage makes the most of this by choosing the most relevant links from the boxes at the bottom of the page, and displaying them alongside eye-catching images in the top-left section.

Visit our web support pages for more information on writing for the web.

Lucy Corley
Web and Digital Communications Assistant (GBP)

What we can learn from usability testing

When working on or managing a site on a frequent basis, it is easy to forget that you are not the core user, and that the way you interact with it will probably be completely different to that of someone who has never seen it before. It is important to take a step back and get perspective from someone not familiar with the site to make certain that those who will actually be using it are able to, and at the forefront of its design.

What is usability testing?

Usability testing consists of short sessions whereby a web user, who is preferably of the intended audience of the site being tested, is set a number of simple tasks to complete. Whilst completing these tasks the user is encouraged to ‘think out loud’ before and during any interaction with the site. With permission these sessions can be recorded and then analysed further for useful feedback.

By undertaking this testing early, faults and flaws of all manners can be corrected before they become significant and difficult to fix later in the design process. The results are often surprising and always beneficial in improving the overall experience for our users.

Here are just a few of the valuable improvements you can gain from usability testing

1. Aesthetic improvements – Getting independent feedback from real users who can offer their approval or suggestions on the look of a site is a really useful tool in evaluating it’s aesthetic design.

2. Improved navigation – By observing how users navigate around a site, we can make informed and considerate decisions about where we place navigation elements, what we name them, and also make note of any navigational issues that become apparent.

3. Improved content – Is the text easy to read and appropriate? Are the images adding to the content? Is the content well-structured in a hierarchical manner? Additional suggestions such as videos or social media feeds? – These are all useful questions in appraising and improving the content.

4. Technical glitches – Technical bugs that may have been missed can show up and be noted when a user interacts with a site in an unexpected way.

5. User tasks – By setting key user tasks for the site and asking the subject to complete these, we can know for certain that the site is functioning as it’s supposed to and meeting the needs of its audience.

If you think usability testing could be beneficial for your site, please contact your web marketing officer or someone on the web team.

Frank Zirger
Web and Digital Communications Assistant (GBP)

Digital Marketing 2016 conference: 5 top take-away tips

Recently colleagues and I attended a digital marketing conference in Exeter provided by Optix Solutions, local digital marketing agency. Optix gave a review of digital marketing trends from 2015, forecast trends for 2016 and offered tips on how to improve your digital marketing.

These are our 5 top take-away tips from the event:

1. Think strategically first, then tactically.

Have a digital marketing strategy that encapsulates your aims, objectives, what you want to achieve, who your target audience are and what they want from you before you start to think about the tactics needed to meet your strategic objectives.

If you dive straight in and start with tactics you could find you are wasting a lot of time and using tools and platforms that are not appropriate for your target audience.

2. Focus on your own space

Digital marketing must start with focussing on your own website. It’s vital to position yourself online with a strong, professional website – it’s the online shop window to your organisation.

The key to creating a great website is to create the best possible experience for your audience. Visitors should easily find information, answer their questions or carry out tasks that they need to. A positive experience of your website also lends credibility to the organisation.

Tool tip: www.heatmap.me Generate heat maps to show where your visitors’ mouse hovers over, how far they scroll and where they click. This can give you an insight into what your visitors are looking for and the usability of your site.

3. Take video seriously

YouTube continues to offer an enormous opportunity for organisations. ‘Millenials’ – the demographic born from the early 1980s to the early 2000s – turn to YouTube before Google, offering an opportunity to target a whole generation.

Facebook’s video platform is also expected to rocket in 2016.

4. Be human

Have meaningful engagements and communicate authentically – remember there is a person on the other end of your digital platform! Being seen as ‘human’ helps you be transparent, approachable and trustworthy.

Create interesting, positive and relevant content that your visitors’ understand and can relate to, to build human relationships in a digital world.

5. Google is still huge

Google still drives more traffic than any other channel and is the most used search engine in the market. However Bing is now starting to see an increase in traffic due to its search being used in Microsoft Cortana and Apple’s ‘Siri’ assistant.

As such voice searches are starting to become more widely used, so when considering your SEO widen your net of key phrases to consider what questions somebody might ask when searching by voice.

Top SEO tips from the conference include:

  1. Visit www.answerthepublic.com to find out what questions people are asking about your topic, and integrate this into your SEO.
  2. Regularly review your content for key phrases and words. Offer quality content that is relevant to your audience.
  3. Interact with other people in your community to encourage online conversations or linking to you.
  4. Review your site structure and URLs to ensure your site is easy to navigate.

If you would like to discuss your digital presence please contact a member of the Web Team.

Rachel Dennis
Web Marketing Officer

How to resize an image using Pixlr.com

How to crop images to the correct size for T4 templates if you don’t have access to Photoshop.

The templates in T4 require images to be cropped or re-sized to specific dimensions to appear properly when they publish out to the website, so you’ll need to do this before you upload your images to the media library. Image sizes are in pixels and on the web there are 72 pixels per inch. You can see which templates need which image sizes on the web support site.

If you don’t have access to Photoshop you can use a great web based alternative called PixlR.com that has much of the same functionality and is completely free. You can use it to crop and resize images, make adjustments to brightness, colour balance and contrast, add layers and text and lots of other things too.

For this example, we’ll look at how to resize an image for the www image with caption template in T4 that will place your image in the top right hand side of the page and requires images to be 218 pixels wide, but can be any height.

  1. Go to http://pixlr.com/editor/ and click the Open image from computer button. Navigate to the image you want to resize and click Open.
  2. If you don’t want to crop anything out of the image then skip to step 3. To crop the image, click on this button in toolbar  to select the crop tool. Left click and hold and drag your cursor around the portion of the image you want to keep and release to select it. You’ll then see the part of the image you’re going to keep in a grey rectangle. You can amend your selection by dragging the blue boxes on the sides and corners to the position you want. When you are happy hit return. If you want to step back at any point hit ctrl+Z.
  3. From the top menu click Image and then from the dropdown menu click Image size. In the Image size box enter 218 into the width field. Make sure the Constrain proportions checkbox is checked or you will skew the ratio of the image. Click Ok to resize the image.
    Note: If the image you are starting with is less than 218 pixels wide then increasing the width will decrease the quality of the image.
  4. From the top menu click File and then from the drop down menu click Save image. Enter the name for your image in the Name field. An image name should only contain letters, numbers and dashes – there should be no spaces and no special characters (such as & % *). From the Format drop down select JPEG. Set the Quality slide bar to 80. Click OK and save it to your computer.

Your image should now be the correct width to upload to the media library.

Dan Lott,
Web Designer 

How to blog

Firstly, ask yourself whether a blog is the right medium for the message you want to convey. If you have information-based content that will remain static over time, that users need to be able to access repeatedly, it is likely to sit better on a static webpage.

But, for content that will become out-of-date, information that is ‘nice to have’ as an addition to the essentials, or ‘opinion and insight’ – a blog could be the perfect way to showcase this. We can help colleagues from across the university get started with blogging on the http://blogs.exeter.ac.uk/ domain. The Library News blog and The Exeter Blog are two examples from the University of Exeter where blogs are being used successfully to supplement pages on the main website.

If you think a blog might be right for your content, the first thing to do is have a chat with a member of the web team. They will be able to talk further about whether blogging is appropriate for your area, and may know of existing blogs that you could contribute to, rather than setting up a whole new one.

Whether you find another blog to contribute to, or set up a new one from scratch, the following tips will help.

Five top tips for blogging

  1. Keep it simple & not too long

300-500 words is a good rule of thumb

  1. Keep it up

You don’t have to blog every day or every week – don’t bombard people with posts if there’s nothing to say – but your readers will appreciate timely updates when you do

  1. Be personal and friendly (engage)

A blog’s a good opportunity to show a bit of your personality in your writing – it’s written ‘from a person’ rather than ‘from the department’

  1. Remember the difference between a blog and a web page

Link up the two where appropriate – use hyperlinks within blog posts (remember: these are best for opinion and insight) to link through to your web pages (static information.) Maybe you’ve got a new webpage you could talk a bit more about the process behind? Or perhaps a blog would work as a way to deliver updates on an ongoing project which also has a static web presence?

  1. Engage with your audience

If you get comments and emails from your readers – respond. Your blog is an opportunity to speak to your users in a more informal tone, so make the most of this.

Further reading from the web team blog

Images

Copy

The main principles of web accessibility

Put simply, web pages are accessible when people, with and without disabilities, are able to access and use the content as intended. So all have equal opportunity to achieve the  purpose for which the content is published. It’s a key area within user experience design and website usability.

Equal access for all is a legal obligation we have as an organisation providing education services. But it also makes sense from a business and social point of view to have a website that works for as wide an audience as possible.

People-centred design
Just as accessible building design that takes into account the needs of people with disabilities often results in a better experience of a building for all the people who use it, accessible web design also benefits all users’ experience of the web.

People in their infinite variety are therefore at the heart of this, and people use various senses, technologies, languages, formats and functionality to access and interact with web content. Some of this is from personal choice, and some is imposed by the need for assistance when certain senses or abilities are compromised.

For an idea of the range of abilities we need to keep in mind when considering accessibility, take a look at this Alphabet of Accessibility.

Search engine optimisation
Did you know there is a very important and severely disabled group of users who look at our entire website on a very regular basis? Search engine robots are blind. Their needs when accessing our web content to crawl and index our pages are much the same as blind users of the site. The same things we can do to assist blind or partially sighted users to access our web content will help search engines index our web pages, so they will be findable by all people who need to find them. That in itself makes our pages more accessible.

Guidelines
If we’re talking about the ways people use technology to access web content, there is clearly an important technical aspect to web accessibility. An international set of guidelines produced by W3C called the Web Content Accessibility Guidelines offers guidance on a range of specific technical pitfalls to avoid when creating web pages. But it’s important not to get too bound up in technical accessibility alone, as it’s possible to pass a set of guidelines to claim technical conformance, but still have a site that is not fully usable by real people. So these guidelines are organised around four people-focused guiding principles, that web pages should be:

  1. Perceivable: People need to be able to access web content through the senses of sight, hearing, and/or touch if they are to be able to use it.
  2. Operable: People should be able to find and interact with web content using whatever input methods available to them (eg keyboard, voice recognition), and have control over how they use it.
  3. Understandable: If people can access your content, it’s useless to them if they cannot understand its meaning or what to do with it.
  4. Robust: Content needs to be able to be perceived, operable and understood using the wide range of technologies available for people to choose from.

There are a lot of these guidelines, it has to be said. But many of them have to be taken into account by designers when designing websites and by developers when building new functionality. The Web Team are responsible for keeping these in mind when building design and structural code into the back end of T4. There are, however, some less technical but very important guidelines which you as content authors and publishers need to bear in mind when you create content and add it to the website in T4. These will really help to make sure your web content is as accessible as possible.

What you can do as content authors
Headings

  • Use the formatting options Heading 1 to Heading 6 from the drop-down Format menu in T4’s editor to format your headings and subheadings correctly. The visual formatting is available to sighted users for scanning and the underlying logical structure is available to assistive software, such as screen reading software and keyboard users to navigate, making your content accessible to all. Over 65% of screen reader users with visual impairments or dyslexia navigate pages using headings according to a recent WebAim survey.
  • Only format actual heading text as headings – avoid using heading mark-up to style text that isn’t a heading as this will be misleading.
  • Good use of headings is also helpful for search engine optimisation.
  • Link text and navigation labels
  • Screen readers allow users to view a list of all links on the page, using a keyboard shortcut, and people who can’t use a mouse can use the tab key on a keyboard to skip from link to link in order to skim content. If link text does not make sense out of context, then the destination of the link will not be clear.
  • Make sure you use clear, concise and direct words to indicate the destination of the link – although don’t use any more words than you need, as link text needs to be kept short and to the point.
  • Use key words in your link text to help search engines to find your pages, as words in link text are prioritised for indexing.
  • For the sake of both humans and search engine robots do not use ‘here’, ‘click here’, ‘more’, ‘read more’ or other such link text that doesn’t make it clear on its own what the destination of the link is.
  • This also applies to the words in navigation labels, which are determined in T4 by the way you name your sections.

Page titles

  • Page titles appear in your browser tab heading. These are also derived from section names in T4, and each one needs to be unique and informative. A screen reader will speak this when a person arrives on a page, so they need to know from the title where they are and if it is the page they want.
  • It’s also the title of the page’s listing in a set of search results, where you want people to be able to identify the page is what they want.

Images

  • Alternative text should be provided for any images conveying important information not available within the actual text of the page. In the media library entry for an image, you can add text to the ‘Description’ field to input alternative text that will then be available in the code of your page to convey the equivalent meaning. You don’t need alternative text if your image is purely decorative and not conveying key information.
  • Images of text: use graphic text sparingly as it is not available to search engines or to screen readers. If there are good reasons to use this, then keep the words to a minimum and provide alternative text using the same words.

Lists and tables

  • Use the relevant buttons in T4’s WYSIWYG editor to apply the correct structural formatting to bulleted and numbered lists, and to table headers and rows.
  • Avoid pasting lists or tables directly from Word into T4. If you paste from Word documents, this doesn’t include the correct underlying structure for lists or tables in web pages.

Plain language

 

  • Use plain, simple direct language for clarity of expression and ease of understanding, using your audience’s language, and avoiding jargon.
  • Focus on a single topic per page and keep sentences as clear and straightforward as possible within the topic you are writing.
  • Explain abbreviations and acronyms the first time you mention them in a page.
  • Don’t rely on colour, shape or location alone
  • Avoid using instructions in your page that rely only on shape, size, screen location, orientation, sound or colour alone. Eg, ‘Click the blue button’, ‘Use the links on the left’, ‘See the instructions below’. You can’t assume how the reader is actually viewing your content.

For more information, read our pages on web accessibility on the Web Support site.

Sarah Williams
Web Marketing and Editorial Officer