Policies and Term of Use

Chelan County Content Managers Website Standards & Style Guide

Website Authors

• The Chelan County website sees more than 45,000 visitors a month.
• Nearly 65% of the total visitors come to the website as the result of searching for something using a search engine (Google, Bing, Yahoo).
• Website visitors enter the website from a wide range of pages.
• The majority of website visitors are using a mobile device where the content stacks vertically.
• Don’t repeat content. If content already lives on another page, don’t replicate it – link to it!  
• Make page content easily scannable with headings, paragraph breaks, lists, and defined sections.
• It is a better user experience to have one longer page with well-organized information than to make people click on numerous sub-pages.
• Don’t duplicate another department or agency’s content. If you want to educate citizens on disaster relief and emergency management in the same way FEMA did, introduce the concept and direct people to the FEMA website. This allows people to easily access information directly from the authority on the topic and avoids potential confusion.
• Don’t copy/paste anything written by AI without customizing it and vetting it.

Best Practices

• Avoid abbreviations and acronyms. It’s okay to use them internally amongst ourselves but they create potential barriers and confusion when used externally.
• If you do need to use an acronym, be sure to spell it out in its first use followed by the acronym in parentheses. Subsequent references should only use the acronym.o Example: A Geographic Information System (GIS) allows users to create, manipulate, analyze, and display digital geographic or geospatial data, and related data tables. The ability to rapidly query and analyze GIS data speeds customer service and supports decision-making.
• Acronyms should not contain periods between letters.

• Content should be grammatically correct and written in clear, concise sentences.
• Avoid using jargon, department-specific terminology, or acronyms that won’t be immediately understood by a reader.
• Use exclamation marks sparingly.
• It is okay to write in a more conversational tone when writing for the web. However, slang and jargon should still be avoided.
• The average U.S. citizen reads at an eighth- or ninth-grade reading level.
• Write in an active voice to make content more engaging and direct. For example, “Action on the resolution is being considered by the Board of County Commissioners” is passive voice. “The Board of County Commissioners is considering taking action on the resolution” is active voice.
• Be consistent with your sentence tense throughout the entire page.
• Make each page independent and explain its topic without assuming the previous page has been seen by the reader.
• Start with the most important information first (the Inverse Pyramid method).

• Times: Include a space between the number and 12-hour clock period. If the time starts at the top of the hour, do not include the zeroes (example 8 a.m., not 8:00 a.m.). If the time starts and ends in the same 12-hour clock period, you don’t need to include a.m. or p.m. twice (example 8 to 10 a.m., or 9 a.m. to 4 p.m.). Use the word “to” instead of a hyphen.
• Phone: xxx-xxx-xxxx
• Street Modifiers: Spell out all street modifiers (Street, Avenue, Boulevard, Highway, etc.) when as address block is not included. Only Lane and Road are always spelled out, even with an address block. Example: I am visiting 812 Washington St. or The party is on Chumstick Highway.
• Abbreviate all compass points in address blocks (N, E, S, W, NE, NW, SE, and SW – no periods on any of them). Example: I live at 430 N Quail Road.
• Street numbers: Use figures for street numbers, such as 1st Street instead of First Street.

• Do not list an email address directly on the page. Instead, link it with the text “Email [department name]” or “Email [Person’s First and Last Name].” Email addresses have the potential to be picked up by bots for phishing and spam purposes.

• Page titles should be clear and concise and accurately describe the content found within the page. Example: “Content Policy Documents” is much clearer than just “Documents.”
• Headings should be used to break up content within the page and provide the user guidance as to what information is in the text below it.
• When formatting the page title, the style Headline should be used. This is set by default when using the “Add Page” feature.
• When formatting a section heading, the styles Headline 3 and Headline 4 are used to show the hierarchy of information on the page and inform search engines (like Google) about a page’s contents. Subheadings are not just decorative elements. A Headline 4 should follow a Headline 3 – indicating that the information is related to the previous topic.

• Don’t copy/paste a full URL within the content of a page (Example: Visit the page at http://www.co.chelan.wa.us/public-works/pages/road-maintenance). It can be difficult to read and understand where that link will take a person. Instead, use the link option to insert the URL into the text and clearly state which page it goes to (Example: Visit the Chelan County Elections page for more information.)
• All links to documents should open in a new window. *This may change due to accessibility standards.
• All links to other pages within the same website should open in the same window to help users seamlessly continue their path.
• Don’t link “click here” because it doesn’t indicate to the user where the link is going to take them. This can also hinder the usability of the website for someone utilizing a screen reader. Instead, link to words that indicate what the person will find by clicking the link. For example, instead of “to view the training document, click here” use “View the training document.” Also avoid instructions such as “Click the button on the left” because:
  • content shifts when users are on mobile phones and the button will likely not be on the left for mobile users; and
  • direction-based instructions do not work for visually impaired individuals using screen readers.

• The information shared is related to information provided on the County’s website and is consistent with the County’s goals, policies, and the website purpose.
• The link is to a governmental agency or governmental organization, or special purpose district that provides information specifically relevant to the County’s residents or businesses, a county partner or local chamber of commerce, public facilities, such as parks, library, museum, or public school.
• The County’s website will not include links to businesses for the purpose of advertising or marketing products or services.

Tables

• To be ADA compliant, all columns must have headings.
• If the information you are displaying in a table does not consistently fit under the headings, then don’t use a table.
• Tables should not include blank cells. Use “no data,” “0,” or “n/a.”
• Table properties: A table’s width should be 100%. Leave the height blank. And center the table.

• Images on the website should not contain significant text. If an image does contain text, the information needs to be written out elsewhere in the page to be accessible for visitors using screen readers.
• Do not use clipart or cartoon-like images.
• Do not download or “lift” images from other websites for use on County pages. We comply with all copyright laws. If you are looking for a specific illustration or photo from the web, please use a free, open-source image or ask the PIO to help create or find a graphic.
• Graphics used on the web should be either .jpg or .png.
• The ADA requires that images include alt text for users with screen readers. File names and single words will not suffice. The alt text should describe the image enough that it could make sense to a person using a screen reader. Example: “A sheriff’s deputy stands next to a patrol car.”
• Do not use animated gifs unless the animation is instructing the user how to complete a task, such as how to use a GIS map. Work with the PIO to create any instructional gifs.
• If using a slideshow, consult with IT’s web designer.

• Long lists within text should be broken out into bulleted lists so it can easily be scanned.
• The first letter of each item in a bulleted list should be capitalized.
• Bullets should go at the most, two levels deep. Otherwise, it becomes tough for readers to follow.
• Do not mix sentence fragments and full sentences in one bulleted list. For consistency, all bullets in each bulleted list should contain the same format (and verb tense).
• Avoid the over-use of bulleted lists.

• Content should be broken up into small, easily readable segments. As a general rule, the text beneath each header should not contain more than 2 or 3 short paragraphs and each short paragraph should not contain more than 5 sentences.
• Subheads encourage users to keep scrolling to find information, so make sure each new topic has a header.
• Separate topics should be on separate pages.

• When linking to a PDF, hyperlink the title of the PDF and include (PDF) in parentheses behind the title to indicate to users that they are opening a PDF document, not a web page. Example: “View the Chelan County Social Media Policy (PDF) to learn more.”
• Open all PDFs in a new window.

• We use top-level mega menus instead of drop-down menus because of the large number of pages we have in the County and mega menus are easier for users to physically navigate.
• Mega menus should be built out as evenly as possible. A mega menu with only two items is not highly usable.
• Menu items and navigation throughout the site should be listed in alphabetical order to make information easier to find. In some limited instances, topics may be listed in order of importance rather than in alphabetical order.
• Only a Website Administrator can create a menu or navigation.

• Underlining should only be used for hyperlinks. Underlining for emphasis can confuse users who might think they can click on that text.
• Avoid using all caps for anything but acronyms. If you need to emphasize something, use bold instead. Using all caps can make the words difficult to read.
• Avoid highlighting text and using different-colored fonts (many colors are not accessible for people with color blindness – the website template fonts were chosen within these standards).
• Only use Headline 3 and Headline 4 font for topic categories on a page.
• If you are going to copy/paste text from another source to one of your pages, be sure to paste all items in plain text using the Text widget. This will clear any formatting from the previous source and ensure that the text is free of random code that would otherwise get picked up by screen readers.
• Do not change the font from the standard font used on our website.

• A page title should clearly indicate what the page is about.
• Page titles should be short and concise – ideally no more than six words in length.

• Page descriptions should be used for every page. These descriptions help search engines (i.e., Google) better understand what the page is about so it can be brought up in the results for a search. They also help users understand what information a page might contain as they review search results and look for the page that best aligns with what they’re searching for.
• Page descriptions should accurately describe the content on the page, including any major topics that are covered.
• Keep page descriptions to 2-3 sentences in length. Search engines won’t display anything longer than that.

• It is recommended that documents placed in the document center should be converted to PDF file format unless there is a specific business need to have it as another file format (Word, Excel). PDFs protect the format and integrity of the document, while other types present a risk of the document being changed or modified.
• All documents should include the extension in parentheses behind the title to indicate to users that what they are opening is not a web page. Example: “View the Chelan County Social Media Policy (PDF) to learn more.”
• All documents should open in a new window. Be sure to check the “Open Link in New Window” checkbox in the hyperlink settings.

Alert Center, Events, News Items & FAQs

• Announcement, Warning or Alert: You have 3 options when using the Alert Center: Announcement, Warning and Alert. The majority of the time, the Announcement choice is appropriate. The Warning and Alert are used only for emergencies, such as natural disasters, major roadway closures and other emergency situations.
• Keep it short: The Notification Title and Alert Message should be kept brief, up to 8 words. The details of your announcement should go in the Alert Details.

• Name of the event
• Location and address (always include the address, don’t assume people know where a location is)
• Date
• Start and end time
• Description of the event or meeting, including where people can go to learn more information (a relevant webpage) and if there will be Spanish interpreting available.

• FAQs are placed at the bottom of a webpage.
• Stick to no more than 6 questions. Questions are written in a conversational tone and answers should be kept to a short paragraph, using links to push visitors to more information.
• Contact the IT’s web designer or the public information officer for help with this function.