Enhancing Your Clinics Web Presence - PowerPoint PPT Presentation

1 / 44
About This Presentation
Title:

Enhancing Your Clinics Web Presence

Description:

CSS determines a consistent colour, font, and layout for all your web pages ... An example of the ultimate wiki is Wikipedia. ... – PowerPoint PPT presentation

Number of Views:108
Avg rating:3.0/5.0
Slides: 45
Provided by: Delli9
Category:

less

Transcript and Presenter's Notes

Title: Enhancing Your Clinics Web Presence


1
Enhancing Your Clinics Web Presence
This presentation has been adapted from a version
generously shared by Kevin Smith at Parkdale
Community Legal Services
  • Presentation by Fiona MacCool, CLEONet Project
    Managerwww.cleonet.ca

2
Agenda
1. Preliminary Considerations
2. Phases in web site development
3. Intended Audience/Vision
4. Structure/Flowchart
5. Design Issues
6.Content development
7. Ongoing Maintenance
3
1 Preliminary Considerations
  • First some preliminary considerations
  • WEB HOST
  • You need to find a company to host your web site
  • You can rely on a local ISP (Internet Service
    Provider) and have your hosting bundled with
    connectivity you are already paying for
  • You do not have to bundle these together so ask
    around to see what web host other social service
    agencies use and trust.
  • Your web host doesn't have to be in your home
    town, it could actually be anywhere in the world,
    as long as it is accessible on the Internet.
  • Also, remember hosting has gone WAY down in price
    in the past 5 years. You can host a dynamic site
    with tons of add on features for less than 15
    per month.
  • Try Siteground if you are interested in Open
    Source free web applications that can be
    installed for free.

4
1 Preliminaries contd
  • 2. DOMAIN NAME
  • If you want your site to have a unique Internet
    address like www.abclegalclinc.org instead of
    www.TorontoISP.com/abclegalclinic you have to
    register a domain name.
  • your web host can help you with this
  • One place where you can pick up a domain name is
    with Network Solutions www.networksolutions.com

5
1 Preliminaries contd
  • 3. WEB PAGE SOFTWARE
  • you can purchase a web site development program
    (such as DreamWeaver, or Microsoft FrontPage)
  • Recommended - You can use a Content Management
    System (CMS) which will have done the programming
    for you and allow you to maintain it easily
    through a web-based interface
  • Your web host may offer a web-based site builder
    tool that will use templates that you can choose
    from
  • You can download the web site template LAO
    developed for clinics (the Rexdale web site used
    the LAO template)
  • If you are using a volunteer or a college student
    they may already have some web site development
    program or template.
  • You can write a web site in .html but it is a lot
    of work

6
2. - Phases in site development
Phase 1
Phase 2
Phase 3
Phase 4
Phase 5
Phase 6
Site Design Elements
Information Architecture Basic
Structure
Site Definition Planning
Site Construction Content
Site Publishing Promoting
Tracking/ Evaluation/ Maintenance
7
Phase 1 Site Definition
  • VISIONING
  • Have a visioning or brainstorming session with
    all staff and board where you talk about a web
    site vision - what do you want your web site to
    do for your clinic? Your board? Your community?
  • Start by asking these tough questions as an
    entire organization
  • What are we trying to accomplish with our web
    site?
  • Who will be involved in the day to day work of
    maintaining the site and how can this be shared?
  • What will and will not translate well into the
    online world?
  • What makes your site different? What web sites
    are already out there that you can link to or
    work with?

8
Phase 1 Site Definition
  • VISIONING
  • Start by thinking of the three main things a web
    site can do
  • Provide information
  • What information do you want to provide and how
    can you translate it best online?
  • Gather information
  • What information could your clinic get from
    users of your web site that would help you in
    your work?
  • Allow people to work together online
  • For what purpose? With whom? How would we best
    facilitate this work? What will NOT translate
    well online?

9
Phase 1 Site Definition
  • VISIONING continued
  • Will your site be fairly static? an online
    virtual clinic pamphlet
  • - OR-
  • Will it be dynamic, and offer
  • downloadable PLE materials
  • interactive campaign or community organizing
    materials,
  • event or workshop registration
  • online fundraising
  • member board member recruitment
  • blogs to allow your community to provide comments
    on your work or on specific issues
  • online intake assessment forms
  • password protected areas for clinic staff to
    archive documents
  • an e-mail bulletin tool to keep users up to date
    on your activities

10
Site Definition contd
Who Will Visit?
Clients
Local Agencies other clinics
www.abclegalclinic.org
Community Groups
Media Politicians
Broader Community
11
Site Definition contd
  • AUDIENCE
  • Your audience will be viewing the web site for
    a specific reason and it is important to know
    exactly what they are looking for when they visit
    the site. Keep asking yourself why would they
    bother to visit your site?
  • Keep in mind
  • Audience Characteristics (age, literacy,
    language)
  • Information Preferences (print vs. electronic)
  • Computer Specifications(broadband vs. dial up)
  • Web Experience(limited or savvy)

12
Site Definition contd
  • Possible Vision Statement
  • Our web site will describe our services and help
    our clients get the legal information they need
  • Our web site will provide our community with
    tools for self-help, community development and
    help us organize movements for social change
  • Our web site will be a tool in helping our clinic
    to be more accessible
  • Our web site will be a tool for recruiting
    members of our community to our membership, our
    board, and our actions and campaigns

13
Phase 2 - Information Architecture
Concept Map
Flow Chart
Story Boards
Brain Storm
Do a brain storming session for possible content
with audience in mind
Develop a concept map to get an idea of
rough structure
Put together a flow chart - all the
elements in a logical flow
Create story boards of the web pages to put
all the elements together
14
Information Architecture contd
General Clinic Information
Contact Info (hrs, Address, Phone )
Clinic Mission Vision
Map of area
Strategic Plan
AGMs Annual Reports
Newsletters Other Archives
15
Information Architecture contd
Clinic Services Information
Who We Serve Dont Serve
Referrals/ Specialty Clinics
Intake Hours
Newsletters Other Archives
16
Information Architecture contd
  • Dynamic Content

In The News feeds from CLEONet
Legal Victories
Campaigns Demos
PLE Materials feeds from CLEONet
Press Releases
Staff Milestones
17
Information Architecture contd
18
Information Architecture contd
  • CONCEPT MAP
  • A diagram with nodes or cells containing
    concepts, items or questions, and labelled links
    with direction arrows to associate them with each
    other.
  • Helps to explore new info and relationships, to
    design structures or processes (web site in our
    case)
  • You can do this with sticky notes on a wall
    very low tech!

19
Information Architecture contd
  • FLOW CHART
  • A flow chart is more formal type of concept map.
    It is generally a tree rather than a spider
    shape.
  • A web site flow chart will have the home page or
    main navigation pages at the bottom or side, and
    flyout pages and sub-pages branching off
  • A flow chart will help you clarify the relations
    between the parts.

20
Information Architecture contd
  • STORYBOARDS
  • You can create storyboards as a page by page
    representation of your web site. The one on the
    left has six parts
  • PROJECT ID your name, web site project name
    date started
  • PAGE ID screen ID, page title and notes for
    this page
  • DATE - date of creation/editing to keep track
    of updates
  • PAGE DRAWING the content, graphics and any
    media pieces you can cut and paste to your web
    page from here
  • NAV - the navigation to/from this page of the
    site (from the flow chart)
  • PROGRAMMING NOTES e.g. list of hyperlinks ,
    names of graphics files, navigation breadcrumb,
    design elements font type, size, formatting of
    headings/sub-headings (with CSS this is stated
    once copied to all pages)

21
Sample Home Page Wire Frame
22
Example of a basic site map
23
Phase 3 - Design Issues
  • You want your web site to
  • have a clear structure
  • be visually appealing
  • be informative
  • user-centered
  • accessible
  • scannability chunking
  • Searchable?
  • multiple languages?

24
Design Issues contd
  • Cascading Style Sheets (CSS)
  • You should use cascading style sheets to design
    your site, rather than tables or frames
  • CSS determines a consistent colour, font, and
    layout for all your web pages
  • Recommended - If you use a CMS to build your
    site, this will be taken care of and will make
    maintenance much easier

25
Design Issues contd
  • Scannability/Chunking
  • About 80 of web readers scan pages, and only for
    a second or less. For scannable chunked text
  • format with headings
  • use subheadings for each paragraph
  • bold key phrases (highlight 3X as much as
    normal).
  • inline graphics to guide the eyes or illustrate
    points which would normally require more words
  • bulleted lists
  • short sentences with one or two ideas per
    sentence
  • only one point per paragraph
  • short paragraphs, even one-sentence paragraphs
  • start page with short summary (inverted pyramid)
  • Have interesting white space

26
Design Issues contd
  • Accessibility
  • To be accessible to the disabled, web pages and
    sites must conform to certain accessibility
    principles. According to a Wikipedia article, you
    can ensure accessibility following these tips
  • provide succinct text descriptions for images,
    multimedia
  • use hyperlinks that makes sense when read out of
    context. (e.g. avoid "Click Here.")
  • Use CSS, don't use frames or tables for
    layout
  • author the page so that, when the source code is
    read line-by-line by a screen reader, it remains
    intelligible. (Using tables for design will often
    result in information that is not)
  • Avoid blinking, scrolling text and animated
    graphics, use high contrast colours
  • Recommended - Note that most CMS software tools
    have accessibility integrated out of the box

27
Design Issues contd
  • MOCKUP -
  • It is helpful to do a mock-up of your homepage
    and look at it using your browser.
  • This gives a visual representation of the design
    elements, and seeing the navigation buttons
    together gives some idea of the logic of the
    structure.
  • The mock-up to the right is from the OPICCO web
    site, redeveloped in Drupal.

28
Example of a mock-up
29
Phase 4 Content Development
  • Do a division of labour, to have people type up,
    or cut paste, the content into the various
    storyboard pages
  • It is useful to create a shared network directory
    where all these files are saved
  • Make sure they use as little formatting as
    possible the CSS supplies most of the formatting

30
Content Development contd
  • Using the web page development program or
    content-management system, you then format and
    link up all the pages before they are sent for
    publishing
  • You forward the files to your web host so they
    are published on your site or use your CMS to add
    content through a password protected web site

31
Phase 5 - Publishing Promoting
  • Announce your new web site in your clinic
    newsletter, in a flyer to local agencies
  • Pass your link onto LAO and other clinic and
    agencies, so they can list your clinic in their
    links
  • Integrate the web site into all of the work that
    you do

32
Phase 6 Maintenance/Evaluation
  • ISSUES
  • Will your clinic have one webmaster or
    collaborative management?
  • You should develop some web site protocol rules
    about content
  • Your web site should have a privacy statement
    cookies, etc
  • Assign responsibilities for ongoing upkeep e.g.
    e-mails, adding new content etc
  • Assign responsibility for evaluation review
  • Recommended - Work with us at CLEONet to
    integrate our automatically updated feeds and to
    find out how much traffic your content is getting
    on our site

33
What is CLEONet?
  • More than just a web site, CLEONet is an online
    clearinghouse for community legal education in
    Ontario.
  • CLEONet is for community workers and advocates
    who work with low-income and disadvantaged
    communities.
  • CLEONet offers you one place to go to find
    hundreds of resources, news, and events on a wide
    range of legal topics.
  • CLEONet also provides feeds of our headlines to
    your web site. Keep your site up to date with the
    latest PLE resources, news, and events on legal
    issues facing low-income and disadvantaged
    communities in Ontario.

34
CLEONet Home Page at www.cleonet.ca
35
Add CLEONet Feeds to Your Site

36
CLEONet Content Feeds - Examples
Community Advocacy Legal Centre Legal
Information Pages
Under their own information, they offer the
CLEONet feeds by subject
37
Other examples of CLEONet Feeds
Rexdale Community Legal Clinic Home Page Feed
to Latest CLEONet Resources
Justice for Children and Youth under Online
Resources Feed to CLEONets Latest Resource on
Legal Issues for Children and Youth
38
OPICCO has a page for each area of law CLEONet
covers with resources and news feeds
39
Samples of Online Tools
  • Drupal is an open source content management
    system that allows an individual or a community
    to publish, manage, and organize a wide variety
    of content. Drupal can support a diverse range of
    Web projects, including content management
    systems or blogs. It has its own search engine,
    is accessible and has customizable themes in
    case you dont have for a designer.
  • Here is a site I built in Drupal for OPICCO
  • www.opicco.org
  • For more information on Drupal visit
    http//drupal.org/

40
Drupal specific features to consider
  • Do you want your site to have members or
    password protected areas?
  • Do you want people to be able to post comments
    to the site?
  • Do you want a discussion board on the site?
  • Do you want to create a blog to document your
    work or tell a story?

41
Samples of Online Tools
  • Blog is short for weblog. A weblog is a
    journal (or newsletter) that is frequently
    updated and intended for general public
    consumption. Blogs generally represent the
    personality of the author or the web site.
    Generally they make it very easy to add content
    quickly and encourage comments and responses by
    readers.An example of a social justice blog is
    The Poverty Blog at http//poverty.thespec.com
    / created using Typepad.
  • An example of a blog on PLE is
    http//plei.wordpress.com/ - a research blog
    about public legal education (PLE) in Canada.
    This blog is created using a free tool called
    Wordpress.

42
Samples of Online Tools
  • Wiki - online collaboration model and tool that
    allows any user to edit some content of web pages
    through a simple browser.
  • An example of the ultimate wiki is Wikipedia.
    Visit http//en.wikipedia.org/wiki/Legal_aid to
    see the Wikipedia entry for Legal Aid. Click
    edit to try it out.
  • While Wikipedia is edited by millions of people
    you can create a wiki for a select group to
    collaboratively work on a document. Imagine an
    intake manual that lived online and could be
    updated by all clinic staff!

43
Some On Line Resources
  • TechSoup.org - The Technology Place for
    Nonprofits provides nonprofit organizations with
    technology information, products and community.
  • Web Style Guide an online book
    www.webstyleguide.com
  • Web Developers Virtual Library various
    articles on developing web sites www.wdvl.com
  • American Bar Assn Best Practice Guidelines for
    Legal Info Web Site Providers
    http//www.abanet.org/elawyering/tool/practices.sh
    tml
  • Jiliane Smiths Web Site Check List
    http//corkuniversitypress.typepad.com/cork_univer
    sity_press/files/jss_web siteChecklist.pdf

44
Ask for Help and Keep in touch!
  • Fiona MacCool
  • CLEONet Project Manager
  • Community Legal Education Ontario
  • T 416-408-4420 ext. 29
  • E-mail fionamaccool_at_cleonet.ca
  • Web site http//www.cleonet.ca
Write a Comment
User Comments (0)
About PowerShow.com