1. Building Program Websites Presented by David Bonebrake Legal Services National Technology Assistance Project

2. Panelists Liz Keith, Pro Bono Net Kristy Boyer, Legal Assistance Foundation of Chicago Jeff Naragon, Immigration Law Center of Minnesota

3. Thank You to… Michael Bowen, Community Legal Services of Philadelphia Garrick Lipscomb, Legal Aid Society of Cleveland Bryan Baker, Iowa Legal Aid Pat McClintock, Iowa Legal Aid

4. A few questions… How many of you either maintain or have developed a program website? On a scale of 1 to 5, rate the robustness of your website For those of you who have a program site, does it link to the statewide website?

5. And a few more… How many of you attended NTAPs program website training at NLADA last year? How many of you attended the TechSoups content management training on June 10 th ?

6. AN INTRODUCTION TO THE WEBSITE LANDSCAPE

7. What makes a good website? Three basic components of all websites: Content Design Platform

8. Program Websites A program website provides an online storefront for your organization. It allows those individuals and organizations that are going to be involved with your program to learn more about it. Many peoples first impression of your organization will come through viewing your website.

9. Statewide Websites Provide a central portal of state-specific legal information intended to assist low- income persons and the advocates and pro bono attorneys that represent them. Based on Partnerships - A statewide website is a vision worthy of fulfilling.

10. Working with Your Statewide Website Advantages Resources for clients and advocates Efficiency Building stronger relationships Find your public statewide website here: www.lawhelp.org www.lawhelp.org

11. BUILDING A PROGRAM WEBSITE Preliminary Steps

12. Step 1: Build a Website Team Even if you choose to use a vendor for both design and development, there is still an extensive decision-making process Develop a decision-making team for the website Many programs have looked to staff members with web development experience or technical expertise

13. Step 2: Form a vision Determine what you want to see included on your website Look at what other websites have done Ask target audiences about what they want to see in a website Consider incorporating an online survey or web analytics software into your current site

14. Step 3: Evaluate what you have Take an inventory of available resources Are aspects of your current site salvageable? Do you have staff members who are interested in and capable of doing web work? Pro Bono designers or developers? Other web resources?

15. Step 4: Create a Functionality Requirements Document A functionality requirements document lists the functionality you ultimately want included on your site Content needs should drive the functional capabilities you would like to see in the site Error on the side of more Sample functional requirements document available at LSNTAP.org

16. HOSTING AND PLATFORMS

17. Website Hosting Hosting options: Shared VPS (Virtual Private Server) Dedicated Server Wide range in cost – though most programs needs put them closer to the low-end. Idealware Article: http://www.techsoup.org/learningcenter/w ebbuilding/page5671.cfm http://www.techsoup.org/learningcenter/w ebbuilding/page5671.cfm

18. Platforms LawHelp Open Source Proprietary Options Integrated Content Management Systems

19. LawHelp Program Site Template Enables stakeholder organizations to create and manage individual web sites Hosted and supported by PBN Programs can use unique domain name No technical expertise required Resources can be published simultaneously on the statewide LawHelp web site and on the individual program site

20. How is it being used? Program Web Sites

21. How is it being used? Special services, initiatives or events within programs

22. Low-cost customizations Custom header graphics Horizontal navigation bars Contact us/volunteer forms Other HTML enhancements Flash content RSS feeds Embedded videos Online donation options

23. Leveraging statewide content

25. Open Source Content Management Systems Open source platforms are free to download, use and customize Costs often involve paying vendors for setup and support Popular open source content management systems include Drupal, Joomla and Plone.

26. WEBSITE DESIGN

27. Website Design Elements Important design elements include: Layout Navigation Color Photos

28. Website Design Elements - Layout Home page - primary introduction to your program. Base your own site on others that you like. By the way: Don't neglect the inside pages - users will come directly to them from search engines No more than three columns on a page Center your layout Focus on content instead of decoration

29. Website Design Elements - Layout The Funder: ClintonFoundation.org offers a snapshot of everything happening access to everything on the site in one click can be overwhelming

30. Website Design Elements - Layout The Promo Site: www.lafla.org/ less busy than funder style focused on successes, upcoming events, news

31. Website Design Elements - Layout The News Site: slashdot.org entire focus of the front page is news in this case, community submitted and ranked news

32. Website Design Elements - Layout The Portal Site: Yahoo.com Directs users to a variety of other sites and services (on and off your site).

33. Website Design Elements - Navigation Best Practices: Let me know where I am, where I can go, where I have been Persistent navigation bar that shows where the user is on the site Show visited vs. unvisited links with different colors Differentiate hyperlinks from content For user ease, underline links and keep traditional blue color

34. Website Design Elements- Color General Color Theory Poynter Institute: http://www.poynterextra.org/cp/index.html http://www.poynterextra.org/cp/index.html Accessibility for the elderly, color deficient and vision impaired Strong contrast between text and background – best is dark text on light background Do not rely on color alone to convey information Use test simulators to check your designs for color blind issues: http://www.vischeck.com/vischeck/vischeckURL.php http://www.vischeck.com/vischeck/vischeckURL.php

35. Website Design Elements- Photos Take Your Own Photos Total control Not generic Need good photos Well lit Engaging Inviting See resources for tips and reviews of online tools Use Stock Photos Creative Commons Media for free use subject to certain restrictions Flickr Creative Commons Pool Other free photo sites

36. BUDGETS AND VENDORS

37. Website Budgets There is a significant range Robust websites for large program (75 person staff) -- $25K - $50K using vendor for both development and design Moderate Program Site -- $10K - $15K for using a vendor for design and development Small Site -- $6000 minimum using a vendor LawHelp?

38. No Budget? Dont Give Up Look for volunteers and staff with development and design experience Find the easiest solutions Download a free CMS LawHelp Consider blogging software

39. Blogging Software Advanced content management system thats designed to create a blog-style look on a website thats easy to edit Blogging software is capable of creating a non-bloglike feel The result: a very simple CMS that looks like a well-built website

40. Revolution Themes for Wordpress

41. Vendors Check with legal service programs and other nonprofits in your area List at LSNTAP.org Ask about nonprofit discounts Make sure they are comfortable working with the type of webpage you want

42. EMERGING WEBSITE TRENDS

43. Emerging Trends GIS RSS Video

44. GIS – www.quickmaps.com

45. RSS Really Simple Syndication

46. Online Video

47. Thank you! Questions? David Bonebrake – David@lsntap.orgDavid@lsntap.org Liz Keith – lizkeith@probono.netlizkeith@probono.net