Website Style Guide

The following guide is a comprehensive guide to the NCMEA Website, renovated in June of 2015. As there may be guest editors to the website, we ask that the following guidelines be adhered to in order to create consistency as well as continuity within the website and ultimately the organization. Questions on how to implement any of the following should be directed either to the executive director ([email protected]) or the webmaster ([email protected]). Deviations from the style guide below should be approved by the executive director. Guest editors who knowingly deviate from these styles may have their editor access revoked at any time and provided with notice of suspension from duties pending remediation.

To request editor privileges, please click here or on the link to the right.

Table of contents:

Guidelines for website consistency

  • Pages should only be created with the permission of the Executive Director and should be carried about by the website webmaster.
  • Guest editors should only edit their assigned pages.
  • Changes to themes, CSS, or other site-wide documents should be managed by the webmaster only.
  • PDFs, XML, Speadsheets, Word documents, and other embedded files are a last resort only solution. It is preferred that, in order to create a clean and functional website, all text be put into the website via the Visual or Text editor. This will allow the entire website to remain functional, searchable, user friendly, and not be bogged down by numerous files.
    • If you need assistance transferring one of these embedded file types into a page, please contact the webmaster at [email protected]

Website Vernacular

In order to foster consistency throughout the NCMEA website, the following vernacular should be used:

  • Governing Documents
    • Documents such as Bylaws, Policies and Procedures, Meeting Minutes, and other documents which may be important for the governing of the organization or a particular section of it
    • Private areas designated for members-only (ie. Directors Area) where personal contact information and other non-public information may be shared securely
  • Programs
    • Defined as recurring events or programs that are on carried on year to year such as MPA, Honors Chorus, All-State Orchestra, etc.
  • Events
    • Defined as one-time occurrences such as advocacy events, etc.

General Styling

Editing it WordPress

WordPress is a template-based website development tool that is open source and comes with a plethora of support available via www.wordpress.org. Edits should primarily occur using the "What You See Is What You Get" (henceforth known as "WYSIWYG") style editor. The editor view is referred to as the "Visual" editor and can be found on the right hand side on each page’s editor window. In this, basic formatting tools are available to help make editing and managing webpages easy.

The option to edit HTML is available via the "Text" window. If you do not know HTML or would feel more comfortable using provided formatting tools, please use the Visual editor view.

Note: If you do not see 2 rows of editor tools, there is a "toolbar toggle" button at the end of the row which will provide more formatting options

Headings

Headings are used to provide structure and framework to a page. These should be used to break up sections and provide guidance for readers to find the section or part of longer pages with increased amounts of content. Headings are structured in order to provide insight to relevance to a page as such:

Heading 1

  • Heading 2

    • Heading 3

      • Heading 4

Text

  • Font size is managed by the website theme. Though the option to change this is available for every page and post, it should not be utilized. Please see the section below on general styling for further information.
  • Font color is managed by the website theme. Though the option to change this is available for every page and post, it should not be utilized. Please see the section below on general styling for further information.
  • Justification of text should be:
    • Left aligned for section headings and paragraph text
    • Indented using a bulleted or numbered list for lists
    • Centered for certain page titles only
  • Paragraphs should not be indented

Links to internal pages

Links to internal pages should open in the same window. These links should say what is at the link and not the full hyperlink. Example: "Website Style Guide" Do this by:

  • type the text for the link (ie: Website Style Guide)
  • select / highlight the text
  • click the "Hyperlink" button in the visual editor (which resembles 3 pieces of linked chain)
  • choose the page you would like to navigate to (you may have to use search tool)
  • ensure the box beside "Open page in new window" is not checked, and
  • click "Add Link"

Links to external pages

Links to external pages should open in a new window. These links may say wither what is at the link or, if the hyperlink is going to an external homepage, can list the name of the homepage. Example: "Middle School Honor Chorus Audition Tracks" or "www.nafme.org". Do this by:

  • type the text for the link (ie: www.nafme.org)
  • select / highlight the text
  • click the "Hyperlink" button in the visual editor (which resembles 3 pieces of linked chain)
  • paste the link to the new page in the box labeled "URL"
  • ensure the box beside "Open page in new window" is checked, and
  • click "Add Link"

E-mail Addresses

E-mail addresses should contain both the text of the e-mail address, and the name of the person or entity who is being e-mailed. Also, all e-mail addresses should be hyperlinked. This is achieved by:

  • Type the name of the person/entity being e-mailed
  • type the text for the e-mail address (ie: [email protected])
  • select / highlight the text
  • click the "Hyperlink" button in the visual editor (which resembles 3 pieces of linked chain)
  • type mailto: and paste the link to the new page in the box labeled "URL"
    (example: mailto:[email protected])

    • Note: this may be done automatically, depending on the e-mail address
  • ensure the box beside "Open page in new window" is checked, and
  • click "Add Link"

Governing Documents

Governing documents such as bylaws, meeting minutes, and

Bylaws and Policy/Procedure Documents

In order to make bylaws a searchable document from the website search bar, bylaws and policy/procedure documents have been copied into HTML and are now editable via the WordPress WYSIWYG editor. Updates and changes should be handled via this editor. A printable PDF version of this document is also provided via a link to a document uploaded to WordPress. In the event that a change should happen, the following steps should be taken:

  • Perform necessary updates using WordPress WYSIWYG editor
  • Click on the button above the editor to "Upload Media"
  • Find and Permanently Delete the existing document
  • Upload a PDF copy of the updated document in question
  • Copy the link provided for the upload
  • Change the link at the top of the webpage to reflect the link to the new document

Members Lists

Members Lists tables have been carefully coded to allow for mobile-friendly viewing. Please only change existing text. If new positions or members are added, please contact the webmaster for assistance.

Advanced users note: Tables are styled as div tables and given id’s to control float and clearing. Use the HTML editing view to add new cells and utilize existing div id tags to maintain continuity.

Recurring Documents

Recurring documents are documents that are updated annually with things such as scales, required materials for auditions, etc. In order to limit clutter and load time for the NCMEA website, provide cross-platform solutions for the website audience, as well as create a more user-friendly interface for updating these documents, Google Folders will be utilized to provide these documents in the NCMEA Website. These folders will be provided to section/committee webmasters and chairs, housed in the NCMEA Google Apps account, and assigned editor privileges by the Executive Director and/or webmaster.

Managing Recurring Documents

Editors will be able to upload and manage these documents by:

  • Requesting a folder for your section/committee (one-time, if necessary)
  • Creating a folder specifically for a recurring document (one-time, if necessary)
    • All documents should be assigned to their own folder in order to maintain cleanliness of folders. Example: [Middle School] "Honors Choral Audition Tracks" should be a folder inside of "Middle School Choral" folder
  • Upload necessary materials

Distribution of Recurring Documents

Section/Committee Webmasters can distribute the contents of specific folders (such as audition tracks) by:

  • Right click on the specific folder
  • Select "Get Share Link"
  • Click "Share Settings"
  • Click "More Share Settings"
  • Choose "Anyone with the link"
  • Click "share"
  • Copy link
  • Paste link using the conventions for Linking to an External Page

Archives

Archives of old or outdated materials should be maintained in a separate archive folder. This may be done by:

  • Open (or create, if necessary) the archive folder inside your section’s main folder
  • Create a folder for the documents you are archiving naming it with the document name and the date
    • (example: [Middle School] "Honors Chorus Audition Tracks, 2014")
  • Open the folder where these documents being archived are located
  • Select all (ctrl+a or highlight them)
  • Right click on a file
  • Choose "Move"
  • Select the folder you are moving documents to
  • Click Accept
    • If a second prompt appears, click "Accept" or "Move"

Note: Website folders will be routinely audited to ensure that documents are current and appropriately filed inside of each section’s Google Folder.

Family Educational Rights and Privacy Act (FERPA) Compliance

In compliance with the Family Educational Rights and Privacy Act (FERPA), student names should be removed from any publically available document which reports scores of any performance. This includes audition results, MPA scores, and other documents which may contain results of student performance.

The preferred method for complying with this policy is to remove student names and instead provide each student with an assigned number that is kept private to the student. However, barring the ability to do so, these documents should be protected to members only so that directors can access the document and report their results to students privately.

At no point should student performance be aligned with their name or personal information on a publicly available document.

Forms

Forms may be provided in the NCMEA website as either an internal form or external Google Form. These are defined as:

  • Internal Forms
    • Forms in which responses should be e-mailed directly to an individual
      • Example: Scholarship Applications should go directly to the Scholarship/Awards Chair
  • External Forms
    • Forms in which responses should be compiled in a spreadsheet
      • Example: Event Registration

Internal Forms

Internal forms should be managed by the Executive Director. To request an internal form, please contact Pat Hall at [email protected]

External Forms

External folders may be managed by Section/Committee webmasters or chairs. All forms should be housed in the section’s provided Google Folder in a separate folder entitled "Forms". Themes will be consistent for all Google Forms. At the time of creating one of these forms, please e-mail [email protected] so they may update the form theme to align with the NCMEA style guide. Do this by:

  • Open or Create a "Forms" folder in your provided Google Folder for your section/committee
  • Create a new form
  • Edit the form (for support, please see Google Support)
  • To distribute the form, click the blue "share" button in the top right
  • Paste link in its appropriate place using the conventions for Linking to an External Page

News

All news items must be sent to the NCMEA office ([email protected]). We encourage news about our members and member activities. We would like to include notices for workshops/celebrate special recognition of members i.e. TOY (school, county, statewide), special certifications, published articles, newspaper or TV feature stories/community activities/etc. The NEWS section of the website will only be as informative as information that is shared with the NCMEA office.

Calendar

Google calendars do not integrate with the WordPress website. The NCMEA office will request all Section & Committee calendars in July/August each year. At a minimum we would like dates for all NCMEA sanctioned student-events including auditions, clinics, All-State, MPA events with date, time, location and contact for the event.( Honors events will be included with the Conference schedule.) In addition we would like to include dates of Section, District or Committee meetings. Please include date, time, location and contact. You may send Calendar information to the NCMEA office at anytime throughout the year. Again, the calendar will only be as useful as the information shared with the NCMEA office. 

Jobs

All job announcements must be sent to the NCMEA office. Job announcements from NCMEA members will be posted free of charge. As small fee (TBD) may be requested from non-members to post job announcements. Format TBD.