The Complete Nonprofit Website Toolkit Fleshing Out an Accessible, Usable, Polished Website July 2013 1
Your Course Page Designated Office Hours: Fridays 1-2 Eastern Join us to ask us questions about your specific website. Wait for the recording to begin The Complete Nonprofit Website Toolkit Fleshing Out an Accessible, Usable, Polished Website July 2013 2
Introductions Elizabeth Pope Idealware s Senior Researcher What Content Do Your Visitors Want? 3
What Do Your Visitors Want? Not just goals but content How do you know? Ask them, through Interviews or Surveys Website Analytics Interviews and Surveys Like in the last class You can use the information you used to help define your vision, or do a round of research now. Website Analytics Google Analytics: Free, powerful, and attractive tool with some learning curve. The Webalizer: Simple, open source, method for collecting data about your users. 4
How Do Visitors Use Your Site? What Pages Are Being Visited? What Pages Aren t Being Visited? You may be surprised by the results. 5
Key Question What Pages are People Spending Time On? It s not always a good thing How Are People Getting Around Your Site? How many steps does it take for them to find what they need? 6
Can You See Your Search Engine Terms? Key Question Writing Content for the Web 7
More Text is Not Better In fact, it s much worse than just the one thing each individual users want to know if you can figure out what that is. Make Text Scanable Most people don t read every word of text on a website. Rather, they scan the page for the information they are looking for, or something that catches their eye. Be Brief Limit your paragraphs to a single topic. Cut word count in half or more on general pages. 8
Chunk Text for Ease of Scanning Grouping related links and using bullet points simplifies the page and makes it easier to parse Remember Mobile Visitors Key Question 9
Search Engine Optimization What is Search Engine Optimization? Polishing your website so that it appears high in search engines Six Steps to Optimizing Your Site Step 6: Consider Google Grants Step 5: Ensure a SEO Friendly Site Step 4: Place Keywords in Prime Locations Step 3: Choose Keywords for Your Site Step 2: Encourage Others to Link to You Step 1: Create a Site Worth Finding 10
1. Create a Site Worth Finding A great, content rich site, full of fresh content, will 2. Encourage Others to Link to You Ask your partners to link to you, and get links from large directories. 3. Choose Keywords for Your Site Start with the phrases associated with your organization Don t forget misspellings, or alternate spellings 11
4. Place Keywords In Prime Locations Images don t count! Prioritize headers and more prominent text Sheer quantity helps But don t forget to communicate and inspire to action 5. Ensure an SEO Friendly Site Spiders can t follow Javascript or drop-down menus Linking to a sitemap from your homepage can help 6. Consider Google Grants Thousands of dollars worth of free Google Ads Apply online at: www.google.com/grants/ 12
Key Question Plan Out Your Content The text and resources are the heart of your site. Based on all these considerations, define what text needs to be included, created or updated. Considering Accessibility 13
It Should Be Accessible to Those Who Are color blind Can t see well It Should Be Accessible to Those Who Have difficulty using their hands Are deaf It Should Be Accessible to Those Who Don t speak English well Are not familiar with US or technology norms Don t have a fast internet speed Are not very familiar with technology 14
These People See the Web Differently They may need to rely on screen readers, or keyboard shortcuts, or view a page very close up or without any sound. Make Your Text Itself Accessible Splitting up text into scanable chunks is good for those who may have difficulty seeing, as well as those who aren t very literate, aren t technologically literate, or don t speak English well. Provide Alternative to Images If images, video, or icons convey important information, provide an alternative for people who may have difficulty seeing. This may include alt text. 15
Make Your Text High Contrast and Legible Keep text a dark color on a white background. Remember Screen Readers Make sure that the physical order is the same as the visual order. Name Links Accordingly They should have names that describe what function they serve, not something generic. 16
Skip Navigation Consider a Skip Nav link to let those using screen readers or keyboards can skip to the content they want. People Who Can t Use A Mouse Think about keyboard navigation, can you use the tab key to move in a logical order? Code Your Pages According to Standards Browsers will, in general, automatically support tools like screen readers, and navigation by keyboard. 17
Key Question A Special Case: Form Design Use the Right Form for the Job Radio Buttons (select one) Check Boxes (select some or all) Dropdown (can save space, if the options are likely to be obvious) 18
Give Users Enough Space But Keep Your Content In Check When creating new forms, ask yourself: Are you going to use all of this information? Fax numbers, middle names, employers? Will you alienate users with too many questions? Can your users quickly understand and answer your questions? Mandatory Fields Make certain that mandatory fields are clearly noted, and that any error messages clearly show the mistake. 19
How Do You Know if it s Working? User Tests Helps you understand how your site is being used by real people to meet a goal. Recruit 3-4 users for each type of thing you want to test. Ideally, get people who would actually use the site. But any testing is better than none. Just Sit Down With Them Sit down with them in front of a computer and your website. Give them the mouse and keyboard and let them drive. Ask them what they re thinking. 20
Ask Them to Take on A Task You could plan the task in advance, or ask them to think of one on the fly that allows them to explore on their own terms. Try to Involve Your Whole Staff Setting up a video camera to record, or recording the screen and an audio track, can be a powerful way to convince others there are limitations and challenges with your site. Your Site, Page by Page 21
So That s A Lot How do you think through the key issues that you might want to address in the near term? First, Start With 10-15 Core Pages For instance, in addition to your homepage, you might prioritize your programs pages, event calendar, and donation page. Think Through How Each Page is Working What do web analytics tell you about the page? Is the page easily scannable? Accessible? Usable? Could you do more to optimize it for search engines? What would you ideally change about it? 22
You Don t Think In Detail About Every Page For example, you may have many sites that are virtually the same. Pages describing your programs or events, for example, may be identical. But You Need to Plan The Content Based on your vision, and the desire for accessible, usable, and scannable content, define what text needs to be included, created or updated. To Ensure A Great User Experience 23
Your Homework Homework: Fill out the worksheet on the course page Taking it a step further: Take a look at your site analytics Create a content plan Do some user testing Questions? 24