Training Notes for Orientation

Before the Session

  1. Clean the Sandbox, removing old training content.
  2. Give everyone access rights to the Sandbox and their own websites.
    • Confirm with site contacts before giving access to websites for attendees that we haven't received prior notification for.

I. Welcome and Agenda

Welcome to CHSSWeb and the CHSSWeb Orientation. We’re happy to have you here.
  1. Make introductions (participants and CHSSWeb/MarComm team).
  2. Ask them what they are expecting from the session.
  3. Give the very briefest of overviews of the system:

“CHSSWeb is the content management system developed by the CHSS IT team to support the many websites of the college. This – like all web things – is a work in progress. We hope the system will work well for you and meet your web needs. It is designed to make your work easy, quick, relatively painless, and (we hope) fun. But at the same time, we want you to work with us to identify glitches, inconsistencies, problems, and things that are confusing so that we can address them. Together we can make this a really useful and robust system.”

What makes CHSSWeb different:

  • It is actively developed here in the College, with the IT team adding new features and tools to fit the needs of the College.
  • It makes use of authoritative University resources to pull in information.
  • It provides unique content sharing tools to share content from and with other CHSSWeb sites.

Refer to the "What is CHSSWeb" page.

Your website is an important tool for communicating with your audiences. The most successful sites are the ones that are actively used and treated as a tool rather than "something you have to do".

Here’s what we are going to do today: Go over agenda (see Agendas under training tab in chssweb help).

II. CHSSWeb2: The Help Site

  1. Start with the CHSSWeb help site on the screen – chssweb.gmu.edu
  2. Show site briefly
  3. Point out navigation. Go over the subnavigation.
  4. Stress that everything covered in this training is on the site and much, much more. This should be the first thing Editors look to for information on how to do something.

III. Your Website

  1. Display a good example of a CHSS website and briefly go over the different parts and how these parts work as a whole. 
  2. Briefly explain what’s an application (Articles, Events, Courses and People).
  3. Point out that articles can be utilized 3 different ways on the homepage (Marquee, featured full articles and news briefs).
  4. Mention that events and articles have to be featured in order to appear on the homepage
  5. Show the available text areas. The main text and the additional text (optional).
  6. Click a link in the main navigation bar and go to a page (preferably one with a drop down menu). Briefly go over the left-side navigation explaining that they are viewing a section containing multiple pages and they’ll learn more about sections and pages after logging in.
  7. Give a basic explanation of why there is an audience nav and main nav. Advise which type of content goes into each nav and why it should remain separate. 

Giving an overview of the website helps new editors understand the different pieces that make up their site and builds a connection during the how-to portion of the class.

IV. Logging in

Have people login to their own websites and point out the most important aspects of the site behind the scenes.

  1. In browser window, type your site's URL/login  (e.g. english.gmu.edu/login)
  2. Username – Mason user name
  3. Password – Mason password
  4. Go over Dashboard briefly noting in the most general way the following  (Don't get bogged down in specifics.).
    • Rankings and smiley
    • Navigation (top and left)
    • Top right -- the all important Help link "?" -- which will take you directly to the help site.
    • Site Manager and Contact.
    • If you CAN'T find what you need on the site or are confused by something, contact us.
    • Stress that every instruction on our help site begins "From the Dashboard".

V. Switching Sites

Have people switch focus from one site to another.

  1. Using the select box at the top of the left-hand navigation, select "CHSS Sandbox Department".
  2. Note that the dashboard has changed. It now shows the statistics on the chssbox sites and its fellow utility sites.
  3. Click the "Pages" link in the left-hand navigation.
  4. All of the left-hand navigation now defaults to displaying the content related to the selected site, chssbox.

VI. Pages and Sections

Click “Pages” to discuss Pages and Sections on their site.

  • This is the view of your site you will work with most often. It’s important to become very familiar with it. As sites get bigger and bigger with more and more pages, it is important to keep the pages organized and easy to find.
  • Discuss the first section and first page: On every site the first section is the root . On every site the first page under the root the home page. You shouldn't ever delete these or edit the name or else you'll break your site. These are "hands off".
  • Go over the remaining main sections: They represent the main links from the main navigation on your site. This varies too much from site to site to give an overview, but many sites have links/pages such as: contact us, about, research, undergraduate, graduate, prospective.
  • Teach them difference between pages and sections.
  • Open and close the sections to see pages: Click the "+" on a section to see the pages; click again and the section closes and collapses the pages.

Note the URLs: Sections give URLs to pages; if you type section URL alone, you get the first page in the section.

  • Open the Undergraduate or Graduate section.
  • Note all the pages in the section once you open it.
  • Scroll over the View link and note at bottom left the URL for each of the pages.
  • Note that if someone moves the page OUT OF THE SECTION, the URL for the page will change.

Editing pages and sections:

  1. To edit a page, on the page bar click "Edit".
  2. To view a page, on the page bar, click "View".
  3. To add a page, you click "Add a Page" to the section you want to add a page to.
  4. You can also reorder pages and sections, edit their names, edit their content, change their URLs, add new pages and sections, and a lot more. BUT since this is live website, it isn’t a good place to “play” so we need to go to the Sandbox.

Have each participant create their own section of the Sandbox and pages in that section. Gradually teach editing with each person in their own area. Remember to go slowly and do things systematically so that they all can follow.

  1. Lead each participant to create his/her own corner of the Sandbox. From the root – create their own section in the Sandbox; name it with your name: Katie’s section
  2. In your section, create a new page: e.g. Katie’s favorite page
  3. Go through the basic fields for a page: Name, content, publish
  4. Save
  5. Check
  6. View all on the live site: Note the name; note the URL that was automatically created. Explain how URLs and page Names connect. Go back and edit URL.
  7. Have them create another page within their section. Explain the WYSIWYG and how it can help organize their content using the correct headings and other tools. Walk them through:
    • Adding a link
    • Adding content to the additional text area
    • Attaching an image to the page
    • Saving and viewing
  8. Have them create a new section within their section: Example: a section for your favorite students Katie’s favorite students; Save. Check to see that everyone has done it.
  9. Note name and URL; since the page gets its URL from the section, make sure the permalink (URL for the page) is minimal.

Reordering Pages and Sections

  • Demonstrate doing this while others watch
  • Click and drag a section and move it above/below another
  • To do this, click/hold on center of bar and move slightly to right
  • Drop when you see the blue-colored bar appear where you want the section to appear
  • Do same for a page: reorder pages and move back
  • View the page or section moved to see that the reordered navigation.
  • DON’T EVER MOVE THE HOME PAGE– it needs to be the first page in the root or the whole site will break.
  • Tell them the first page in the section will be the one you get when you type in the section's URL. So reordering affects it. Demonstrate this point with one section, like Graduate. Type /graduate and show what happens. Reorder the first page and type /graduate again. Restore original order.
  • Stress: Move things around on your site very thoughtfully.

URL and page-naming convention

  • This system has a new URL convention – we don’t use abbreviations, we don’t use dashes, we try to spell things out.
  • As with the sections, we’ve named the pages and given them URLs in a very intentional fashion, keeping in mind how they will work with the section names/URLs.
  • Put new pages in the right sections, and think about the URL very intentionally.

Best Practices for pages (see webpage on this in the help site)

  • Keep sentences short.
  • Keep text short (explain why)
  • Use heading from the Format drop down menu for subsections on a page. Don't use bold or caps or number or italics to make headings on your pages. Use the pre-formatted headings for a clean, professional look to pages that will be consistent across all your pages.
  • When copying from a Word .doc (or any kind of document from a word processing program), use the Paste from Text box in the wysiwyg window. Demonstrate where this is.
  • MOST IMPORTANT: Refrain from using hard-coded links within the text on pages. There are times to do this but they are very rare. The new best practice: don't put hard-coded links within the text. You can add links to the resources but you do it using the Resource Application. The links you want to give are there - they are added in Content Blocks at the bottom of pages. Show them a few of these on pages. Why?
    • Links break as web pages change. Requires updating.
    • If you put the same link on more than one page, which happens often, you need to change it one each page when the link changes. Requires updating and remembering each page where the link is.
    • If people are viewing your site on a phone or small device, their fingers will accidentally hit link and take them off site; put links at periphery of pages.
    • More on resources and content blocks later.
  • Discuss accessibility
    • Reiterate the importance of accessibility from a diversity and equity standpoint.
    • Discuss the importance of adding ALT and TITLE tags where appropriate.
    • Recommend against using images of text such as flyers and graphics. Why not?
      • These are not read by most screen readers.
      • Are not responsive.
      • Can cause visitors who rely on assistive technology to miss critical information.
      • May result in complaints to the University or State.

VII. Articles

Teach them how to add a very basic article -- full article. Don't make it complicated, but teach them to add an article using the minimum fields.

  1. Create a new article. Choose full; use Main Content.
  2. Save. Check on news list page.
  3. Feature to home page of Sandbox. View it live. 
  4. Have them go back to edit their article’s type, changing it from “Full” to a news brief type. Explain the purpose of news briefs. 
  5. Save and view. Point out their article has changed locations on the homepage.
  6. Demonstrate the URL link (redirect) by deleting any main content. Add a link (https://www.gmu.edu). Save and view. Refresh the homepage and click the news brief. The news brief now links to Mason’s homepage.
  7. Switch the article's type back to full.
  8. Point out any other basic features of articles (blockquote, sidebar, thumbnails and images).

VIII. Events

Teach them how to add a very basic event -- same approach as Articles.

  1. Create a new event.
  2. Demonstrate the Category tool and have them add a category to their event.
  3. Save. Check on events list page.
  4. Feature to home page of Sandbox.
  5. Find a recent event on their own website and associate with Sandbox.
  6. Save and check. Does it appear on home page? Critique titles and subtitles.
  7. Go over the RSVP feature.
  8. Point out any other basic features of events.

IX. Web Style Guidelines

  1. Start with the Web Style Guidelines page on the screen - https://chssweb.gmu.edu/strategy/web-style-guidelines
  2. Briefly explain what search engine optimization is and why it is important.  
  3. SEO best practices - Discuss headings and subheads, keywords, hyperlinks, and mobile optimization.
  4. Content guidelines - Recommend 300 words, 500 max on a page. Mention sidebar and accordion tools. Discuss Mason brand for tone and style and mention the Mason Brand Guide and Editorial Style Guide (https://ocm.gmu.edu/mason-brand) and the CHSS Marketing and Communications website (https://marcomm.chss.gmu.edu/) as additional resources. Put links in chat. 
  5. Photo and video guidelines - Emphasize high quality and resolution, alt text, and not using images with text.

X. Parting Words

  1. Thanks for coming.
  2. Don't wait too long before beginning to edit.
  3. Check help site! chssweb.gmu.edu
  4. Write chssweb@gmu.edu if you have problems.
  5. Additional training. Check out our upcoming events or reach out to us.

After the Session

  1. Update the Last Trained Date for each new editor that attended the training.
  2. Remove access for any new editors that did not attend.
  3. Add new editors to the CHSSWeb Users Teams group.