Graphical User Interface for Websites

This page defines user functional requirements for websites and techniques to satisfy them. This is part of the Web project plan

Sound: Cool!

Topics this page:

Site Map  
About this site  

Site GUI Capabilities

This table arranges possible links in websites according to type of usage and (more importantly) on whether each link is focused on the user, inwardly on the site itself, or outwardly to content topics and others in the site's community.

Functionality

Navigation

Content

Greeting / Introduction

The first page that a user sees. Many put their “Who we are” statement here.
• Browser cookies (text file stored on user machine) to track what online advertisements a user has seen so that when a user revisits the site, the server can read the cookie to make sure the user is presented with ads they haven't seen before.

About Us / Mission

Rather than make a big deal about “integrity” and other over-used words, it might be better to call your principles / philosophy a Manifesto, such as this one

Easy but quick, secure sign-on/logon

• HTTPS and SSL

• VPN and Firewalls
• flick.com on authentication
• Digital signature (certificate of authenticity) from an authority such as Verisign or GTE.

Menu

Portfolio Navigation

• Auscomp's eNavigator suite offers various views.
• Map.net by XML co-inventer Tim Bray presents all websites of the world over a map of Antartica.

  
  Click on a company name on the list and raised box graphics appear for items related to that company. Click on a category under the box and raised box graphics appear for the category (“Communication”). Visited items are in grey. Red marks the current item shown.

How We Work / Our Expertise / Process / Methodology

Mouseover fingertips, the related phase highlights on the upper right, the the circles in the hand also changes. Too distracting for me.

The names of Thiel's processes are too cerebral for me:

Glossary

A Glossary is helpful as a backup to simplified proposals and other communications -- a bridge between people.

Map

This page contains an example of a working image map.

Checkout / Payment

Paypal

Mining Co. article

MasterCard on SET

• Card Service
• Cybercash is one of the leading vendors for transactions over the internet.
• Cyber Source
• iBill
• IBM Payment Suite
• Shopsite.com
• Pandesic

Facility Floorplan / Tour

Students at this high school simply associated photos to a campus map

IPIX and Apple's 3D viewer.

Search pages on the site

• Microsoft's Advanced Search Module, Web Find Fast (shipped in the "SRVPACK" Service Pack folder on the Office 97 CD) maintains indexes of textual data in HTML pages and all the summary properties in MS-Office documents (Author, Title, Subject etc.). Is this superior to the Microsoft Index Server included with NT4 Option Pack?
• Microsoft Index Server 2.0
• Proprietary "search engines" to run on your server from Inference and Infoseek
• Image file indexing/reviewing
• Alta Vista and Technotrade's SQL Search Engine enables switching lingual searches (example: www.leti.no)

Surveys, Voting, Quizzes

Design firm Sundberg-Ferar hosts brainstorming sessions

• Webpoll (formerly pollit.com and Entertainmentland.com) charges $4 per month if you don't want their ads and links with your survey. Their software has several formats for displaying results.

Software on your own web server:

• Perseus SurveySolutions Express
• SurveysAid.com package.
• Virtua's FastVote Java package is $149 per server.
• AnyVote SSI server side includes is $10 shareware.
• WebRespond is a Java 1.02 applet for conducting quizzes. They will give out their source code for $30.
• Test Pilot Java server extension, originally written at Purdue, charges $495 for 500 participants.

Our People / Principals / Departments

• Pictures of people give the site humanity. Howerver, a lot of sites don't want to give the public the names of key employees in fear of getting them stolen.
• A department list is helpful, especially phone extensions to save people phone tree hell.

  The bios of people (and pets) associated with this site appear when you mouseover their cartoon within a cut-out floorplan

  This site features each principal in a Flash movie

User Forums

• Build a community so people have a reason to return to the site.
• Compuserv Forums
• RemarkQ

replies

• Gossamer Forum software offers forums that are built template-based. It's SQL-driven and has powerful search capabilities.

email notifications

• New Events, articles, industry news. Special Deals on Products/Tools, New Links.

• Trellix.com was started by Visicalc co-inventor Dan Bricklin.
• upstatepress.com

Secure Server

• SSL (Secure Socket Layer) servers (using HTTPS) by default run on TCP port 443 instead of the default port 80 for HTTP.
• One option for low volume sites is to accept all orders on-line then manually process back-end processing.

Shop for Christmas

Most eCommerce sites have this. Shopping

EDI

• Electronic Data Interchange between companies.

Request User's Email

• Teaser
• Additional information after registration

Dynamic Banner Administration

• Dynamic Banner Administration
• Clickthru.com

Identifying recent changes

• Paint a red border for text which have recently been changed.

• Use an IPP with a T3 connection to the Internet backbone!
• Use ISAPI instead of CGI. Unlike CGI executables which are instantiated every time that they are called, ISAPI is fast because once an application is loaded into memory, it is not released —making subsequent calls quick because the operating system need not load the DLL again.
• This also allows information about the application to span several requests. In technical terms, the state of an application is maintained across multiple calls in global variables protected with critical sections. This is usefully when you implement ODBC connection caching for additional speed. In comparison, CGI executables do not have a way of maintaining state across multiple requests.

Compatibility with browsers:

• hardware platforms (PC, Mac, UNIX/Sun, Digital, AS/400, etc.)
• PC operating systems (DOS 6.22, Win 3.1x, Windows 95, Windows 98, Windows NT, Windows 2000, Red Hat & Caldera Linux, OS/2 Warp, etc.)
• Various VGA screen modes (Super VGA)
• Mac operating systems (6, 7.0, 7.5, etc.)
• Unix, DEC, and other operating systems

Music

• Random music selection upon entry into site?

Calendar

.

Videos

• Real Audio/Audio, .RAM (RealAudio Metafile) file for every RA Stream Jukebox
• Macromedia Shockwave,
• QuickTime Video,
• MPEG video, etc.

Globalization (I18N/ L18N / Translation)

Creating a Multi-lingual web site

Considerations for Language Translation:

• Language Strings in the user interface (menus, dialog boxes, and error messages)
• Printed and online documentation

Locale-specific settings:

• Date/time formats (separators, order of day/month/year)
• Number formats (decimal and thousand separators)
• Currency formats (symbol and format)
• Sort order and string comparison

Building Worldwide Websites notes that “By localizing a site into six languages other than English (Japanese, German, French, Spanish, Portuguese, and Swedish), a site can reach 90% of the online population today.”

Microsoft's Word List is a comprehensive set of words and phrases that either appear in the Microsoft Windows user interface or are used in describing key concepts of the operating system to users.
• Free Translate performs automatic translations. It's not perfect, but it's free.
• eTranslate claims to have the largest pool of web-based translators in the world.
• Alta Vista's Search Engine from Systran searches words in several languages.
• New York Times Babylon translate to Spanish , German , Japanese, French, English, Dutch, Italian, Portuguese, and Hebrew
• Clever learn translates words between English and German.
• Transparent Language, Inc. offers free translations at FreeTranslation.com.

GUI Navigation

Apycom.com Java and Javascript GUI library