Skip to main content
Contact Us envelope

Web Style Guide

One College, One Website.

Web Editing

The Web Services team makes it easy to keep web pages accurate and up-to-date. Content owners, generally department heads, can designate two content editors who are authorized to make changes to their web page. If you are a designated content editor and need to edit your page, email:  ITServiceDesk@MontgomeryCollege.edu. The Web Services team will do the technical work for you, making sure your web content has the necessary coding to comply with the latest standards for style, accessibility, and quality.

In your email, please include:

  • A link or the URL for the page you want to update
  • Details of the changes you want to make.

A few content editors who need edits on a daily basis have been given limited access to the content management system. That access is reserved for employees for whose official job description includes web content management as a significant portion of their job responsibilities. They are expected to stay abreast of the latest legal, style, and accessibility requirements, and their work is reviewed by the web communications group before it is published.

All pages, regardless of who edits them, must comply with the web and other style guides detailed below.

Web Style Guide

The Montgomery College website must meet the requirements laid out in this web style guide, the brand style guide, and the editorial style guide. The “MC website” includes all pages with montgomerycollege.edu in the address. If your page does not comply, the Office of Communications may revise or remove it.

Web Content Guidelines

Most people scan web content rather than read every word. It is best to keep your pages concise and straightforward. Use the following guidelines in writing for the web.

General Guidelines

  • Keep your audience in mind when creating web content.
  • Use plain language and a conversational tone. Avoid jargon.
  • Keep sentences and paragraphs brief.
  • If you have access to the content management system, do not create excess pages. Use the appropriate CMS snippets, assets, and components to consolidate pages whenever possible.
  • Page layout and formatting must be consistent with the design of existing page templates.
  • Format and break up longer content with subheads, bulleted lists, numbered lists, or appropriate CMS snippets and components as needed.
  • All text on all pages should be left-aligned.
  • Only use italics when needed to match editorial style guides (e.g., in publication titles, etc.).
  • All written content should be consistent with the voice and tone of the MC website. Examples:
  • Avoid creating duplicate content. Make sure you are not recreating a page that already exists on the MC website. For example:
    • Link to a course description in the catalog rather than repeating the course description on your page.
    • Link to the academic program, degree, and certificate pages in the Programs, Majors, and Degrees section in OU rather than creating new pages.
    • Link to the main campus directions pages rather than repeating maps or directions on your page.
    • Use the Important Dates Featured Block asset to place upcoming registration dates on your page rather than typing in the dates yourself.
    • Do not upload your own versions of program advising guides or advising worksheets. Instead, use the files that are already on the website, which are automatically updated with the most current information.
  • Do not link to pages in the academic catalog other than Montgomery College Catalog homepage. Instead, link to the relevant program, degree, and certificate pages in the Programs, Majors, and Degrees section. If you need to link to an internal page in the catalog, contact us at webcommunications@montgomerycollege.edu so we can set up your link correctly.

Quality Assurance

  • Check your content for spelling, grammar, and style. Ask a colleague to proofread your page.
  • If you have access to the content management system, make sure all hyperlinks work and links to external sites open in a new browser window.
  • Check your page in different web browsers and mobile devices (phone and tablet) to make sure it displays correctly.

Content Maintenance

  • Create content that is evergreen whenever possible. If you need to include dates or time-specific information on a page, set a reminder in your Outlook calendar or using the OmniUpdate reminder feature to update the content when needed.
  • Check your pages on a regular basis to ensure they are not out of date.

Links

  • Make links to external sites open in a new browser window.
  • Spell out link text: do not use “click here” (or its variations) and do not use the URL as the link text. This is important for SEO and accessibility.
  • Limit the number of links within each page.
  • Use the More Information sidebar snippet to house your links when possible.
  • If you have access to the cms, leave the Title field blank.
  • Do not link to files other than webpages or PDFs (e.g., do not link to Word docs, PowerPoint presentations, Excel spreadsheets, etc.) The CMS will only allow you to upload images and PDFs.

Navigation Menus

The section navigation menus (also called the right-nav) are the dark gray boxes with links that appear on the upper right side of most pages throughout the site. Your page must have a sidebar and a section navigation menu.

You may request a customized navigation menu by contacting ITServiceDesk@montgomerycollege.edu. If you have access to the cms and create your own section navigation menu, use the following guidelines:

  • Create a navigation item for each page in your section. Your section navigation should be an accurate representation of the pages within your section.
  • Do not link off-site from your section navigation menu.
  • Do not link to PDFs from your section navigation menu.

Adding Employee Contact Details

  • Contact box style: drill down and find department page for each staff/faculty member, text should be "Department".
  • Employee box style: if using first text box, give it the title "Biography." List only highest degree in degree field, you can list complete degrees in first text box.

PDFs

PDFs can be used in many instances. However, do not use a PDF where a webpage would work better. Some disadvantages of PDFs are that they do not include the site navigation, they may be difficult to view on a mobile device, links do not always render correctly, and text within a PDF is not always crawled as easily by search engines (see the "Tips for SEO" section below for more information).

Examples of when a PDF is preferred include:

  • Forms to be printed and filled out
  • Flyers or brochures
  • Long content such as reports, guides, memos, etc.

When creating a PDF, under Properties, at a minimum, make sure the Title, Author, and Subject fields are completed. And make sure to save again when the Properties are filled in.

When linking to PDFs if you have access to the cms:

  • Open the PDF link in a new browser window.
  • Adhere to the same file-naming rules as for webpages – use the title of the PDF with dashes between each word. Do not use underscores or other special characters.

Do NOT use a PDF link in the title or description field of an accordion. The essential function of an accordion is "click to open." 

As a general rule, when you upload a new version of a PDF, overwrite the old PDF so that any links to the PDF are preserved.

Pop-Up Boxes

These script-driven message are restricted to college-wide special needs. Please contact webcommunications@montgomerycollege.edu if you think you require one.

Countdown Elements

Countdown elements are restricted to college-wide special events. Please contact webcommunications@montgomerycollege.edu if you think you require one.

Photo and Video Usage

It is important to use photos and videos that represent the College’s dedication to student success. Choose relevant, compelling images to enhance your page’s message. Avoid using too many photos and videos throughout a page.

Photo
  • Use high-quality, crisp, clear, bright photographs.
  • Photography must feature actual MC students, faculty, and staff. Do not use stock photos of people.
  • Use only photos for which you have permission from the photographer and the subjects in the photo. For more information, visit our Photography Services page.
  • Crop and scale images to the correct dimensions noted in the CMS. Save images as .JPGs at 72 dpi.
  • When uploading your image, include a description describing the image. This is required for accessibility—it provides the alt tag information which allows screen readers to “read” the image for persons with disabilities.
  • Do not use clip art, animated images, illustrations, or photo collages. Select graphics designed by the Office of Communications may be used on the website (e.g., the Career Coach graphic used on Future Students. If you have further questions about photo and graphic usage, please email webcommunications@montgomerycollege.edu. 
  • Do not use internal or external logos.
  • Do not use images with text on them. (They are not mobile responsive and are not accessible to screen readers.) Never use an image in place of text.
  • If you edit your own page, always use an image component or snippet (Image – Inline, Image – Full Width, and Sidebar Image) to place images on a page. Do not use the Insert Image icon in the CMS toolbar. See the Snippet and Asset Usage Guide for more information. 
  • Photo galleries ("slideshow") may be used in certain situations. If you would like to place a photo gallery on your page, contact ITServiceDesk@montgomerycollege.edu or webcommunications@montgomerycollege.edu.
  • Do not use photos in the accordion teaser field. You may use photos in the accordion main content area.
Video

If you would like to place a video on your page, contact the Office of Communications at webcommunications@montgomerycollege.edu. 

Tips for SEO

Google search is the main source of traffic to our website. Optimizing your page will help users find your content. Creating good content as laid out above in this style guide will contribute to search engine optimization (SEO). A few additional tips to make sure your page is optimized for search engines:

  • Do not copy content directly from anywhere else on the web. Google search downgrades duplicate content.
  • Be sure to fill out the description and keywords (metadata) with accurate information. The description appears on the Google search results page below the page name. Use complete sentences in your description, and keep the length between 50 and 300 characters.
    • This instruction also needs to be followed when creating a PDF. Under Properties, at a minimum, make sure the Title, Author, and Subject fields are completed. And make sure to save again when the Properties are filled in.
  • Incorporate keywords or key phrases throughout your page content. Keep your most important and relevant key phrases and content toward the top of the page while maintaining a natural flow of information.
  • Your file name (URL) should reflect your page name, which should be descriptive and contain keywords. Separate words in the URL with dashes, not underscores.

Accessibility

Web Accessibility in its most basic definition is about making sure websites work for the widest possible audience. For most people, it is easy to browse the Web: they can point and click, visually skip over content they do not want to read, listen and watch a video clip, and skim for what they are looking for. For those with disabilities, all of these things can be barriers to access if we do not use the code, the methods, inherently provided by the creators of the web to ensure that it would be usable by all. We have the obligation to make sure our web presence works in the most inclusive and equal way possible. Learn more about accessibility at Accessibility @MC. 

Headings and Subheadings

There are five heading styles available: H2 through H6.

  • H1 is automatically used for your page title. Do not use H1 anywhere else on the page.
  • Use H2 for the main subheads throughout your page.
  • Use other subheads as needed to create a hierarchy of subheads throughout your page.

Questions?

Questions about anything in this guide? Contact the Office of Communications at webcommunications@montgomerycollege.edu. 

updated March 18, 2024

Skip sidebar
End of sidebar