Top tips for improving your website

Download Top tips for improving your website

Post on 22-Jan-2016

47 views

Category:

Documents

0 download

Embed Size (px)

DESCRIPTION

Top tips for improving your website. Christopher Eddie Public Affairs Directorate. what will this talk cover?. NOTE: the spoken part of the presentation is in the notes panel below. how do you judge a website?. design structure content. content structure design. - PowerPoint PPT Presentation

TRANSCRIPT

<ul><li><p>what will this talk cover?Page *NOTE: the spoken part of the presentation is in the notes panel below</p></li><li><p>how do you judge a website?Page *</p></li><li><p>how do you judge a website?Page *designstructurecontentcontentstructuredesign</p></li><li><p>the contentPage *</p></li><li><p>the pagePage *</p></li><li><p>look at your destination pages</p><p>would you read them?Page *</p></li><li><p>Page *</p></li><li><p>How do you takein information these days?Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>There is something amazing about this</p><p>:)Page *</p></li><li><p>But there is aflip side</p><p>:(Page *</p></li><li><p>Amazingly, this is changing the internal structure of our brains</p><p>:OPage *</p></li><li><p>we all skim the webPage *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>searchPage *</p></li><li><p>what do your users want?Page *where do they go on your site?</p></li><li><p>Page *</p></li><li><p>what do your users want?Page *where do they go on your site?why have they come?</p></li><li><p>Page *the Pareto rule</p></li><li><p>Page *</p></li><li><p>user testPage *</p></li><li><p>yikes, that sounds like a lot of workPage *</p></li><li><p>think tasksPage *</p></li><li><p>imagesPage *no clipartquality &amp; consistency</p></li><li><p>the big redesignPage *</p></li><li><p>the big redesignPage *</p></li><li><p>the big redesignPage *</p></li><li><p>consider responsive designPage *</p></li><li><p>ask Big BrotherPage *https://www.gov.uk/designprinciples</p></li><li><p>or Auntie BeebPage *http://www.bbc.co.uk/gel/philosophy/design-philosophy</p></li><li><p>give your users morePage *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>Page *</p></li><li><p>what social media to use?Page *</p></li><li><p>engage your usersPage *</p></li><li><p>ask for their helpPage *</p></li><li><p>and once youve implemented changesPage *</p></li><li><p>more help - onlinePage *PAD online help PAD style guideuseful e-newsletters Gerry McGovern UIE tips UIE archiveSocial Media cheat sheet</p></li><li><p>more help - booksPage *Writing Style - The Elements of Style: Strunk and White</p><p>Content - Killer Web Content: Gerry McGovern</p><p>Tasks - The Strangers Long Neck: Gerry McGovern</p><p>Web Usability / User Experience - Dont Make Me Think: Steve Krug</p><p>User testing - Rocket Surgery Made Easy: Steve Krug</p></li><li><p>so, to sum upPage *its just one step after anotherbuddy upevolution not revolutiontheres no destination so enjoy the journeybut</p></li><li><p>the site is NOT for you</p><p>Page *its for THEM</p></li><li><p>now go getemPage *</p></li><li><p>thank youPage *</p></li><li><p>questions?Page *</p><p>*Introduction</p><p>I am going to cover a number of ways to improve your website.</p><p>I am going to focus more on the bits that are likely to be within your power to change then</p><p>I am going to talk about things which usually involve others and money</p><p>You should leave with some practical advice that you can implement tomorrow and some starting points for future improvements.*Most of us assess websites very quickly, we take in*i.e., does it look nice?can I find what I'm looking for?does it tell me what I need? bottom line - is it useful?</p><p>new web designers tend to work in this order too, design something pretty, organise it, populate it</p><p>but the sites you return to and which are most useful reverse this</p><p>2b this is how experienced web designers work. It is also how you can improve your sites*start with the actual words, what you call things?use plain English, be concise, be authoritative</p><p>do you use internal speak? Avoid it unless your webpages a solely aimed at others in your officeimportant for 2 reasons:it speaks to the user in a language that they can understandit will help your page be found in a search people search using basic terms*what sort of page is it?main section - signpost - like a table of contentssub-section - still a sign postdestination - actual content/textthis is the page you actually want the user to spend time on, it should answer their questions/enable them to complete a task*e.g. the DVD Quick Start Guide (most of us just plug a new device in and beginning pressing buttons, we might skim the Quick Start guide, we certainly will not read the full instructions unless something does not work)</p><p>we all skim</p><p>let me tell you a story - Richard and his loss of attention - but it's true The Shallows*The author and journalist Nicholas Carr believes that we are in the age of the Shallows.</p><p>**If you're over 30 you probably used to rely on newspapers, magazines and books for text and the radio and TV.</p><p>Click advance</p><p>Today it is likely to be the internet and email, certainly on screen, whether desktop, tablet or phone and in amongst a continual drip (or deluge) of new messages all jostling for your attention from services like facebook, twitter, RSS readers and alerts*We used to devote time to reading books to gain insight and knowledge, </p><p>we were divers in small pools immersing ourselves in the depths of a subject, </p><p>the longer we spent with it, undistracted, </p><p>the stronger the memories and understanding. </p><p>*Now we skim over an ocean of ever multiplying amounts of information in a speedboat, </p><p>let's call it the good ship google (click to advance)*and every time the hull skips over the water it bounces on a link which takes us elsewhere in the ocean. </p><p>And our boat is getting faster and faster, </p><p>it is skipping more than ploughing through the water, let alone taking us down deep into the water</p><p>what we are taking in are links, super concise summaries of articles, headlines and sub headings.*we can genuinely find out about anything in about as long as it takes us to realise that we are interested in it, all knowledge is at our finger tips.*We only build memories by spending time taking in information and thinking about it, </p><p>our brain literally builds bridges and connections then stores them. </p><p>Skimming over information does not enable this to happen, </p><p>and being able to call up information in the blink of an eye bypasses our need to exercise our memory. *Carr covers the research in his book, it is worth reading. Or at least skimming chapters 1, 7 and 9, ho ho</p><p>it will be fascinating to see what effect this will have. </p><p>You literate people may have already noticed a decline in your attention span**we all skimwe read in an F shape identified by Jakob Nielsen in his well known study using eye tracking software, we look for sign posts, headings, menu titles, sub heading*so structure your pagebig headingbiggish sub headingshort blocks of textif you can strip it further down into a bulleted list even betteryou want Hemingway, not Proust</p><p>*What about links in text?</p><p>does your eye travel over links in the text smoothly or does it divert your attention? do you follow them? do you ever return to the original piece you were reading? do you honestly remember what you've just read a few minutes after reading it and when you're on to the 2nd, 3rd, 9th linked page?</p><p>links in text?depends, but better not to, if this is the destination then let the reader read then offer links to related material at the end of the text or in a links column*only as good as the content you provide, use the obvious terms jobs not vacancies or opportunitiesif Oxford uses a term that few others use then cater for this, e.g. DPhil, also put (PhD)repeat the important words in heading, page title, intro para etc</p><p>look in the search logs, what are users actually looking for?*think of the user, 7a - where do they go on your site?</p><p>use Google Analytics</p><p>Its free, its easy to add to your site, its incredibly usefulDo you know what the most popular part of your site is? If so do you know how popular it is? It is only when you know who comes to your site and what they want that you can give it to them</p><p>show our homepage breakdown</p><p>*now look at your website, are the three most popular parts blatantly obvious on the homepage?*and 7b - why have they come? </p><p>we are all task driven, your website is not for entertainment or for filling leisure time, the users are trying to find out something. You need to be clear about what that is and then make it easy for them, employ the </p><p>*Pareto rule/principle - the 80/20 Rule - the majority of tasks/traffic are answered by a small part of your site. Or to put it another way, 20% of your effort focused correctly will render 80% results</p><p>*so if we focus our efforts on making admissions work very well then we make most people happy*Can be quick, can be very cheap, can not only be easy but fun.Ask a handful of people who you know to use your site to complete some basic tasks. Watch them, speak to them, find out why they could not do some things, ask how theyd like the site to work, ask them to think out loudYou will learn something every time you do this*well yes and no, depends on how you approach it, here's my tip on how to start all thisbuddy up to actually get things done</p><p>I recommend that you pair up with someone else who runs a website (preferably here in the university) so that they can review your site and you can review theirs. Let's be honest when we are our own boss we are all susceptible to laziness and to putting things on the back burner. It's much harder to do this when someone else is asking for something.It is also easier to use someone else's website and spot the problems than it is on your own site, and more fun. And you can be harshly objective:So where to begin? Approach a colleague to work with, block out an hour a week in your diary - the hour before lunch on Wednesday is a good one, then start with the basics.week 1 a general review - make concise notes about everything you found odd on their site and what you would change on it - swap review emails and see what they thought of you site. Any overlap? Any points you made that could also be applied to your site? Keep this overview and over time you will be able to check off points as you work on your site.First task - ask them to look at all the terms/menu titles/section names and headings in your site and write down which ones they either do not understand or think that a visitor would not understand. If you look after a very large site, break it into manageable sections. Compare, depending on how many there are draw up a list of action points/changes to be done in the next session. Make some changes. From now on each week will be a bit or reviewing of work done (is it an improvement?) and then some new stuff. Once you have done the menus and titles - - thenLook at the text in each section or each webpage, what is the point of it? What is it actually saying? Can it be said more concisely and more clearly? Can it just be a couple of bullet points? If it can, make it so.Now begin the re-writing, a section or a page per week, with input from your review partner.thenSwap Google Analytics reports with your partner, how would you help them?thenthink TASKS, if you know the obvious tasks are they easily accomplished? If you do not know then-USER TESTRemember user testing with only a few people is 100% better than testing with no oneMaking a simple change right now is 100% better than planning to make lots of "important" changes tomorrow</p><p>*can your users complete the tasks that they came to your website for? </p><p>User test again!*10a - no clip artThis requires no further explanation, clipart is bad, it always was, it always will be</p><p>10b - quality and consistencyUse jpg for photographic images, gif for graphics/illustrations/charts. Use a graphics package that lets you see a preview of the image when you are choosing what level of jpg compression to use. Go for quality over size (within reason obviously) having an image that downloads in the blink of an eye but looks ghastly is no victory, most people are on broadband.</p><p>with retina display iPads and laptops upping the quality possible you might also want to look into SVG scalable vector graphics for all your non-photographic images</p><p>The bottom line is that one of the main factors that undermine the professionalism of a site is the graphics, you dont get a second chance to make a first impression*if you have the budget and approval for a site overhaul then that is a good time to review all the content, don't migrate a site without reviewing and editing, the big design, make it mobile friendly*huge growth in smartphone sales.</p><p>Apple sold more iOS devices in 2011 (ie iPhone, iPad, iPod touch) than actual Mac computers over the past 28 years*Although still very small compared to all visits, the growth of visits to oxweb on mobiles is steadily growing. This is not likely to decline*this is quite new and has a fair amount of good press, whether it will last is not certain but at the moment it appears to be the best option for making your site work on most devices, e.g. oxfordmartin.ox.ac.uk</p><p>*and from this rather unlikely source some really useful advice</p><p>*this is much broader in scope but still of interest</p><p>*</p><p>give the users more - slideshows, sharing, social media, video, podcasts etc.</p><p>The web is predominantly a text based medium but - like it or not - that's changing. Luckily it is also getting easier to add elements to your site such as slideshows, audio and video.</p><p>e.g. Press Office, latest Annual Review</p><p>video - Its fine to write that Oxford has a wide diversity of students but it's better to show them and hear their accents 100 Faces</p><p>twitter</p><p>facebook</p><p>and there is you tube / iTunes U etc.*(NOTE: there are a few images on this slide, you may need to run it as a slideshow to see them all) </p><p>give the users more - slideshows, sharing, social media, video, podcasts etc.</p><p>The web is predominantly a text based medium but - like it or not - that's changing. Luckily it is also getting easier to add elements to your site such as slideshows, audio and video.</p><p>e.g. Press Office, latest Annual Review</p><p>video - Its fine to write that Oxford has a wide diversity of students but it's better to show them and hear their accents</p><p>and there is you tube / iTunes U etc.*(NOTE: there are a few images on this slide, you may need to run it as a slideshow to see them all) </p><p>give the users more - slideshows, sharing, social media, video, podcasts etc.</p><p>The web is predominantly a text based medium but - like it or not - that's changing. Luckily it is also getting easier to add elements to your site such as slideshows, audio and video.</p><p>e.g. Press Office, latest Annual Review</p><p>video - Its fine to write that Oxford has a wide diversity of students but it's better to show them and hear their accents</p><p>and there is you tube / iTunes U etc.*(NOTE: there are a few images on this slide, you may need to run it as a slideshow to see them all) </p><p>give the users more - slideshows, sharing, social media, video, podcasts etc.</p><p>The web is predominantly a text based medium but - like it or not - that's changing. Luckily it is also getting easier to add elements to your site such as slideshows, audio and video.</p><p>e.g. Press Office, latest Annual Review</p><p>video - Its fine to write that Oxford has a wide diversity of students but it's better to show them and hear their accents</p><p>and there is you tube / iTunes U etc.*(NOTE: there are a few images on this slide, you may need to run it as a slideshow to see them all) </p><p>give the users more - slideshows, sharing, social media, video, podcasts etc.</p><p>The web is predominantly a text based medium but - like it or not - that's changing. Luckily it is also getting easier to add elements to your site such as slideshows, audio and video.</p><p>e.g. Press Office, latest Annual Review</p><p>video - Its fine to write that Oxford has a wide diversity of students but it's better to show them and hear their accents</p><p>and there is you tube / iTunes U etc.*(NOTE:...</p></li></ul>