CSU Home > CSU Webs > Styles & Standards > Best Practices

Best Practices

To assist in your Web development the CSU Web Team has included a section listing some of the current best practices used on the Web. Best practices are widely-accepted techniques, processes and methods that have been shown to be among the most effective and/or efficient ways of producing the optimum results. These best practices are strongly recommended.

Incomplete Sites
Do not link to or publish incomplete or “under construction” sites.


Consider Your Audience
Consider your target audience when developing your site’s pages. If your site is mainly accessed by students, it needs to be youthful, vibrant and engaging. If your site is for a more distinguished audience such as faculty or for outside business persons, the site should be more formal and detailed. Use terminology with which your audience is familiar.


Web Pages
Create pages in FrontPage or other HTML editors such Dreamweaver. Do not create pages in Microsoft Word or other MS Office products.

Home pages must be named default.asp. Total home page size must not exceed 40K. Put the most important information in the top half of your pages.

Secondary page download times must not exceed 30 seconds on a 56k connection.

Avoid using frames as they can be problematic for users, especially those trying to bookmark or print a page.


Graphics
Avoid using large graphics. Keep individual graphic file sizes between 1kb and 20kb in order to keep page load time low. Avoid animations, scrolling text and repetitive graphics

GIF (.gif) is the best file format for text and line graphics.

JPEG (.jpg) is the best file format for photographs and image-only graphics.

Provide descriptive text in image alt tags.
Example: <img src=“image.jpg” alt=“description of image, woman in front of tree”>
Resize graphics using graphics software such as Fireworks or Photoshop. Do not resize graphics using FrontPage, Microsoft Word or in HTML code.

For more information on graphics see Appendix E.


Browsers
Avoid using browser-specific design and code.

Design your Web pages for viewing at 800 x 600 resolution without horizontal scrolling.

Design your Web pages for Internet Explorer, Netscape, and AOL versions 4.0 and higher. Optional browser testing includes Mozilla, Safari, Opera, Firefox, and Konqueror.


Content

Text
The new CSU image intends to show a campus that takes students out of the classroom and gives them real world experience. When talking about your college, department or office, highlight activities that show/describe students outside of the normal classroom when possible.

Internet users today spend very little time reading the content of Web pages. To convey information on your site it is best to present text that is:

• Short

• Active/Engaging

• In list format when applicable.

Example – Not Good for the Web:
The Department of Better Understanding offers a comprehensive, uniquely tailored and nationally recognized curriculum to dozens of students at Columbus State University who are able to meet the rigid requirements that are standards for our department. We can prepare students to enter a wide variety of careers in the professional world including high-ranking corporate executives, Chief Executive Officers and many other careers for which our curriculum is explicitly suited. A minimum of 35 credits hours at the undergraduate level are required before an application for admission can be submitted to the department for consideration by the faculty. Courses in the department include DBU 3001, DBU 3002, DBU 3200, DBU 3300, DBU 3433, DBU 3436, DBU 3500 (DBU 3436 is a prerequisite)….

Example – Better for the Web:
The Department of Better Understanding can help you reach the business world. Graduates go on to become CEOs, business leaders and department heads. Our curriculum is:

• Comprehensive

• Nationally recognized

• Tailored for each student

• Augmented by real-world experiences, including
  

  • Mentoring opportunities
  • Study Abroad classes
  • Lessons in local corporate boardrooms.

Students need 35 credits at the undergraduate level for admission. See the university catalog online for a complete listing of classes in this department.

Text Formatting
Cascading Style Sheet
Use Cascading Style Sheets (CSS) to ensure format consistency across all of your pages.
For more information on using CSS see Appendix F.


Typeface
Use Verdana, Arial, Helvetica, or sans-serif for the body text of Web pages. These sans-serif fonts are more desirable for Web use because they are easier to read on the computer. In CSU Web templates type styles and presentation have been preset by CSS style sheets.
Bold, Italics, Blinking and Underline
Use bold, italics and blinking text sparingly.
Use underlined text only to designate an active link.

Copying text from MS Word
Copying text from Microsoft Word directly into an HTML editor, such as FrontPage, creates unique and undesirable tags. These tags make editing your Web page content extremely difficult. There are a few extra steps you can take to correctly copy text from Word into FrontPage.

For detailed instructions on copying from MS Word see Appendix G.


Linking
Provide active links to sites or documents mentioned in your site. Avoid links that say, “click here.” Tell the user where they are going.
Good linking: For more information, please see our catalog.
(with “Catalog” as the link)
Bad linking: Click here for more info! (with “here” as the link)
Links to commercial sites must be approved by the CSU Webmaster.
Do not create links that open in a new browser window, unless linking to an outside site. Small pop-up windows are acceptable when displaying relative information, such as glossary terms or instructions.


Advertising
Advertising of non-CSU entities on CSU sites is prohibited.


Movies, Music, and Sound Effects
Do not include music or sounds on university pages unless identified as necessary. If music or sounds are necessary on your site, provide controls for the user such as: Play, Stop and Mute.

Movies, music, and sound must be compressed for Web delivery targeting dial-up (56k) and/or high speed internet connections (equal to or greater than 100k). Most media software packages, such as QuickTime and Windows Media Player, have the capability of creating compressed files.

By default, all CSU Web sites are capable of supporting QuickTime, RealPlayer, and Windows Media Player for most movie, music, and sound formats. Downloadable media files are sufficient for use on most campus Web sites. Web sites that provide time-sensitive information delivery functions, support high user traffic, or require use of streaming media technologies may request support for alternative media types. Alternative media types may be embedded in existing Web sites or may be placed in a separate media site, if requested.

We support Windows Media Player for streaming movies, music, or sound. Streaming music and videos must be approved by your department and the Web Development Team


Navigation
To maintain the consistency established within the CSU Web sites, the navigation must be located on the left side of the page.
Use navigational aids such as “Return to Top,” “Top,” “Next Page” and “Previous Page” within the body of your pages to enhance usability.

Breadcrumbs are a navigation trail that serve as links to where the user has been and where they are at the time.


Place breadcrumbs at the top of the page inside of the body. Breadcrumbs are included in the Web Templates.


Portable Document Format (PDF)
PDF is a universal file format that preserves the fonts, images, graphics, and layout of any source document, regardless of the application and platform used to create it. Adobe® PDF files are compact and can be shared, viewed, and printed by anyone with free Adobe Reader® software.

PDFs must be used anytime that you want to put a Word document, Excel spreadsheet, or Publisher file on the Web.

Interactive PDFs are intended to let Web users complete forms online and print them from their computer. Basic forms in Word or Excel can be converted to a PDF and made Interactive.

For more on Interactive PDFs and how to create them, see Appendix H.

< previous   next >