Guidelines for Electronic Publications - St. George's University

Guidelines for Electronic 

Publications

Table of Contents 

Guidelines for Electronic Publications .................................................................................... 4 

Introduction ................................................................................................................... 4 

Quality and “The Greatest Story Ever Told” ......................................................................... 4 

1. Specific Gatekeeper Responsibilities and Skills.............................................................. 5 

2. Page Standards and Requirements ............................................................................. 5 

2.1. Page Design......................................................................................................... 6 

2.1.1. Layout .......................................................................................................... 6 

2.1.2. Templates ..................................................................................................... 6 

2.1.3. File Formats .................................................................................................. 6 

2.2. Website Security and Access .................................................................................. 6 

2.3. HTML Tags........................................................................................................... 7 

2.3.1. The Tag ........................................................................................... 7 

2.3.2. Tags................................................................................................. 7 

2.3.3. and Tags ............................................................................... 8 

2.3.4. Tags .................................................................................................. 8 

2.4. Specific Home Page Requirements........................................................................... 8 

2.5. Specific Sub-level Page Requirements...................................................................... 9 

3. Basics in Web Page Design .......................................................................................10 

3.1. Content, Consistency and Your Users......................................................................10 

3.2. Planning .............................................................................................................10 

3.2.1. Organization.................................................................................................11 

3.2.2. Layout and Navigation ...................................................................................11 

3.2.3. Sizing for Printing..........................................................................................12 

3.3. Typography.........................................................................................................12 

3.3.1. Fonts...........................................................................................................12 

3.3.2. Plain Text.....................................................................................................12 

3.3.3. Heading Text ................................................................................................13 

3.3.4. Blinking Text ................................................................................................13 

3.4. Editorial Style......................................................................................................13 

3.5. Design Elements..................................................................................................14 

3.5.1. Color ...........................................................................................................14 

3.5.2. SGU Colors...................................................................................................15 

3.5.3. Wallpaper ....................................................................................................15 

3.5.4. Whitespace ..................................................................................................15 

3.6. Graphics.............................................................................................................15 

3.6.1. File Types ....................................................................................................16 

3.6.2. File and Image Size .......................................................................................16 

3.6.3. Image Maps .................................................................................................17 

3.6.4. Tags............................................................................................................17 

3.6.5. Anti-Aliasing .................................................................................................17 

3.6.6. Official SGU Logos .........................................................................................18 

3.7. Navigation ..........................................................................................................19 

3.8. Multimedia..........................................................................................................20 

3.9. Things to Avoid ...................................................................................................22 

3.9.1. Empty Content..............................................................................................22 

3.9.2. Visitor Inclusion ............................................................................................22 

3.9.3. JavaScript ....................................................................................................22 

3.9.4. Non-SGU Content..........................................................................................22 

3.9.5. Sponsorship and Advertising ...........................................................................22 

3.9.6. Renaming of Files..........................................................................................23 

Guidelines For Electronic Publications 

Page 2 of 36 Updated 2/5/2004

3.9.7. E-mail Files ..................................................................................................23 

4. Policies for QuickPlace Publications ............................................................................24 

4.1. Browser Considerations ........................................................................................24 

4.2. QuickPlace Servers...............................................................................................24 

4.3. Creating Presentations..........................................................................................24 

4.4. Optimizing Images with Paint Shop Pro ...................................................................25 

5. Finishing Touches....................................................................................................28 

5.1. Checking the site .................................................................................................28 

5.2. Major Browser Font Displays..................................................................................28 

5.2.1. Internet Explorer...........................................................................................28 

5.2.2. Netscape......................................................................................................28 

5.2.3. For Advanced HTML Coders.............................................................................29 

5.3. File Size .............................................................................................................29 

5.3.1. Using Windows .............................................................................................29 

5.3.2. Using Authoring Tools ....................................................................................30 

5.4. HTML/W3C/WAI Standards....................................................................................32 

6. Site Maintenance ....................................................................................................32 

Appendix - HTML Reference Chart .......................................................................................33 

Document Tags..............................................................................................................33 

Body Tags.....................................................................................................................33 

Text Formatting Tags......................................................................................................33 

Link Formatting Tags ......................................................................................................34 

Image and Graphic Tags .................................................................................................34 

Table Tags ....................................................................................................................35 

Form Tags.....................................................................................................................36 



Guidelines for Electronic Publications 

Introduction 

We encourage members of the St. George's University (SGU) Community to create and maintain 

Web pages, QuickPlaces and other Electronic Publications in support of the University’s mission. 

However, not only members of the SGU Community but other Internet users as well, browse these 

electronic publications, and the quality of information we publish and disseminate reflects upon the 

reputation of the University as a whole. So that we all promote the highest possible standards for 

materials published by the SGU Community, please observe the guidelines detailed in this 

document. They will assist you in the creation of high-quality, professional, well-designed 

publications that meet the basic standards for publishing on St. George's University Web servers. 

Quality and “The Greatest Story Ever Told” 

If “The Greatest Story Ever Told” had been published on a Web site so poorly designed that no one 

could find it, the message might never have spread. The designer might have failed to use 

descriptive tags, so that Internet searchers would overlook the site. Those who did find it 

might have abandoned it because an inconsistent design made the content difficult to access. The 

designer might have lacked knowledge of such professional design qualities as a set of standard 

navigational tools on each page, fast-loading graphics, and well-written, legible text. The Internet 

as a medium for publication provides nearly endless design possibilities—and a temptation to go 

overboard. On the other hand, a neat, consistent and logical Web site enhances content without 

drawing attention to the design itself. In short, design is a tool to enhance the message and not the 

message itself. 



1. Specific Gatekeeper Responsibilities and Skills 

A “gatekeeper” is defined as the person who is responsible for monitoring the content of a web site. 

The gatekeeper makes sure that only certain things are posted and that everything that is on the 

web site is up to date and works. The basic skills necessary for taking on the responsibility as a 

Gatekeeper of a Web site, QuickPlace or other electronic publication at SGU are as follows: 

• Basic understanding of HTML syntax and requirements. 

• Basic understanding of QuickPlaces and their features. 

• Awareness of image optimization tools and the basic skills to use them. 

• Comprehension of common Web-design principles, as described in these guidelines. 

• Willingness to either answer site visitors’ questions within 72-hours of initial receipt or to 

forward questions to someone who can answer and follow-up appropriately. 

• Willingness to assume the responsibility of adding and updating information as well as 

deleting dated or obsolete information at regular intervals, at a minimum after each school 

semester. 

2. Page Standards and Requirements 

The http://www.sgu.edu website is the St. George's University's Home Page, the umbrella under 

which all other SGU Electronic Publications fall. 

For the purpose of these standards, however, consider a home page to be the top-level entry point 

of any website, QuickPlace, or sub-site of any division, department, center, institute, laboratory, or 

other SGU unit. A home page is also any page that would be the first page retrieved when accessing 

a website. It may serve as the table of contents for the site (or other websites) and is likely to be 

the page bookmarked or linked to. As such, this page greatly influences the first impression of SGU 

formed by visitors to the site. These first impressions are critical, and it is in our best interests as a 

community, for them to be as favorable as possible. 



2.1. Page Design 

Before visitors to a website begin to process the content they have found, they first encounter the 

design and layout of the page. This design largely determines their impression of the site and plays 

a part in determining how useful they find the site’s content. 

2.1.1. Layout 

Most website visitors will not scroll down to browse below the bottom of the screen. Good design, 

therefore, attempts to keep the most important content in the topmost part of the screen (“above 

the fold”). As you design sites, keep important links and navigational elements and the most 

important content in this part of the Web page to ensure that visitors will find what they need. 

2.1.2. Templates 

The Office of Information Technology (IT) can help create HTML and graphics for use on SGU Web 

pages. In order to keep pages consistent across an entire site, IT can supply templates or themes 

to individuals interested in authoring Web content. 

2.1.3. File Formats 

While it may seem most efficient to link to (or attach) files from a website, this introduces another 

barrier to access by visitors to the site. Files in vendor-specific formats (e.g., Quark Express, 

MSWord, WordPerfect®) are only accessible to visitors who happen to have those particular 

programs (and sometimes specific versions) available on their systems. Publishing an HTML version 

of your files allows the document to be universally accessible. As most word processors are able to 

export HTML (or RTF, which is easily converted to HTML), there is really little added burden on the 

site gatekeeper and a large gain in accessibility for the site visitor. 

2.2. Website Security and Access 

Any content that is considered secure (i.e., for use by only one specific course or group) requires a 

password for access on the Web. Your network administrator can assist you in achieving this basic 

level of security and authentication. Do not, under any circumstance, automatically assume that 

information on your page does not need to be password protected just because you have not 

advertised where it is located. 



2.3. HTML Tags 

All pages housed on SGU Web servers should include a complete set of high-level HTML elements 

(e.g., , , , and tags). 

2.3.1. The Tag 

The tag should include the “language” attribute, which provides useful clues to browsers 

for hyphenation, the rendering of special characters, speech synthesis, etc. For an English language 

document, this would be coded as: . This language tag is especially important 

for screen-reading tools. 

2.3.2. Tags 

A tag is a special HTML tag that provides information about the content of the web page. 

These tags do not affect the presentation or display of the content but rather provide information 

that search engines can use to find the content. Examples of information contained in tags 

include: author, creation date, keywords, and subject of the content. 

In the case of content authored for the SGU Community, these tags should contain words that are 

the most likely to be searched for by prospective students, such as: 

St. George's University University Clinical 

SGU School of Medicine Higher Education Placement 

School of Veterinary Medicine Grenada St. Vincent 

School of Arts and Sciences Bay Shore KMC 

Graduate Studies Program Residency USMLE 

Caribbean University EMC Step 1 Exam 

Shell Cricket Academy FMG Step 2 Exam 

Additionally, every Web page should contain its last update date. This should be coded as actual 

HTML document text (not computed via JavaScript or other means, which can cause browser 

errors). To avoid confusion the month should be spelled out or abbreviated (e.g., December 6, 

2003, or Dec. 6, 2003) but not expressed entirely in numerals (e.g., 12/06/03). 



QuickPlace does not natively allow for tag entries. However, you can use HTML in the 

welcome page of any QuickPlace to include tag entries. If you are designing a website with 

another web authoring tool it is essential to include tags. 

2.3.3. and Tags 

Each document's element should contain a meaningful and concise tag, 

preferably with the words “St. George's University:” or “SGU:” included, along with a succinct, 

descriptive phrase summarizing your page's content. 

This tag is the name of the page and what a visitor will likely index and bookmark. It is 

also what appears in their browser's “Go,” “Favorite,” “Bookmark” and “History” lists. For home 

pages, this should be a short form of the name of the unit, department, or activity owning the page. 

Start home page titles with “SGU:” followed by the department or group the page is for (e.g., SGU: 

KMC Pathophysiology Lecture 4). This descriptive title will be helpful for off-campus persons who 

might bookmark the page. 

2.3.4. Tags 

When a graphic cannot be displayed, most browsers will display a generic icon. The tag 

allows the content author to specify text that will be displayed in these cases. tags should be 

used on every graphical and linking element of every page within the SGU site. Descriptive 

tags give those visitors whose graphics are turned off, as well as visitors with a disability, an idea of 

what the link or image is. Also, browsers using screen-reading technology need tags to 

vocalize the content for them. 

2.4. Specific Home Page Requirements 

Web content that possesses a link from the www.sgu.edu Home Page acts as an SGU sub-level page 

or sub-site. As such, each must include the following items: 

• “Contact Us” information. This must include, at a minimum, the gatekeeper's name or e- 

mail address and should be displayed on the home page itself with a prominent “Contact Us” 

link. This should link to either a separate page or the default e-mail client's window interface. 

In most cases, adding the HTML code will automatically 

open a default e-mail client. 



• Obvious links and navigation. This navigation must include a link to the SGU home page 

(http://www.sgu.edu/) or that unit, department, or group's home page and to the home 

pages of any other higher-level sub-sites. 

• “Modification” or “Last Edit” date. This ensures that visitors to the site are aware of the 

timeliness of the content. 

• A link to the official SGU copyright policy. 

• At least 1 standard SGU logo in a prominent location on every page. (See Logos 

below) 

2.5. Specific Sub-level Page Requirements 

Pages linked to from a sub-site home page are considered to be sub-level pages. These pages must 

include the following minimum elements: 

• Obvious and consistent navigation to the home page of the sub-site (see requirements for 

this page above). 

• SGU standard logo appearing on the page (preferably at the top left corner). You may link 

the SGU logo itself to the home page if you choose to satisfy these first two requirements. 

• Modification date. 

• Gatekeeper “Contact Us” information. 

• A link to the official SGU copyright policy. 

• Use the “3-screen” rule: Load your page and hit the “Page Down” key on your keyboard. If 

you need more than 3 presses to reach the bottom, edit the content to reduce the size of the 

page to less than 3 screens. 

• Include your Home page's tags on each page inside your site. (See page 6). 



3. Basics in Web Page Design 

3.1. Content, Consistency and Your Users 

Content: Content drives all Web sites. Anyone who navigates to your site is, essentially, a 

consumer of your content. Make design decisions that improve the presentation of the 

content without interfering with it. The ideal user interface does not draw attention to itself 

but allows users to focus their attention on the content. 

Consistency: Familiarity and consistency throughout the site is paramount, Use the same, 

or at least similar, visual elements—such as graphics, fonts, logos, colors, styles, 

backgrounds/foregrounds—throughout the site for overall design consistency. Visitors should 

be able to go from page to page within a site without having to re-orient themselves at 

every click. 

Visitors/Users: Try to know your visitors, why they are at your site and what their 

resources are. For example, do they use modems? Are they on the university LAN or WAN? 

If so, what is their bandwidth? Do you they have a browser plug-in that your site requires? 

Are they Internet Explorer, Netscape, or Opera users? The answers to these questions will 

assist you in designing a site that is most accessible to your visitors/users. 

Assume that visitors and users are at your site for information, not entertainment. Do not 

insult their intelligence and waste time with links to nowhere or novelties that take too long 

to download. Use navigation that is logical and consistent. If they cannot use the site easily, 

they will not use it at all. 

3.2. Planning 

If your site makes accessing information easy, your site is usable. A site with a poor design and 

layout will detract from the user's overall experience. Chances are, no matter how valuable your 

content is, users will not browse the site if they experience frustration with any part of it. 

Planning the site requires: 

• Assessing the personnel and physical resources needed and time required not only creating 

the site but keeping it updated and active. 

• Defining your audience, including: 



o 

Their needs: What are they looking for at your site? What are their expectations? 

o 

Their resources: What technology do they have? This allows the possibility to include 

“extras” if they are high-end site visitors. 

• Defining and organizing content carefully. 

• Testing and debugging the site. 

3.2.1. Organization 

Your site's overall quality depends foremost on its content being carefully organized in a manner 

familiar to any user, including new visitors. Effective organization comes early in the planning 

process. The more time you spend planning your Web site, the less time it takes in development, 

testing and debugging time and resources. 

• Create a preliminary site map, on paper or electronically, before fleshing out the content. 

• Be clear in your writing style and usage. Avoid obscure acronyms, abbreviations or other 

jargon that may scare the visitor away from your site. 

• Use full departmental, building and other names when necessary. 

• Given that SGU is a worldwide community, include area codes in all telephone numbers. 

3.2.2. Layout and Navigation 

Many site visitors will not scroll down to read the bottom of a page for more information if the top 

did not capture their interest. 

• Create logical topic breaks in Web-page-sized pieces of no more than 1 to 2 screen lengths, 

and link the pieces together in a logical manner. 

• Never create pages more than 3 total screens in scroll length. 

• Avoid anything mysterious or revolutionary with your Web designs. A good user interface has 

obvious functionality, and users expect a specific result from every click. 

• Any link on the site should be no more than 3 clicks away, but strive for 2 clicks whenever 

possible. 



• Create a design that has multiple ways to navigate the site (textual links and graphical links) 

with descriptive tags. 

3.2.3. Sizing for Printing 

Consider making additional versions of pages you believe may be printed. The SGU.edu Web site is 

660 pixels wide because this the maximum size for a printable page where text and graphics will 

not run off the right side of the printed page. Do not exceed this 660-pixel number. Alternately, you 

may elect to provide a link to an Adobe PDF file that the user can download and print. 

3.3. Typography 

3.3.1. Fonts 

If you must specify fonts, use multi-platform fonts whenever possible (i.e., non-default). If you do 

not specify a font face, size or style, the browser default—in most instances, 10 pt Plain Times New 

Roman—will be rendered automatically. For readability purposes; however, we recommend that you 

use a sans serif (literally, “without feet”) font, which displays a cleaner, more legible typeface on 

screen without the extra formatting of each letter. 

Examples of sans serif fonts include Arial, Veranda and Helvetica. 

For example, the text specification for Black text formatted in HTML 3.2 is: 

Default text tag 

appears like this 

This HTML tag tells the browser to find and display the Verdana font on the user's computer. If 

Verdana is not installed, the browser is instructed to find the Arial font and if Arial is not installed, 

try to find Helvetica. If none of the defined three are installed, the browser default will be displayed. 

3.3.2. Plain Text 

Plain text should be used for text appearing within paragraph (), document body (), 

table () and table row () tags. The preferred formatting for this text is 10 pt Plain 

Verdana, Arial, or Helvetica, which are the SGU-standard Internet fonts. By convention, reserve 

underlined text for hyperlinks; avoid underlining for any other reason. 



3.3.3. Heading Text 

Heading text formatting should be used for text appearing within the table heading tag () and 

other heading tags ( to ). The preferred formatting for headings is 12 pt Bold Verdana, 

Arial, or Helvetica. No text should exceed 14 pt Bold in any font for any reason. 

3.3.4. Blinking Text 

Never use blinking text, which is difficult to read, does not print well and detracts from the 

professional appearance of the site. If you have to draw attention to something, try altering color or 

position, or use an appropriate graphical element. 

3.4. Editorial Style 

How you say what you say is as important as what you are saying. Be consistent with your editorial 

style, making clear to your audience at all times why it should browse your site. This philosophy 

should always be in the forefront during your planning and development stages. 

Here are a few editorial suggestions to help keep your audience engaged: 

• Do not use contractions. 

• Do not use jargon or abbreviations. 

• Write in the active voice. (Make the subject the doer, not the receiver, of an action: “Read 

this page for …” as opposed to “This page must be read for ….”) 

• Use terms consistently and clearly, as if the topic is new to the site visitor. 

• Write short, action verb-driven sentences. “We do this…,” “We offer that…,” “We teach 

you….” 

• Proofread for spelling and punctuation errors! 

• When in doubt consult a style manual. Several good ones are available in bookstores, and a 

few Web sites offer excellent online assistance. 



3.5. Design Elements 

3.5.1. Color 

Color is arguably the most encompassing and possibly most important of all Web design concepts. 

With the exception of the standardized colors used for the different schools at SGU (see SGU Colors 

below), color selection is your choice aesthetically. 

The eye is normally drawn to colored areas first, so use color to draw attention to titles and other 

important text. Be aware, though, that color can also inadvertently draw visitor’s attention to 

unimportant elements. Always consider how your color choices influence the flow of information on 

the site. 

Be 100% sure your colors will show up as you want them to on any browser. Select colors only 

from the default palette supplied with your design or Web creation program. This default is a true 

representation of the entire “Web Safe” color spectrum—256 colors that are guaranteed to render 

properly on a Web page. (Rendering refers to the browser's interpretation of specific code and the 

resulting display of that code.) As each browser may interpret the same code slightly differently, 

check your site on different browsers and configurations. 

Use foreground and background color combinations which have contrasting brightness, and not just 

contrasting colors. Typical combinations are black or dark blue font on a white or light yellow 

background, or some other dark font on a light or pastel background. Do not rely on color alone to 

provide contrast, as some visitors to your site may have color-blindness or monitor limitations that 

limit their ability to perceive color. A simple way to test your contrast is to browse your Web page in 

grayscale only. If you can still read the text easily, the contrast is fine. 

Avoid dark backgrounds with light fonts, which cause illegibility and printing difficulties. 

If you must use a color background other than white, use a light pastel. Pastel colors are easier on 

the eyes and do not detract from the content. 

Avoid patterned backgrounds, which make text harder to read. 

Avoid pages with black backgrounds, which may not print well. Generally, it is best to use a white 

background for better text clarity and graphical representation. 



3.5.2. SGU Colors 

SGU's four current schools have different pre-defined color schemes. If you are creating an 

electronic publication for any of the following schools, please follow the set color scheme: 

• School of Medicine: The color is dark blue. The hexadecimal color equivalent is “#003399” 

or simply “Dark Blue” as a color value. 

• School of Veterinary Medicine: The color is light green. The hexadecimal color equivalent 

is “#006062” or “Light Green” 

• School of Arts and Sciences: The color is dark red. The hexadecimal color equivalent is 

“#CC3300” or “Dark Red” 

• Graduate Studies Program: The color is blue. The hexadecimal color equivalent is 

“#003366” or “Blue” 

3.5.3. Wallpaper 

Background images, or wallpaper, can add to overall visual appearance but can easily become 

distracting. Always avoid wallpaper backgrounds in text display areas, where they skew and blur the 

text. The same is true for text applied over a photograph. Wallpaper can create significant problems 

for persons with certain disabilities. Generally, avoid using it. 

3.5.4. Whitespace 

Whitespace, the blank areas of a page, should be thought of as a design element rather than 

merely the gaps between elements. Generous whitespace makes a page more elegant and easier 

read. While we do not recommend leaving huge gaps between lines of text, some space between 

blocks or paragraphs of text, as well as between graphics, can create a desirable separation. 

3.6. Graphics 

Do not use images on your site until you completely understand graphics usage and placement. 

Decoration is not design! Do not use poor quality, blurred, low-resolution or moiré graphics, icons 

and images. Poor graphics randomly placed for the sake of having graphics convey the impression 

of an ill-conceived site. Have a design plan and adhere to it. 



3.6.1. File Types 

Graphic images can be either vector- or pixel-based in nature. Vector-based graphics are not based 

on pixels but are rendered by creating slopes and curves, rather than breaking the image into a grid 

of small boxes of distinguishable colors. Software applications such as Director, Fireworks, Flash 

and PhotoShop can help you create these vector-based graphics. Resizing, scaling and editing with 

vector-based graphics programs are non-issues, as images scale without losing quality or becoming 

pixilated. 

Pixel-based images are derived by breaking the image into blocks of similar colors. This preserves 

the detail of the image but makes it difficult to scale or compress the image without degrading 

image quality. The two most commonly used graphic file formats are JPEG and GIF, and both are 

pixel-based. JPEG (Joint Photographic Expert Group) is best suited for photographic images. For 

icons, graphics, maps, and other diagrammatic content with relatively large areas of solid color, GIF 

(Graphical Interchange Format) is best. 

An “interlaced” GIF and “progressive” JPEG slowly comes into focus while being downloaded, as 

opposed to waiting for the entire GIF or JPEG to load before it displays. Use progressive JPEGs and 

interlaced GIFs only for larger images, as this allows site visitors to decide if they want to wait for 

the entire image to load before moving on. However, try to avoid these images, as they take longer 

to download for users with a modem connection. Loading a lower-resolution version of the image is 

more important than losing users because of their impatience with a slow download speed. 

3.6.2. File and Image Size 

All images must be optimized with an image editing program, such as Adobe's PhotoShop or JASC's 

Paint Shop Pro. Each of these programs can reduce the byte size of any image by as much as 80% 

without any noticeable change in image quality. 

Pages themselves should be no larger than 32k. 

Keep all images below 20K in size unless the level of detail required is such that the image is larger 

even after optimization. No image of any kind larger than 31k in size is to appear on any page, 

leaving at least 1k for the page itself. 

If you must use large-sized graphics, consider creating clickable thumbnail images to access the 

larger images. Smaller and lower in resolution, thumbnail images load more quickly, giving the site 

visitor an idea of what the graphic shows before choosing to download the entire, usually much 

larger, file. 



Whenever possible, use images of not more than 600 pixels wide or 400 high. Larger images will 

require scrolling for many site visitors. Graphics scaled inside of a template or page without the 

correct image and parameters will display the actual 

and values of that graphic. Resize your graphic before including it on a web page 

rather than scaling it within a page or template. 

3.6.3. Image Maps 

When using image maps, make sure the clickable areas are visually obvious to the site visitor. 

Image maps, like all images, should always include an appropriate field that conveys the 

same descriptive information that the image displays. For images containing text, this field should 

repeat the text. For images used as bullets, horizontal rules, dividing bars and the like, use an 

ASCII equivalent as an field. For decorative images that do not convey page content, use 

 

Do not rely on the color of an icon or text as the only way to convey some information. If color is a 

key, ensure that there is also an alternate clue to that color's meaning. Remember that some of 

your site visitors may have visual impairments that limit their ability to distinguish color. 

3.6.4. Tags 

Describe all images and graphics with an appropriate tag. For figures, graphs, and other 

images too complex to fully describe with an Tag, also include a tag 

containing a complete description of what the image is intended to convey to the site visitor. 

3.6.5. Anti-Aliasing 

Anti-aliasing refers to the smoothing of the jagged edges caused by diagonal lines in an image. 

Pixels surrounding the edges of the line are changed to varying shades of gray or some other color 

in order to blend the sharper edges into the background. This technique is also called dithering, but 

is usually known as anti-aliasing when applied to diagonal and curved lines. 

When generating graphics, be certain to use software that can perform anti-aliasing adjustments. If 

you are not using high quality graphics, avoid using graphics altogether. Applications such as 

PhotoShop and Paint Shop Pro contain features to anti-alias images. 



3.6.6. Official SGU Logos 

SGU Logos are standard and should never be edited or manipulated. There are several logos to 

choose from. Some of the acceptable logos available for use in Electronic Publications at this time 

are shown in Figure 1 below: 



Figure 1: Acceptable University Logos 

3.7. Navigation 

Navigation tools are the control panel of your web site. The main navigation, either text-based, or 

graphic-based, should occupy a prominent place—and the same place—on every page of the site, so 

that visitors need not re-orient themselves on every new page. Generally, try to create both an 

obvious text menu and an obvious graphical menu (clickable images) to make sure users will not 

get lost while navigating. 

The SGU.edu Web site uses 3 different navigational elements on each page throughout the site: 



• The top portion of every page is the major navigation region, text-based and containing 

direct links to each school or program. 

• The left side navigational menu is a subset of the school or program you are visiting and is 

also textual. 

• The bottom section contains certain required links, such as SGU's copyright policy, how to 

contact the school, information on the webmaster, or how to find the site map. 

These navigational schemes remain in the same place on every page. Likewise, the graphical 

element on every page, the SGU crest, is also a link and is always in the same place. 

When designing navigation, consider related material likely to interest the visitor, and provide direct 

links to it. Some sites employ drop-down menus (or “jump menus”) of their most visited pages so 

that repeat visitors can jump straight to where they want to go. 

Always use meaningful, descriptive text on all links. Avoid the use of “click here” as a link. Site 

visitors should be aware of what is on the next page when they click on a link. When linking to a 

top-level file, such as “index.htm” or “home.htm,” create its link to the directory name, including 

the trailing “/,” to “index.htm/” or “home.htm/.” 

If you use graphical elements for navigation, make sure they are consistent throughout the site, 

allowing the user to feel more comfortable navigating. Always use tags for graphical 

navigation elements along with text menus to make your site more accessible to visitors who are 

visually or aurally impaired and those who have graphics or JavaScript features disabled. 

tags inform screen-reading tools or Braille-readers what graphics or images can not be seen or what 

the navigational scheme is and allow persons with disabilities to navigate freely. 

Avoid the use of parenthetical links or parenthetical citations. Parenthetical links are links to 

footnotes or definitions and tend to frustrate the visitor. Creating a glossary would be a better 

solution. Alternately, if your material is too complex to avoid this, consider editing or presenting it 

in a different format. Parenthetical citations are hyperlinks to sources outside of the SGU domain. 

Avoid citations, which tend to lead a person out of your site, never to return. 

3.8. Multimedia 

Electronic publications are subject to the same SGU policies and standards as print publications. 

They are also subject to an additional layer of policies and standards that often require extra steps 



to account for the delivery of the electronic publication to the end user. Because of certain 

limitations on the electronic transfer of these publications, you must account for user resources 

during the design of electronic publications. Specifically, users may have less-than-state-of-the-art 

hardware and software that might be used to download electronic publications. 

Bandwidth, the transmission capacity of an electronic line, is the main limitation of all networks and 

systems and is a primary consideration in design restraints. File transfer rates and download times 

are bandwidth-dependent and vary from place to place. Generally, a single 5-MB file can take 

upwards of 20 minutes to download over a dial-up, or modem, connection with a connection 

speed/rate of 28.8KBps. 

These conditions are commonly present in Grenada and St. Vincent, where many users employ dialup 

connections. Thus, it is still in everyone's interests to reduce overall file sizes to decrease 

download times. With a little planning and good design, you can save time for the user and help 

decrease the overall storage and network resources required by SGU, as users will remain on the 

network for shorter periods of time. 

The major culprit of slow downloads is the use of unedited images placed “as is” into Microsoft 

PowerPoint presentations, which are then placed “as is” into a QuickPlace. It is better to take a few 

extra steps now in order to save resources later. Optimizing these images and presentations can 

drastically decrease file sizes and speed download times. 

Use graphics only if they enhance your content or add to the professional appearance of the site. 

Graphics should not distract the site visitor trying to find your content. Placing eccentric, extremely 

high-resolution animations, audio, video, blinking or flashing text, or intricate graphics on a page is 

usually not consistent with good design principles. 

Since multimedia adds to the download time of a page, avoid the use of audio, video and other 

media generating large files unless explicitly necessary for the delivery of your content. When audio 

and video must be used, again keep in mind the needs of those with sight or hearing impairments. 

You may need to provide an audio description or a transcript of video content to ensure complete 

access to the content. Provide information via either tags or descriptions that indicate size 

and type of file whenever there are links to video, audio or other specialized content. 



3.9. Things to Avoid 

3.9.1. Empty Content 

Avoid the use of initial splash screens or zero-content site covers, which serve as barriers before the 

user reaches the home page. Take the user to your content as quickly as possible, in a maximum of 

three clicks; a splash screen wastes one of those three clicks. 

Do not use “Under Construction” signs or text. If a page is not complete, do not upload it or link 

anything to it. Site visitors do not care that it will be done “soon.” 

3.9.2. Visitor Inclusion 

Do not publish for specific groups of site visitors. Instead, develop pages that are useful for all (or 

as many as possible) site visitors. Your task is to create good electronic publications and not to 

appeal only to certain groups. Using features only available to some site visitors is not consistent 

with the professional image that SGU presents. 

3.9.3. JavaScript 

Avoid JavaScript unless absolutely necessary. Given the current state of browsers and technology in 

general, certain JavaScript code can crash a site visitor’s computer. If your site crashes a visitor’s 

computer, you may have just lost that visitor. 

3.9.4. Non-SGU Content 

Content speaking for any other organization, including professional organizations, may be housed 

on the SGU server only by specific prior agreement and only in the Member Center area. 

Occasionally, SGU may grant an outside organization space on the server based on our contractual 

and/or professional obligation or affiliation with such an organization. 

3.9.5. Sponsorship and Advertising 

Generally, SGU Web pages, including course materials, will not include external advertising. 

However, there are cases where a unit may acknowledge support from an external entity. There are 

specific University policies governing what may and may not be included in such an 

acknowledgment. Units wishing to make such acknowledgments within their Web materials must 

first clear them with the University. 



Content speaking for or to a student organization should be housed in the 

www.sgu.edu/membercenter area. Any recognized student organization may request space in the 

member center. These student-run Web sites or QuickPlaces are all subject to the rules St. George's 

sets forth in these guidelines, as well as this electronic publications Policy and any ruling of the SGU 

Publications Committee. 

3.9.6. Renaming of Files 

Once a Web site has been published, avoid reorganizing the material or changing the file names. 

There is no way to judge how widely existing pages have been bookmarked or linked to on other 

sites. Arbitrary name changes cause content to “disappear” and become unusable. If a name 

change is unavoidable, always link any prior file names to working pages in order to direct the site 

visitor to the new location. This will allow previously bookmarked pages to be a conduit to their new 

locations. 

3.9.7. E-mail Files 

Bulk e-mail, i.e., one e-mail message sent to more than 10 people, uses SGU computing resources 

and is also subject to the guidelines for electronic publications. 

Bulk e-mail requires each message to be duplicated for each address appearing in the Send to:, 

To:, CC: and BCC: address fields. This taxes resources, even more so if there are attachments. 

Attachments to bulk e-mail must be recreated, re-sent, re-stored by the e-mail servers and then redownloaded 

for each recipient. For example, one relatively small attachment of 50KB sent to 500 

people actually consumes 25MB of space. Remember, too, that each SGU e-mail account is subject 

to size limitations. Once this limit is reached, no further e-mail can enter that mailbox. An inbox full 

of attachments blocks important messages from reaching the owner of that account, sometimes 

with serious consequences. 

Bulk e-mail notices should be no larger than 10KB and should not contain attachments. Messages 

should instead include the information what would have been in an attachment as part of the actual 

e-mail or should contain links to Web pages with the content of the attachment. This may require 

creating a page in an existing site or QuickPlace, or asking one of the SGU News editors to create 

the page with your attachment information in it. This option gives the recipient the choice of 

accessing the content with one click and not taxing the University's resources. 



4. Policies for QuickPlace Publications 

QuickPlaces are subject to the same rules and regulations as all other SGU electronic publications. 

Additional information specific to QuickPlace publications is found within this section. 

4.1. Browser Considerations 

QuickPlace functions with Internet Explorer and Netscape 4.79. You must advise your visitors/users 

that they must use either of these browsers to access your QuickPlace web site. The first rule of 

Web design is: if the user can not use the site, the user will not use the site. 

4.2. QuickPlace Servers 

St. George's University uses 3 separate servers, or central computers, where information is stored 

and then retrieved by site visitors, to house all QuickPlaces. Before a QuickPlace can be created and 

used, you need to know which server to uploaded files to for storage. These servers are designated 

as follows: 

• QP1, which serves the community outside of Grenada and St. Vincent 

• QP2, which serves the community in Grenada 

• QP3, which serves the community in St. Vincent. 

4.3. Creating Presentations 

SGU faculty members using the QuickPlace model for publishing class-related documentation need 

to take extra care before uploading their PowerPoint presentations to SGU QuickPlace servers: the 

overall size of each complete PowerPoint presentation must not exceed 500KB. 

In order to achieve the smallest file size possible, anyone uploading a PowerPoint presentation must 

use an image-editing tool to make each image “Web ready.” Use editing tools such as Paint Shop 

Pro or PhotoShop to decrease the size of each image used in the presentation. These programs can 

reduce images by as much as 75% of their byte size without any noticeable change in image 

quality. (See below.) 

In addition, you can use programs such as Impatica for PowerPoint to convert and compress your 

PowerPoint file into a Flash file. 



4.4. Optimizing Images with Paint Shop Pro 

The easiest way to minimize each graphic is first to gather all of the images you plan on using in 

your presentation into one folder. 

Open Paint Shop Pro by clicking the icon or using the Start Menu and drilling down to find its 

executable. 

Open the images in Paint Shop Pro. It may be possible to open all of the images at once, depending 

on your system. If this does not work, open one image at a time. 

In order to reduce the byte size of each image, simply select File-> Export-> JPEG Optimizer -> 

75% and when prompted to Save the file, choose a name and location for the file. 

The interface for the JPEG Optimizer appears in the drop down menu (Figure 2). 



Figure 2: Opening the JPEG Optimizer 



When prompted to Set Compression Value, select 75% and then select OK as shown in Figure 3. 

Figure 3: Paint Shop Pro Optimization Interface 

Paint Shop Pro lets you preview the change before making the changes. Holding down the CTRL and 

Z keys simultaneously will undo any changes that have been made. The process can then be 

repeated with a lower compression value. The program also shows how much the file has been 

reduced in overall size. In the example (Figure 3 above) the image began as 0.72 MB. After 

compression, it was reduced to 0.021 MB. 

Once all of the images have been optimized, they can be saved to a folder and used in PowerPoint 

presentations or other electronic publications. 



5. Finishing Touches 

5.1. Checking the site 

Once an electronic publication has been created, check it on multiple platforms and configurations. 

The equipment that site visitors use to access your content will vary, so check for usability with 

various screen resolutions and text sizes (since many users still have 14 or 15 inch monitors), as 

well as on different computer platforms (Macintosh versus IBM/PC/Windows). 

Make sure your text is large enough to be read in all of the settings for text. (See section on font 

displays below.) 

Check your Web site via a modem or dial-up connection to make sure it loads quickly. Check the 

overall size of each page in your Web-authoring tool. (See Checking Sizes with Authoring Tools.) A 

rule of thumb is that it will take users with a 28Kbs connection approximately 8 seconds to open a 

28KB page. 

5.2. Major Browser Font Displays 

Ideally, much time and thought has gone into the development of your content. Visitors now need 

to read the text easily, regardless of their monitor resolution or browser settings. Both Internet 

Explorer and Netscape allow the user to define the size of text they prefer as a browser default. In 

order to assure the most user-friendly site, change these settings and note the resulting text 

changes. Instructions for how to do this are in the following sections. 

5.2.1. Internet Explorer 

Choose View from the menu bar, scroll to Text Size -> and choose size as desired. 

5.2.2. Netscape 

Choose View from the menu bar, scroll to Text Zoom -> and view your page with each size as 

illustrated in Figure 6 below. 



Figure 6: Netscape’s Text Size Panel 

5.2.3. For Advanced HTML Coders 

There is a way to keep the text one size for all site visitors by using the , for preformatted, 

HTML tag. If you must display your text in a specific style, use the pre-formatting tag. When using 

the text tag, you must specify the font face and size. No matter what the site visitor’s 

setting is, it will render what the preformatted tag tells it to. 

5.3. File Size 

One of the most important facets of publishing in any media is the size of the publication. Electronic 

documents often contain huge amounts of data, which in turn require proportional amounts of 

storage and transfer resources. It is imperative to check individual file sizes before publishing. If 

you are unsure of how to do this, here are a few ways: 

5.3.1. Using Windows 

To check file sizes in Windows, use either method below: 

Browse to the file in its folder and select View->Details, which will list the name, size and last 

modification date of the file. 



If the item is on your Desktop, Single-left click on top of the item, then single right-click on the 

item. On the bottom of the menu that appears, select Properties, and a new Window will open with 

the details of that file. The window should look similar to the one in Figure 7 below. 

Figure 7: Properties Window 

5.3.2. Using Authoring Tools 

QuickPlace contains a built-in file size monitor that measures the size of a file. It may also estimate 

your download time. While the file sizes of component images and text are not itemized, it does 

give the size of the document as a whole. 

1. Monitoring File Sizes with QuickPlace: QuickPlace's built-in size monitor displays the actual size of 

a file before it is uploaded. While QuickPlace provides more than one way to upload files, no matter 



what method you use there is only one window that displays the size of that file. The file set to be 

published in the example shown in Figure 9 is 16KB, well within the 32KB range acceptable for 

publishing at SGU. This particular page contains 13 small graphics and still remains well below the 

maximum allowed for size. The program then gives you the opportunity to cancel, replace or publish 

that document. 

Figure 9: QuickPlace's Size Display 

2. QP Attachment Sizes: The QuickPlace interface's attachment window displays the size of the 

file(s) to be uploaded. An example of this window is shown in Figure 10 below. The first attachment 

in the example is 54KB. While this is a bit large for a photo, it may have been larger prior to 

optimization. The other attachment, a 234KB PowerPoint presentation is within the limits and would 

be cleared for publishing. 



Figure 10: QuickPlace's Attachment Window 

5.4. HTML/W3C/WAI Standards 

Make sure to test your pages on multiple site visitors to insure their effectiveness. Since not all site 

visitors will yet use browsers supporting all HTML 4.0 features, avoid any dependence on those 

features beyond the scope of the HTML 3.2 standard. Web pages that use features beyond the 

scope of HTML 3.2, such as JavaScript or Cascading Style Sheets, should be designed to also 

display and function properly, without any loss of content or navigation, on vanilla HTML 3.2 

browsers. This will be a WAI/W3C standard in the near future. Refer to the W3C's site (World Wide 

Web Consortium's HTML Specifications) for more information. 

WAI is the Web Accessibility Initiative, which oversees standards for creating Web pages for the 

impaired. WAI is currently establishing minimum standards that the SGU community eventually will 

have to observe. It may be wise to research these standards now and be in compliance before they 

become mandatory. 

6. Site Maintenance 

Redirect dead pages rather than deleting them. People can bookmark any page of your site, so 

deleting pages will leave visitors with broken links and useless bookmarks. Redirecting them to the 

best new location for that old information will allow them to find the information they seek more 

easily. 

Check for dead links or pages that do not exist anymore, both within your site as well as in external 

links. There are many tools available to scan your site for dead or broken links. The online site 

WebSiteGarage.com also features many free site maintenance tools. 



Appendix - HTML Reference Chart 

HTML is derived from SGML (the Standard Generalized Markup Language). An HTML document is an 

SGML document with a fixed set of tags. While HTML tags can change with each new revision, they 

are not flexible and must be used exactly as written. 

Document Tags 

 

Creates an HTML document. 

 

Sets the title and other information not displayed on the page. 

 

Stores information not displayed on the page. Keywords placed 

inside this tag are what search engines seek when conducting 

searches for site visitors. 

 

Puts the name of the document in the site visitor's title bar. 

Body Tags 

 

Sets off the visible portion of the document 

 

Sets the background color, using name or hex value 

 

Sets the text color, using name or hex value 

 

Sets the color of links, using name or hex value 

 

Sets the color of followed links, using name or hex value 

 

Sets the color of links on click 

Text Formatting Tags 

Sets size of font, from 1 to 7) 

 

Sets font color, using name or hex value 

 

Creates a new paragraph 



Aligns a paragraph to the left, right, or center 

 

Inserts a line break 

 

 

 

Indents text from both sides 

Creates a definition list 

 

Precedes each definition term 

 

Precedes each definition 

 

Creates a numbered list 

 

Precedes each list item, and adds a number 

 

Creates a bulleted list 

 

A generic tag used to format large blocks of HTML, also used 

for stylesheets 

Link Formatting Tags 

Creates a hyperlink 

 

Creates a mail-to link 

Creates a target location within a document 

Links to that target location from in the document 

Image and Graphic Tags 

 

Adds an image 

 

Aligns image left, right, center bottom, top, middle 

order=?> 

 

Inserts a horizontal rule 

 

Sets size (height) of rule 

 

Sets width of rule, in percentage or absolute value 

 

Creates a horizontal rule without a shadow 

Table Tags 

 

Creates a table 

 

Sets off each row in a table 

 

Sets off each cell in a row 

 

Sets off the table header (a normal cell with bold, centered 

text) 

 

Sets width of border around table cells 

 

Sets amount of space between table cells 

 

Sets space between a cell's border and its contents 

 

Table Width. Pixels or as a percentage of document width 

or 

Sets alignment for cell(s) (left, center, or right) 

or 

Cell(s) vertical alignment.Top, middle, bottom 

 

Sets number of columns a cell should span 

 

Sets number of rows a cell should span (default=1) 

 

Prevents the lines within a cell from being broken to fit 



Form Tags 

 

Creates all forms 

 

Creates a scrolling menu. Size sets the number of menu items 

visible before you need to scroll. 

 

Sets off each menu item 

 

Creates a pulldown menu 

 

Sets off each menu item 

 

Creates a text box area. Columns set the width; rows set the 

height. 

 

Creates a checkbox. Text follows tag. 

 

Creates a radio button. Text follows tag 

 

Creates a one-line text area. Size sets length, in characters. 

 

Creates a Submit button 

 

Creates a Submit button using an image 

 

Creates a Reset button

Guidelines for Electronic Publications - St. George's University

Create successful ePaper yourself

Delete template?

Save as template?