Web Development Standards

So... you are thinking about building a web page
Blank Image For SpacingOr... you have a web page that needs some updating
Blank Image For SpacingAnd... you want to know where to begin.

Blank Image For SpacingThe key to a successful Web Site is planning!

Developing a professional, informative and accessible web page or web site requires the cooperation of a team of dedicated individuals. SVSU's Webmaster, Todd Pashak, manages the overall development of SVSU web projects and is your resource for information architecture and website design.

Whether you already have a web presence that needs updating, or you are just starting out with your first web page, there are some questions you need to consider in order to determine your best course of action.

 

Content

  • Who is your audience? What content is most important to them? What will they want to see?
  • What is the purpose of your page? What message do you wish to convey?
  • Who in your department will be responsible for writing the text and gathering the images (photos and/or clipart) that will be put on your web page?
  • Who in your department will be responsible for determining categorization and prioritization of the materials your present on the web?

 

Web Page Development

Web Services is responsible for the development and maintenance of Saginaw Valley State University department-level web pages.

If you would prefer that someone within your own department take on the responsibility of Web Authoring, there are a few things you will want to consider, including software purchases and training for your Web Author.  While we help you prepare to take on this responsibility, Web Services will take care of interim updates.

  • Software Recommendations
    • Web Authoring (one of the following is required)
      • Microsoft FrontPage
        available with MS Office Premium
      • Macromedia Dreamweaver
        can be purchased separately or in a package including Fireworks
    • Graphics (necessary only if you will be manipulating or creating images)
      • Adobe Photoshop
      • Macromedia Fireworks
      • Jasc Paint Shop Pro
  • Web Author
    The ideal Web Author in your department will have a vested interest in the success of your web page.  The Web Author will work in concert with the Content Developer to create a web presence for your department that is both professional and informative.
    • Training
      • Obtain training from ITD or ITT in web authoring and graphics software programs
      • Give individual time to develop skills before authoring begins
    • Web Authoring Skills
      Web Services can provide you with links to valuable tutorials that will introduce your Web Author to some of these skills
      • Familiar with SVSU Acceptable Use Policy
      • Basic web knowledge
        • How web pages function
        • How to navigate websites
        • Hypertext linking
        • Browser differences
        • URLs
      • Some HTML experience
      • FTP skills – transferring files to and from a server
      • Knowledge of folder structure and file organization
      • Cutting and pasting between programs
      • File naming strategies (logical and appropriate)
      • Optimization of files
      • Appropriate graphic use (gif, jpg, dpi, etc.)

 

SVSU Template

  • Required for all SVSU department-level pages
  • Template comes with associated files and instructions which require strict adherence
  • Template is not available for faculty pages, student organizations, student projects or similar
  • Content on pages using SVSU Template must reflect the views of SVSU

 

12 Steps to your Successful Web Project

Step Action
1

Consult with Web Services to plan your project. A site map is required.
2

Determine who will act as Web Author
3

Purchase any necessary software
4 Obtain training
5 Gather appropriate content, including both text and images
6 Plan page / site layout and navigation
7 Review plan with Web Services
8 Create web pages
9 Test page(s) for usability, broken links, load time, etc. (see handout - coming soon)
10 Review page(s) with Web Services
11 Publish page(s)
12 Test page(s) – make sure they function on other computers and browsers

 

Folder Structure/File Naming

  • Every folder has an index.html page as its starting point, including images folder(s)
  • Multiple image folders required for complicated sites
    • Named appropriately
    • Folder for source files/originals that may need future editing
    • Folder for work in progress
  • Image and HTML file names must be logical, with the first few letters being the most definitive, for example:
    • 360curtiss.htm (all 360s will be sorted together)
    • indexnavprospect.gif (for a navigation button on the index page that has “Prospective Students” on it)
  • No CAPS, spaces or odd characters in filenames (alpha-numeric only)
  • Do not use autonaming feature in graphics program
  • Appropriate extension on images
    • .gif for cartoon-type images with few colors (less than 256)
    • .jpg for photographs and many-colored images
  • Feedback Forms/Interactive Forms will be done by Web Services, create word processing version first.

 

Content Preparation

Layout/Presentation

  • Pages converted from Word or WordPerfect will need HTML cleaned up – contact Web Services, ITD or ITT for assistance
  • Heading, subheadings and body copy consistent font, size, color
  • 1 pixel black border on all pictures
  • Center page on screen
    • 660 pixel table with 2 pixel gray border
    • light border = #999999
    • dark border = #FFFFFF
    • border = #999999
  • 4.0+ browser, 800x600 resolution (consider browser limitations), 56k modems are minimum standards
  • Final file size (including images) 75kb or less
  • White background/Black text, consult with Web Services for deviations
  • Meta tags (keywords, description, CHARSET, etc. present and appropriate
  • Be consistent, line things up, elements of page should not bounce or move from page to page
  • Keep white space to add appeal to page (not a crowded appearance)
  • Footer information correct
  • Spell check and grammar check text, ALT text, titles, etc.

Graphics

  • ALT text required on all images, including small images that are part of a larger image, such as a navigation bar, banner, or logo
  • Trademarked images such as the cardinal, insignia, SVSU, Saginaw Valley may not be distorted or disfigured
  • Photos resized to final display size BEFORE publishing
  • 72 dpi resolution
  • Pages with many graphics should consider thumbnails vs. high resolution pictures
  • Optimize all images
  • Appropriate use of animation (ask why is it necessary?)

Multimedia Considerations

  • Consult with Web Services regarding the use of specialty items such as applets, scripts, shockwave, director, flash and quicktime
  • Link to reader/viewer when using plugins, i.e. Acrobat Reader
  • Appropriate use of pop up window

 

Testing/Review

  • Spelling and grammar checked – read thoroughly, have Content Developer review
  • Graphics optimized
  • Page printable
  • Table widths appropriate
  • Style sheet working in IE – red to black rollovers
  • JavaScript error(s) – see Web Services
  • Meta tags
  • CHARSET – Web Services will provide code
  • Spelling and grammar checked – read thoroughly, have Content Developer review
  • Delete junk files
  • Speed test – how long does it take page to download
  • Test sites in Netscape 4.0+ and Internet Explorer 4.0+ on both PC and Mac and fix browser anomalies BEFORE having the client or Web Services review pages.