PASTPERFECT-ONLINE DESIGN GUIDE

(1)

1

PASTPERFECT-ONLINE

DESIGN GUIDE

INTRODUCTION

Making your collections available and searchable online to Internet visitors is an exciting venture, now made easier with PastPerfect-Online. Once you have your collections online and available for research, it is important to make searching as easy as possible, while keeping the look of your site attractive. This guide is intended to assist you in this process.

Good design principles not only help you create a site that is easy to use, but these principles also help you build a site that will keep online visitors coming back often for more information. Sites that have confusing layouts or harsh color schemes may unintentionally keep visitors from finding information at your site. If you have any questions about how to achieve a certain look, or if you would like someone to customize your site for you, please contact us by e-mail at

[email protected] or by phone at 1-800-562-6080. An MWeb™ PastPerfect-Online Client’s Guide is available to you by going to

(2)

PastPerfect-Online Design Guide 2

OUR RECOMMENDATIONS

When designing the interface of a searchable online database, it is important to keep the Internet visitor in the forefront of your mind. They are at your site looking for information that one of your employees or volunteers spent lots of time entering. The site should be clean and attractive, giving top priority to functionality and ease of use. Let your data and images take center stage and have the site complement the information.

With the millions of combinations of colors, fonts, layouts, and designs, it is impossible for every PastPerfect-Online site to exactly match the existing sites of each organization while remaining affordable. Every PastPerfect-Online site can, however, complement each client’s existing site so the Internet visitor will have an easy transition between the main website and the PastPerfect-Online site. Common layout, colors, fonts and logos greatly help the Internet visitor transition to your PastPerfect-Online site.

EXAMPLES OF CUSTOMIZED PASTPERFECT-ONLINE SITES

Many of our current PastPerfect-Online clients have customized their

PastPerfect-Online site or have asked us to create a PastPerfect-Online site that more closely complements their existing websites. If you are looking for ideas or just want to browse, some examples include:

Hoboken Historical Museum:

http://hoboken.pastperfect-online.com/32340cgi/mweb.exe

Jewish Museum of Maryland:

http://jmm.pastperfect-online.com/00005cgi/mweb.exe Chevy Chase Historical Society:

http://chevychasehistory.pastperfect-online.com/34214cgi/mweb.exe

Long Island Museum of American Art, History & Carriages:

http://longislandmuseum.pastperfect-online.com/31410cgi/mweb.exe For a complete listing of PastPerfect-Online sites, please visit:

(3)

GETTING STARTED: UPLOADING A PAGEBANNER

The best way to get started is to display your logo at the top of the site. The logo provides continuity for Internet visitors moving between your existing website and your PastPerfect-Online site. The logo that displays at the top of each PastPerfect-Online site is called a pagebanner. The pagebanner file should be named pagebanner.jpg. Our recommended size for this image is 800 pixels long by 100 pixels high, keeping the pagebanner short in height so the Internet visitor can use most of the screen for viewing search results. Later on in this guide, you will learn how to make the pagebanner clickable to take the Internet visitor to your main website.

To upload your pagebanner, please locate the PPO Welcome Letter with the login information that came in your PastPerfect-Online User’s Guide and follow the steps below:

1. Make sure you have the banner or logo of your current site saved as pagebanner.jpg.

2. Right click on pagebanner.jpg and select “Copy.”

3. Next, right click on the Windows “Start” button, then click on “Explore” or “Open Windows Explorer.”

4. In the address bar, type in your “FTP SITE” as listed in your PPO Welcome Letter (ftp://server#.pastperfect-online.com – replacing “#” with your one- or two-digit server number). Then press “Enter.” 5. Type in your “USER ID” and “PASSWORD” as listed in your PPO

Welcome Letter. Then, click “Log On.”

6. Double click your graphics folder (00000graphics). 7. Right click on a blank spot.

8. Select "Paste." You should see the “pagebanner.jpg” file listed in the folder.

(4)

MWEB

TM

INTERFACE MANAGEMENT SYSTEM (IMS)

In addition to adding a pagebanner, there are other changes you can make to your site, such as modifying the color scheme, layout, font styles, etc. All of these changes are controlled by the Interface Management System (IMS) website.

Accessing the Interface Management System

To access IMS, please follow these steps:

1. Open an Internet browser and go to the “IMS SITE ADDRESS” as listed in your PPO Welcome Letter.

2. Enter your “IMS USER ID,” “IMS PASSWORD,” and “IMS PROJECT CODE” as listed in your PPO Welcome Letter, then click the “Go” button. This will bring you to your IMS site where you can make changes to the look of your PastPerfect-Online website. When you first log in, there are four options (components):

Change Options – This section allows you to add or remove the Click & Search

and/or Random Images search functions from your PastPerfect-Online site. You can also add a “Home” button that visitors can click to get back to your main website, set up email notifications, set up statistic reports, and more.

Change Messages – This section allows you to change the messages that appear

on your website pages, including: the title of the window, the footer, the address for the “Home” button, and the HTML text to insert the pagebanner.

Change Layout – This section allows you to change the layout, color scheme, and

font style of your site to better complement your existing site.

Change Styles – This section allows you to change the Cascading Style Sheet

(CSS) that formats your PastPerfect-Online site. If you are not sure what changes to make here, you should leave the information in the fields as is.

More details about these components can be found later in this Design Guide. Once you have saved your changes in the MWebTM_{Interface Management}

(5)

IMS CHANGE OPTIONS

The Change Options screen allows you to add/remove certain optional features. Once you’ve made your selections, be sure to click the “Accept New Options” button at the bottom.

Options Selections Quick Help

Click-&-Search Adds a Click-&-Search button to the MWeb Main Menu.

Email This Page Links will be added to all Full Records and Image Windows, for

users to email a link to the page.

Feedback Form

If you enter an email address, links will be added to all Full Records and Image Windows for users to provide feedback. This can be anything you ask for, such as information about the object or image. The information they provide will be emailed to the address you enter here. Using IMS you may allow the user to sign up for your email and/or paper mail lists.

Home Button

A Home button will be added to the MWeb Main Menu. To provide the URL for the Home button, use IMS Change Messages to change the MM_HOMEBUTTON in the MAIN MENU section.

Human Verification

Adds arithmetic problem to email forms to verify sender is human.

Image Order Form

If you enter an email address, links will be added to all Full Records and Image Windows for users to order the images. The order form will be emailed to the address you enter here.

Images in Main

Window Check if images should NOT open in separate windows. Image Window

Height

For Image Window Height and Width, enter the size in pixels (without adding "px").

Image Window Width

To test the Image Window dimensions, click the Accept New

Options button below, then close all MWeb image windows,

refresh the MWeb display, then click a thumbnail.

Random Images Objects Photos Library Archives Images Creators People Search Terms

Checking one or more Content Types will add a Random Images button to the MWeb Main Menu. Images shown will be from the selected Content Types. To remove the Random Images button entirely, uncheck all of the options. (Changes require re-running Preprocessor.)

Statistics If you enter an email address, a monthly statistics report will be

(6)

IMS CHANGE MESSAGES

This section allows you to change the messages that appear on your website pages, including: the title of the window, the footer, the address for the “Home” button, and the HTML text to insert the pagebanner. Here are some of the most common messages to change:

ALL PAGES

The messages available to change under “ALL PAGES” are those that appear on every screen.

AP_PAGEBANNER – allows you to change the pagebanner path or filename. Most of the time you do not need to do anything with this section. The default HTML coding allows you to display your logo (called pagebanner.jpg). See the Getting Started section earlier in this Design Guide for more detailed instructions about uploading a pagebanner. AP_WINDOWTITLE – allows you to change what text is displayed at the top of the window browser. The default text is “PastPerfect for the Web, 2d edition,” but you can edit it to read whatever you would like.

DP_FOOTER – allows you to change the text displayed in your footer. The default text is “Put your footer here” and can be customized to display almost anything - your museum’s contact information, visitation hours, copyright rules, tips for searching, etc. The MWebTM_copyright

statement at the very bottom of the footer is required and cannot be changed. See Edit Footer Text section under the Customizing tab for detailed instructions.

MAIN MENU

(7)

PastPerfect-Online Design Guide 7 MM_HOMEBUTTON – allows you to enter a complete link to your

homepage so that when you click the “Home” button on your

PastPerfect-Online site, you will automatically be directed back to your homepage.

FULL RECORDS

These allow you to change the heading text that appears on the search results page for each type of record found. The defaults are: Object Record, Photograph Record, Library Record, Archive Record, Image Record, Creator Record, Person Record and Search-term Record.

(8)

IMS CHANGE LAYOUT

The Change Layout section allows you to make basic changes to the layout, color scheme, and font style of your PastPerfect-Online site. We recommend making your selections in order. You can also periodically update the preview at the top of the screen to see your changes. The preview displays approximate changes, so be sure to click “Save All Selections” once you’re finished and then view the results on your live PastPerfect-Online site. You may need to refresh the web page (by clicking the “Refresh” button or pressing the “F5” key) to see the changes.

1. Click to choose layout

Suggestion: Do this first as it will overwrite color selections.

2. Position narrow displays (applies to vertical menu only)

3. Narrow display width

Width of the content for all displays except Search Results, Full Records, and Image Windows.

4. Click to choose color scheme

Warning: Clicking one of these will overwrite any custom colors you may have in the next section.

(9)

5. Customize specific colors

Enter color names shown in this Color List, or any valid HTML color codes (such as #AB66CD, upper- or lower-case; you must add the # before a color code, but not before a color name). You need to change only the colors you wish to override. It is a good idea to view the colors on your computer as colors may appear differently on other computers and when printed.

6. Set background image or pattern

Enter filenames of GIF or JPEG images, such as "background.jpg". Enter the word "none" in a box to remove a background image.

Images must be uploaded to your graphics directory (such as /12345/12345graphics/) before they can appear in PastPerfect-Online, or in the preview window above.

(10)

8. Choose fonts

9. Main Menu button size

Click button to choose.

10. Main Menu button borders

Click button to choose.

11. Link and button text colors

Enter color names shown in this Color List, or any valid HTML color codes (such as #AB66CD -- you must add the # before the code).

You need to add only the colors you wish to override. It is a good idea to view the colors on your computer as colors may appear differently on other computers and when printed.