MSU-Northern  
 
 Quick Links 
Help Desk - 3765 
ITS Home  IT Security  Services 
Information About... 
Site Index 
 Help Desk
MSU-Northern students, faculty and staff - Use the ITS Help Desk as the first point of contact for your technology problems, questions & services!

Information Technology Services Help Desk
Hours of Operation:
   8am-5pm Mon-Fri
Walk-in Support:
   Cowan Hall 117B Telephone Support:
    265-3765
E-Mail Support:
    HelpdDesk@msun.edu

Last Updated: 29-Oct-2013
Information Technology Services
Information Technology Services: Web Style Guide

Web Publishing Style Guide

Montana State University-Northern recognizes the Web as a powerful tool for communicating with external audiences as well as for facilitating the exchange of information within the University community. The quality of information published by MSU-Northern plays an important role in determining its reputation and image. The following standards and guidelines are intended to provide guidance for developing and maintaining web pages for Montana State University-Northern in a consistent and professional manner. These standards are designed to help ensure the accuracy and currency of information presented, provide professional standards consistent with MSU-Northern's image and mission, and to encourage creativity and innovation. These guidelines apply to all servers attached to the University network. Any organizational unit may establish additional policies and guidelines governing content and style of web pages under its jurisdiction.

General Page Design/Content Standards
for All University Pages

For the purposes of this document, any user who creates a Web page and installs it on a Montana State University-Northern Web server is considered to have published that page.

In general, all University policies and regulations that apply to the content of publications and communications apply to the contents of Web pages published using Montana State University-Northern servers. All information included on University servers must:

  • Comply with all laws governing copyrights, intellectual property, libel and privacy.
  • Not violate any policy, rule or regulation of the University or the Montana University System.
  • Not be used for commercial activities.
  • Not contain confidential University information or student information covered by Federal Educational Rights and Privacy Act (FERPA) unless adequate security measures are in place to restrict access to authorized persons.

In order to provide the best possible service, web pages in the msun.edu domain need to convey current information. All administrative units and academic departments who provide content are responsible for maintaining their site with current information.

In addition, all departmental pages other than "working" pages (ex: class notes, syllabi, etc) or pages designed specifically for printing must incorporate the following design and content standards:

  • The name of the University (completely spelled out), preferably at the top, and a link to Montana State University-Northern's home page.
  • The name of the department/college responsible for the page, and a link back to that unit's home page.
  • An email contact for the person responsible for the page.
  • The date the page was last modified.
  • Street address, Post Office mailing address or telephone number of the unit's main office, ...or an obvious link to this information.
  • Links to MSU-Northern's On-Line Privacy, Copyright policies & AA/EEO Statement.

Departmental University Web Pages

Officially recognized departments, administrative units, university groups (alumni, foundation, etc), and student groups may have pages on the www.msun.edu server. If you have departmental web pages on another server, please contact the Web Coordinator to have them linked to the University's official pages. Throughout your documents, we encourage the use of the University's official name, Montana State University-Northern rather than MSUN.

Basic Style

  • Page files
    • Your home page should be called index.htm
    • Page file names should not contain spaces. Use dashes or underscores instead, and use lowercase characters and no "special" characters.
    • Use descriptive titles for your page <title> tags. The page title will appear in the title bar of the browser window, on the top of pages if the document is printed, in bookmark lists and it's also used by search engines. When possible you should identify the page as being an MSU-Northern page, your department and the content of the page (Ex: "MSU-Northern Financial Aid: Scholarships", not just "Scholarships")
    • Don't link to pages that don't yet exist, or have no content. It's frustrating for users to get "file not found" errors and "under construction" pages.
    • Please do NOT use Word, Powerpoint or Publisher to develop web pages, and do not copy text directly from these documents into FrontPage. Word adds a lot more than simple HTML tags and greatly increases the size of the page. Documents created this way contain style definitions, Microsoft-specific tags, and Office-specific formatting instructions. HTML is designed to be platform-independent so they can be seen by any system regardless of its operating system or the applications installed. Also because they are mostly text, HTML pages are much smaller and download faster.
  • Page sizes
    • If you use a "liquid" design where the content adjusts to the users screen width, be sure to see what happens on very wide displays.
    • Design your pages so users won't have to scroll from left to right. Currently, the majority of users have screen resolutions of 1024 x 768 or larger, If you are going to use a fixed width page to control the layout, remember that browser windows themselves use part of the available screen real estate. Subtract about 40 pixels from the width - ex: designing for an 800x600 screen would make your width 760. If you also want to eliminate scrolling up and down, allow about 190 pixels for browser - ex: for an 800x600 screen the height would be 410.
    • If you do decide to design for a 1024x768+ screen, keep in mind that reading extremely long lines of text is difficult. Try to break your text into columns like newspapers & magazines do.
  • Fonts
    • Text fonts used should be Arial, Verdana, Helvetica or Tahoma. These fonts are easiest for users to read on screens. Your computer often supports many more fonts than a standard Web browser. But when visitors' computer doesn't have the font you specify, the browser will use its default font and font size instead, changing the appearance of your page and possibly breaking your page layout.
    • Text size and color should be consistent throughout the site.
    • Text color should provide significant contrast to the back ground color.
    • Use of flashing, marquee and other animated text should be kept to a minimum or avoided entirely. They tend to be distracting and extremely annoying and can cause slower page loads.
    • Never underline text - users expect underlined text to be a link and can be confused if it is not. Use another method to emphasize the text.
  • Colors and Backgrounds
    • Northern's maroon (R:102, G:0, B:51; hexadecimal 660033) and gold (R:255, G:153, B:0; hexadecimal FF9900) are not your only color options, but using them does reinforce a connection to the University. They can be used in combination with other colors or on their own.
    • Background designs and images should be avoided behind text. Unless they are a very subtle, they make pages difficult to read.
  • Graphics
    • It's best to use graphics software to size graphics correctly with an image editor rather then setting the size with HTML. If you reduce the size with HTML, the file size of the graphic does not change so it takes just as long for the viewer to download it, and it will often be distorted.
    • GIF or JPEG? Generally, simple line art and images that have areas of solid color are best in .gif format, while photos, paintings and images that include color gradients (places where one color gradually changes to another) should be in the .jpg format.
    • Web graphics and photographs that are created to be viewed on screen should have a low output resolution (72 dots per inch) and should be optimized for faster download times.
    • The source of your images must reside on the Web server.
    • When you insert graphics always use height and width tags for all images. This improves the loading speed of a page because the text can flow in to final position before the images arrive. Dreamweaver and FrontPage will do this for you.
    • Pages should be as universally accessible as possible. Pages employing graphics should be designed to be readable with text browsers: provide alternate text on your graphics with the <ALT> tag. Alternate text is what appears if a user's browser does not display images or the user has images turned off for quicker page downloads. If page contains an image map, provide a text version with links and descriptions - some people browse with image off and some browsing tools designed for people with disabilities cannot read image maps.
    • Remember that copyrighted images may not be used without prior consent of the owner.
  • Miscellaneous
    • If you use PDF file or other files requiring a plug-in, be sure to have a link to the plug-in required to access the files. For example a link to download Adobe Acrobat reader if you're using PDF files.
    • Scanned forms are unacceptable. Scanned forms can be very large images and practically unreadable. Forms should be in Adobe PDF.
    • Pages created by outside sources should not contain logos or ads for the outside source. They may, however, have a discrete, unobtrusive e-mail link to the designer.

More tips and recommendations...

Top of page

Return to Web Publishing

 
Did you know?
It's easy to include the "date last modified" on your web pages with most Web publishing software programs.

For instance, with Dreamweaver all you need to do is select Insert, then Date, choose a date format, and check a box to "update automatically on save".
Table Tip
Tables will often not display until their entire contents have been downloaded. Long tables with lots of text and images or nested tables will be blank for as long as it takes to download everything to the users machine. If you have a large table, consider breaking it into multiple tables.
Web Design Tips
Name your pages and graphics in a way that will be easy for you to find them. When you have groups of pages or graphics that are similar, give them similar names. For instance, if you have a group of pages about web publishing you could start the page names with "webpub". So you might have webpub-tips.htm, webpub-graphics.htm, etc.

Don't use spaces or special characters in file names. Stick to letters, numbers, hyphens and underscores in file names. Users will get a File Not Found if you name a web page "tips & stuff!.htm"
Color Tips
Using color is a science. But the trick is to choose three or four colors that go well together and then stick with that color scheme for your entire Web site.

Getting away from primary and secondary colors produces a more sophisticated scheme that will make your pages appealing. Black and white are "free" - using them doesn't count towards your three or four palette colors.

Primary and secondary colors are intense, saturated, gaudy, bright. Using ONE of them in a design is MORE than enough.
 
Primary Secondary
CC0000 993399
0000FF 009933
FFFF00 FF6600

See the Resources page for online color helpers.
Montana State University-Northern · P.O. Box 7751 · Havre, MT 59501 · 800.662.6132
Copyright © · Disclaimer · AA/EEO Statement · Online Privacy Statement
Since 1929