information technology group

United States Coast Guard Auxiliary Information Technology Group

CS Officer Handbook

A Guide for the Communications Services Staff Officer

March 10, 2011 (Version 3.8)

Change Log Date Change Notes Affected Pages

2011-03-17 Add Change Log

CS Handbook, March 10, 2011 (Version 3.8) Page: ii

Table of Contents| Introduction | Requirements | Best Practices| References

Table of Contents (Click on any subject to jump to contents)

Change Log i

Table of Contents ii

Introduction 1

Requirements 3

Auxiliary Website Requirements 3Web Page Title Tag 3Flotilla Identification 3Subordinate Heading 4Image Alternate Text 5Web Standards Compliance 6Site Content 6Privacy & Security Policy Statement 7Links To and From Other Sites 7Operational Security (OPSEC) 8File and Folder Names 9Auxiliary Brand Models 10Use of Flash 10Site Map 10Metadata 10

Best Practices 12

Mouse Over Popup 12Frames 13Resizing Images 13Linking to Non-Federal External Sites 13Reviewing External Links 14Should Links Open In New Windows? 14Keeping Content Current 14Audience-Driven Content 14Common Terminology 14

Plain Language 14Contact Webmanager 15About Us 15Frequently Asked Questions 15Page Download Times 15Last Modified Information 15Lowercase Names 16Bookmarks 16

References 17

With Out Website (WOW) 17Auxiliary Internet Resource Site (AIRS) 17Auxiliary Branding 17Accessibility to the Disabled 17Standards and Compliance Validation 17Browsers 17Web Technical Specifications 17HowTo.gov 18USCG Auxiliary Style Guide 18

Table of Figures

Figure 1 USCGAUX Web Site Mdel Sample 2Figure 2 Textual Site ID Example 4Figure 3 Graphical Site ID Example 5Figure 4 Examples of alt text tags 6Figure 5 Unit linkage Examples 8Figure 6 Examples of title tags as mouse overs 13Figure 7 Resize Image Tip 13Figure 8 Last Modified Examples 15

CS Handbook, March 10, 2011 (Version 3.8) Page: 1


Introduction Congratulations on stepping up to the opportunity or challenge to be the unit’s Communication Services (CS) staff officer. The tasks of a CS staff officer can be daunting at first and knowing where to start can be the most confusing part. Getting started, as with any other staff job, requires an assessment of where you are and where you’d like to go.

This Communications Services Officer's Handbook (CS Officer's Handbook) amplifies and complements the information found at:

· The Auxiliary Internet Resource Site (AIRS)

· The Auxiliary Branding Site Note: Without Website (WOW) items can be found within this site.

· The Site Approval Requirements

This document is another tool that provides easy access to the information needed to effectively bring a unit’s website from “nothing” to “approved” independent of hosting location. The success is a satisfactory completion of the Site Approval Check List. This electronic document makes extensive use of hyperlinked text so the user can easily read it and access the level of detail needed to meet the individual needs of a diverse group

Starting or rebuilding the unit Website. Your Website doesn’t have to be large or complex. Just tell the story of your unit, the services your unit offers the public and information that could benefit your membership. Don’t forget to include a way for the public to contact members of your unit; either by displaying a phone number (get permission first) or an active email address. Using one of the Classic Template Models allows a best practice of concentration on the site contents while easily applying the standard USCGAUX look and feel.

Success, your web site is now in production and online. Are you done? No, the CS officer’s job is never finished—Website maintenance and updates should be done whenever necessary. Remember, your Website represents your unit, the CG Auxiliary and the Coast Guard. Many communities never see an active-duty Coastie, but they do see you—so keeping your site current and up-to-date is an important job.

http://airs.uscgaux.info/�

http://itgroup.cgaux.org/branding�

http://itgroup.cgaux.org/IU/all_cs/check_list.php�

http://itgroup.cgaux.org/IU/branding�



Thanks for volunteering!

A Unit’s Content Area

Top Banner and National Navigation

Bottom Banner

Customizable Left Side Navigation

Figure 1 USCGAUX Web Site Mdel Sample



Requirements

Auxiliary Website Requirements (Note if any of the following contradict with that of information listed on the AIRS Website online checklist, the online check list shall be the current standard)

Web Page Title Tag The <title> section is within the <head> section of the source code of each page. The <title> shall identify the unit, division, and district as well as the geographic location the unit. The title tag format shall be:

<title USCGAUX, unit - division, and district (if there is a Region it is placed at the end) </title>

<title> tag examples:

<title>USCGAUX: Xth District X Region</title> <title>USCGAUX: Division X, X District X Region</title> <title>USCGAUX: Flotilla XX, X District X Region</title> <title>USCGAUX: Flotilla X-XX, X District X Region</title>

The abbreviation USCGAUX identifies this page as a United State Coast Guard Auxiliary Web Page. And the rest defines the unit, division, and district as well as the geographic location. See Flotilla Identification for more information.

Flotilla Identification The UNIT that the website represents ALWAYS has prominence after “USCGAUX”. The title numerical, after Flotilla number the division number would always precede the district or division number than district number.

There are no single digit flotillas in the U.S. per AUXMAN; a flotilla number consists of both the division and flotilla numerical. The two are never separated except for AUXDATA and computer entry. There are no zeros in a flotilla number unless the numerical has a 10, 20, 30, etc. in it.

Flotilla Unit Numbers always include the Division Number then the Flotilla number. A dash (-) is required on all three digit flotillas such as: 3-10 or 17-6

The URL, or Auxdata format, that is currently being used is correct for the URL only. The problem with relying on that to identify division and district may work for Auxiliarists, but not the public. Most visitors to your site do not know what District 054 means. The URL number does not identify the unit to the public, nor should it be a substitute for division/district identification.

Unit identification, when written or posted, must be clearly spelled out in English. Also, the Auxdata format is one of the primary causes of Auxiliary members improperly identifying their unit on paper and websites. The Auxdata format of "054" when written out on paper stands for District 54, not 5SR. Do not sign messages and reports with "Flotilla 0700404" as an example.



Rely on the correct way to identify a unit, as is written in the auxiliary Manual. We are losing unit identification uniformity due to technology.

There are two ways to identify a flotilla: regular English with Arabic numerals, and the Auxdata format. The URL is supposed to be the Auxdata format. That is the only way to sort Auxiliary unit numbers in a computer, otherwise Flotilla 4-11 would come before Flotilla 49. For every other use, including the html title and main site identification, the plain English with Arabic numerals format shall be used. i.e... Flotilla 44, 4-11 11-4, 11-11. Division and flotilla numbers are never separated from the combined numerical when written or spoken.

Subordinate Heading A proper identification of the Web site sponsoring unit and geographical area shall be visually evident to the site's visitors within the content area on the initial or home page. This example shows textual site identification thru the use of an <h1> tag.

Figure 2 Textual Site ID Example

When graphic images are used to identify the origin of a site, alternate text identification shall be included in the HTML code that displays that image. This shall be accomplished by the use of an ‘alt=’ attribute.

<img src="images/D5_logo3.jpg" alt="5th District Southern Area" />

view-source:http://www.uscga5sr.com/images/D5_logo3.jpg�



Figure 3 Graphical Site ID Example

Image Alternate Text A very important accessibility requirement is to provide alternate text information for all images. It is federal law and US Coast Guard web policy that all graphic images utilize the alt=”text” attributes to provide a means of image identification for non-graphic browsers. The alternate text shall provide enough information so that non-graphic users can successfully navigate the page.

The alt=”text" attribute example as found in the image tag line.

<img src="images/normal_050201-G-2278O-501.jpg"

alt="A Sample Impressive Image to your audience" title="A Sample Impressive Image to your audience"/>

And note the alt text is not visible when images are normally displayed but if images are turned off or not present, the alt tag is visible. The title tag is not displayed because the mouse was not over the image.



Figure 4 Examples of alt text tags

Web Standards Compliance All websites shall conform to XHTML 1.0 Transitional standards and CSS 2.1 standards. Many development tools have built in systems for checking compliance. If not consider use of the W3C Checkers. Reference

Some old references to past HTML versions may show where the tags where capitalized. Current HTML 4.0/XHTML 1.0 standards require all tags to have an ending tag or slant-bar “/” and all tags must be lowercase. Note the following HTML Element Syntax.

· An HTML element starts with a start tag / opening tag · An HTML element ends with an end tag / closing tag · The element content is everything between the start and the end tag · Some HTML elements have empty content · Empty elements are closed in the start tag · Most HTML elements can have attributes

In XHML, all elements must be closed. Adding a slash inside the start tag like <br />, is the proper way of closing empty elements in XHTML.

Site Content Content for Auxiliary sites shall be developed and maintained to reflect the level, in the Auxiliary, that the site represents. District sites shall post materials that represent District information and/or policy. Likewise, division level sites shall only post division level materials.

Duplication of posted information must be avoided. Sites that desire to provide information generated by a site at a different level shall link to the site originating that information. For instance, a division level site may provide their users with national level materials by providing links to the national page containing the desired information.

All posted information shall further the objectives of the Auxiliary, and shall be relevant to the interests of Auxiliary members and/or the boating public. In addition, information shall be accurate, timely or current, concisely stated, and understandable.



The original source of all information posted on Auxiliary internet sites must be clearly indicated.

The following items may be posted on a unit’s web site pages without further approval.

·

·

Verbatim reproductions of official information intended for public distribution. This may include public information from Coast Guard Headquarters, Auxiliary National officers, Coast Guard District offices, Auxiliary District officers, and Auxiliary Directors.

Information not covered by the above paragraph shall require prior approval as described in the current Auxiliary Manual and the Publication Guide.

Any logo or emblem approved by the Coast Guard or at the Coast Guard Auxiliary National or District level.

No site shall post information that would be inappropriate. This includes specific advice, endorsement or approval of a product or service, or sponsorship information. Materials that infringe on the rights or privacy of an individual, or violate copyright restrictions are prohibited.

Under no condition shall the official Auxiliary Seal be posted.

Web pages should be designed to load quickly. Unnecessary gimmicks, large high-resolution pictures, overuse of action icons should be avoided. Background music is not allowed.

All sites shall post an email contact address or ‘MAILTO:’ link in a prominent location. The contact person should be someone who responds to inquiries in a timely manner.

Privacy & Security Policy Statement All Auxiliary Websites must have a defined, clearly posted Privacy Policy when not implemented under the Classic Template Models. The Privacy and Security Policy link within the Classic Template Models does not cover sites outside of the Classic Template. The statement, or a link to the statement, shall be visible from the main entry page of all Auxiliary sites. This requirement is met by using one of the Classic Template Models and complying with the Privacy and Security Policy link within the common footer.

The policy statement should inform the user if any personal data is being collected. Auxiliary policy requires that there must be a compelling reason to collect user data.

Online forms such as surveys, questionnaires, or registration forms, also fall under the Privacy Policy. Access to, and use of the collected data must be limited to the purpose for which the form was intended.

Links To and From Other Sites Auxiliary sites may link to Internet sites not operated under the authority of the Coast Guard or Auxiliary. To do so, the following provisions must be met:

The purpose of the link must support a legitimate business objective.

· ·

No endorsement of private issues or commercial products may be made. Materials and information posted on the linked to site must be in good taste, and not bring discredit to the Auxiliary.




All links should be functional. Links to sites outside of the CG and CGAUX must provide a "value added" source of information or service directly related to Auxiliary activities.

Links shall be provided to the national Website, and other relevant district, division, and flotilla sites. All links from the website are covered under the sites Privacy and Security Policy. This requirement is met by using one of the Classic Template Brand Models which includes a Privacy and Security Policy link within the common footer.

Unit Linkage Navigation

Each site shall provide navigation linkage to the appropriate District, Division, and/or Flotillas for the unit’s organization structure.

Figure 5 Unit linkage Examples

Operational Security (OPSEC)

Introduction All Auxiliary members of the United States Coast Guard are personally and individually responsible for providing proper protection to mission critical information. This information includes our intentions, capabilities, and activities related to our operational missions. See the Operational Security (OPSEC) section, Chapter 14 of Commandant Instruction M5510.23 (series), Classified Information Management Program.

OPSEC is defined as a systematic and analytical process by which the U.S. Government and its supporting contractors can deny potential adversaries information about capabilities and intentions by identifying, controlling, and protecting evidence of planning and execution of sensitive activities and operations. Coast

http://auxweb.cgaux.org/�

http://www.uscg.mil/directives/cim/5000-5999/CIM_5510_23.pdf�



Guard and Auxiliary units have been and continue to be monitored by groups and organizations involved in illicit activity. The only way to successfully complete our operational missions is by employing OPSEC.

Critical Information What is critical information? This is any information that could be collected by our adversaries that could potentially harm or affect our ability to perform Coast Guard support missions. As previously stated, critical information could divulge our capabilities (our facilities preparedness and crew training) and our intentions (the date, time or location of our patrol).

To protect critical information the following information shall NOT be posted on Auxiliary Websites (even if the page is ‘so called’ protected by password access):

Patrol schedules (current/future law enforcement, marine domain awareness, and marine protection missions). This included times, frequency, routes, and orders received from order issuing authority.

Patrol schedules (current/future law enforcement, marine domain awareness, and marine protection missions). This included times, frequency, routes, and orders received from an order issuing authority.

Status of local Coast Guard forces (including Auxiliary forces)

Cutter schedules (arrival/departure), status and missions

Current funding issues related to operations or crew readiness

Code names (used by Coast Guard or CG Auxiliary)

MARSEC (Maritime Security) conditions and their requirements

Information contained in Operations Plans (OPLAN)

Movement of Naval Vessels

Information relating to personnel security training

File and Folder Names When developing file names for images, pages and folders within your website, spaces shall not be a part the file or folder name. To separate words in the file or folder name to make it more readable use the underscore “_” or dash “-“rather than a blank.

An underscore example: "mysite_at_auxieland.com". Where-as using spaces or blanks in the filename, may look something like this similar but confusing example: "mysite%20at%20auxieland.com" and some systems may not properly interpret the code “%20”. By not using blanks or spaces within file names, it helps to ensure a good maintenance environment for those that follow the website creation with the job of site maintenance.

Reference also Lowercase Names.



See the Auxiliary Brand Models

Auxiliary branding website and read up on the different models available for use. They make the task of generating a website easy by allowing concentration toward the unit’s content while providing a consistent and mature navigation structure. Downloading instructions are also included on each model. Classic Template sites shall be implemented via one of the models to participate in the Best of the Web Contest. There is no need to reinvent the wheel unless building websites are something you like to do.

When constructing a site using one of the Classic Template site models, the linkage for the National maintained elements of the model shall be maintained as downloaded. Individual units are not authorized to link their site to local copies of the nationally controlled master Cascading Style Sheet (CSS) file, header, footer and elements of the left hand navigation controlled by National. Local copies of national files will not receive the appropriate maintenance updates and hence are not permitted.

Use of Flash Flash is permitted but only if a visitor can access the information in a non flash form. Also if flash is used, a link to obtain the flash download must be provided including an appropriate Privacy and Security Policy Statement. When using the Classic template the download link in the footer under plugs ins along with the Privacy and Security Policy Statement satisfies this requirement

Site Map A Site Map is a page entitled “Site Map” that contains links to all major content pages within your site? Unit sites built model shall contain a Site Map page to ensure visibility of all major contents pages get seen by the search engines. Because the navigation linkage is dynamically built, other pages within the site away from the index page are not seen by search engines unless a Site Map is present using the Classic Template XML model.

Sites built from the classic template DWT models have static navigation links that are always visible to the search engines. A Site Map is optional under these cases.

Metadata The following metadata elements are considered minimum required elements. Does your new site include the following metatags on the homepage and all second-level pages?

· Title (this is different from the HTML title tag) · Description? · Creator (the content owner; this should be the name of the organization)? · Creation Date (original creation date)? · Last Reviewed Date? · Language?

http://itgroup.cgaux.org/IU/branding/index.php�



Best Practices This information contains items that while not “required” to be approved are strongly recommended. See also the USCG Auxiliary IT Group, User Services Department Best Practices webpage. Note that some of the items here may become requirements in the future.

Mouse Over Popup In modern browsers a popup window is available when a mouse hovers over an image or a hyperlink to convey information or additional information about the element. This popup information is controlled by the optional title attribute tag for images and hyperlinks. For all images when a mouse over popup is wanted the title property is best coded identical to the alt tag contents. Hyperlinks and images over hyperlinks may use the optional title tag to add additional information to help the viewer understand the destination or alternative ways to the destination such as Right Click and select open in.

<

Below are examples of title tags as seen in sample source code:

img src="images/DSC_3056A.jpg" alt="A stern tow exercise on Lake Anna" title="A stern tow exercise on Lake Anna"/

>

<a title="Right Click,

select link open window option to visit our Division Home" href="index.html">Division</a>

<a title="Click to leave our site and visit our district home (Opens in a new browser window)" target="_blank" href="index.html">District</a>

http://itgroup.cgaux.org/IU/bestprac.php�

http://itgroup.cgaux.org/IU/bestprac.php�



Figure 6 Examples of title tags as mouse overs

Frames Frame formatting is a method of dividing a Web browser's window into separate regions, each of which can display a separate, scrollable page that contains separate html documents. Frames was a technique widely used in the 1990s, but has become passé, and for many Web surfers, obnoxious. It is recommended that you DO NOT USE frames when developing your unit’s Web site.

Resizing Images While it is advisable to specify actual image height and width for an image, it’s not advisable to use these tags to change the image display size. Best practice implies cropping and sizing of the images before putting them on the web page. There is a performance and browser resource penalty if larger than needed images are downloaded and resized by the browser.

Tips to detecting the need to resize image may include:

Using the Firefox browser put the cursor within an image and right click selecting “View image Info”. The words ‘scaled to’ imply image resizing is needed.

Figure 7 Resize Image Tip

Another tip to resizing is to simply watch the page with images load. If the page loads but an image takes long to complete where one can watch the image form then the image is a candidate to resize.

Linking to Non-Federal External Sites All sites which link to other sites should have and follow a linking policy for how links to other sites are selected and whether the site meets the requirements for linking.



Reviewing External Links All sites which link to other sites should have and follow a schedule for reviewing the appropriateness and relevancy of the external links.

Should Links Open In New Windows? It is good to open links in a new window when

· The link provides assistance or help

· The link may interrupt an ongoing process

· The link leads to a non-html document

· The link leads to a large image which takes time to load

Otherwise, let the user be in control and offer tips or assistance on opening a link. It can be as simple as additional words such as “The following link opens a new window to review the material. Link Here. Or you might want to add Mouse Over Information within the title tag for hyperlinks. Reference Mouse Over Popup for additional examples.

<a title="Visit Our Division Home (Opens a new browser window)" target="_blank" href="index.html">Division</a

>

Or let the user decide how to look at the information.

<a title="Visit Our Division Home (Right Click to select how to Open Link)" href="index.html">Division</a

Keeping Content Current

>

Visitors always want to look at current content information. Establish a procedure to review your site periodically to verify all data is current or of historical material. Delete or archive content that is obsolete and not required by law or regulation. Reference also Last Modified Information.

Audience-Driven Content Ask yourself, is your site written and organized from the intended audiences’ point of view, with content that they care about most?

Common Terminology Does your site use common expressions, generally used terminology, and refrain from using acronyms or technical terms without defining them in context.

Plain Language Have you ensured that, at a minimum, homepages, all major entry points, and navigational elements are written in plain language? (Plain language is language the website’s typical visitor can understand in one reading; it is writing designed for the reader.) Is there a process in place to regularly review to ensure they continue to be written in plain language, considering your site’s intended visitors? This includes potential language tools, including language software, to evaluate the readability of the website’s content.



Contact Webmanager Does your site have a “Contact Webmanager” linked prominently from your home page and every major entry point (ideally from EVERY page)? The classic template model footer contains a “Contact Us”.

About Us Does your site have an “About Us” or similar page describing basic information about your sponsors and who is responsible for the site?

Frequently Asked Questions Does your site have a page called “Frequently Asked Questions” or “Common Questions?”. When there are repeat requests for the same information, this should be considered.

Page Download Times Do you accommodate visitors with low connection speeds by to the maximum extend feasible, minimizing page download times for your visitors and in most cases, keeping your HTML pages under 50 KB.

Last Modified Information Give visitors to your site a helpful hint on the currency of the information on each page by making visible the date of last modification within the page. Depending on your website development tools, this may be implemented automatically instead of a manual update.

Figure 8 Last Modified Examples



Lowercase Names The best practice for all filenames and folder names is lowercase. Using both upper and lowercase file names in a website can cause confusion and can be a future troubleshooting and maintenance nightmare as some systems have case dependencies that are not always apparent.

Bookmarks

Important entry points or files names that are likely to be bookmarked by visitors or other sites as short cuts should avoid names that convey version or dated information providing instead simply a generic name for the current or active information.

When the information file contents become obsolete by date or newer information, the file should be moved to an achieve folder where the file can be retagged with a new name signifying dated or obsolete material being retained for history information.

Examples:

· f87_enews

But when archived in a designated folder such as enews_2011 then rename as:

· f87_enews_jan

· f87_enews_feb

This practice is designed to minimize the need for bookmark maintenance by others if and when the material changes.



References

With Out Website (WOW) WOW refers to a data driven Coast Guard Auxiliary project that creates standardized template websites on demand for every Flotilla and Division in the Auxiliary. This web solution can be used as a standalone site, a primary site or as a secondary adjunct to your current website. WOW website

Auxiliary Internet Resource Site (AIRS) The AIRS program was established to provide basic server resources for local Auxiliary units. Units utilizing this free service receive a virtual web server residing on an Auxiliary dedicated server, sufficient disk storage space for an average size site, and a unique Internet Web Site address. Visit the AIRS site for more information.

Auxiliary Branding Auxiliary Branding is a standardized layout & design program for all unit levels that would like an official Coast Guard Auxiliary website. This program is an effort from all of Team Coast Guard. The US Coast Guard started this process a few years ago and it has now reached the Auxiliary.

Accessibility to the Disabled Section 508.gov is a valued reference.

Standards and Compliance Validation The tools that are being used by most website developers are built into the development tool in use or the W3C’s HTML and XHTML validators and Cascading Style Sheet validator as found on W3C’s Quality Assurance Tools page.

Browsers All website designer and developers should have a few different browsers loaded on their computer so they can view their web pages in different browser environments. Here are a few of the most common browser sites.

Microsoft Internet Explorer (IE) (Windows / Linux)

Mozilla’s Firefox (Windows / Mac / Linux)

Web Technical Specifications The World Wide Web Consortium (W3C) develops interoperable technologies (specifications, guidelines, software, and tools) to lead the Web to its full potential.

In December of 1999, HTML 4.01 replaced HTML 4.0. Currently we should be building (or converting) our Auxiliary websites to meet the HTML 4.01 specification and if you use Microsoft Expression Web or the most recent version of Dreamweaver, you can easily configure these to generate HTML 4.01.

http://itgroup.cgaux.org/IU/branding/wow_cs/�

http://airs.uscgaux.info/�


http://www.section508.gov/�

http://validator.w3.org/�

http://jigsaw.w3.org/css-validator/�

http://jigsaw.w3.org/css-validator/�

http://www.w3.org/QA/Tools/�

http://www.microsoft.com/windows/internet-explorer/default.aspx�

http://www.mozilla.com/en-US/firefox/�

http://www.w3.org/�

http://www.w3.org/TR/html4/�



HowTo.gov The HowTo.gov web site is an excellent reference for requirements and Best Practices for a new unit website.

Long.pdf is another great document for government websites.

USCG Auxiliary Style Guide See the USCG Auxiliary Style Guide for official images on DHS Seals, Logos, and much more.

http://www.howto.gov/�

http://www.usa.gov/webcontent/documents/long.pdf�

http://style.auxpa.org/�

information technology group

Documents