In addition to the design and structuring of the exhibit site, usability and accessibility are also necessary aspects to consider when building your project.
Usability means how effectively users can interact with and navigate a site.
Accessibility means how effectively users with disabilities or technological disadvantages (e.g., slow internet access) can use a site and how equivalent their experience is with the experience of users who do not have such challenges. Often steps taken to better serve the disabled also serve those who are technologically disadvantaged, e.g., video transcripts can serve the hearing impaired and those who do not have the internet bandwidth to play a video.
Visual Design - A good rule to follow is to keep it simple. A lot of different colors, decorative elements, and busy layouts can make the exhibit more difficult to navigate and the information more difficult to process. This is especially true for those with disabilities.
Page Organization and Layout - Breaking up the text into logical sections makes it easier to read. (Avoid having a "wall" of text.)
Headers - Use headers and subheaders to help logically break up the content on a page and to introduce/frame the information to come. This will make the page more readable and easier for screen readers to navigate.
Contrast - There needs to be strong contrast between the background and text. This means the colors need to have enough difference between them (both in intensity and hue) and that text is not on top of an image that makes it difficult to read. (There are browser extensions for checking contrast.)
Fonts - Avoid using ornate and difficult to read fonts and avoid using all caps.
Alt Text - Images should have alt text. Read more:
Captions - Videos should have captions.
Transcripts - Audio files (e.g., podcasts) should have transcripts; having transcripts for videos is also helpful and necessary if captions are not possible.
The following resources provide more helpful information on accessibility:
Web browser extensions list for checking accessibility, e.g., contrast and screen reader functionality
After considering the topic, desired effects, and objectives follow the steps below. (The order is suggested and not entirely necessary.)
1.) Select the objects that will be featured
The object selection process requires careful consideration and includes determining whether any digitization is needed and whether there are any intellectual property concerns. (See the Intellectual Property libguide for more on the topic.)
2.) Determine how you want to organize your objects
The order objects will go in, the way they are grouped, and how they are juxtaposed are major components of the curation process. It is helpful to play around with the order, even if only to ensure your chosen order is the best one.
3.) Select your exhibit platform
Choose the platform most appropriate for the content and the desired type of interactivity.
You may already know which platform you plan to use or the one you have to use based on what is available to you. If not, it can be helpful to base your platform selection on the content you have as opposed to shaping your content to fit into a given platform.
4.) Write your text
Write exhibit content for the introduction page, object labels, and group labels. (Also see "writing for the web," a topic that applies when writing for an online audience.)
Introduction page: Information that introduces or "sets the scene" of the exhibit
Object labels: Information that describes and contextualizes exhibit objects
Group labels: Information that explains how a group of objects are related, contextualizes the objects, or simply introduces them as a whole
This step requires consideration of the intended audience: Is the exhibit intended for a general audience? Or, is it intended for an audience with preexisting knowledge about the topic? The answer to these questions will help determine how much explanation is needed and will influence word choices.
Write accessibility text, i.e., alt text, video captions, transcripts (see Usability & Accessibility).
5.) Determine the site organization
Design the site's information architecture (structure, navigation, taxonomy, page layout, etc.) (See Site Organization).
The choices made here shape the flow of the exhibit and the interactive experience.
Organization choices have a major impact on exhibit usability and accessibility.
6.) Make Design Decisions
Make design decisions, e.g., choose fonts, colors, landing page image(s), etc. (Read Visual Design Basics).
Design decisions have a major impact on tone and usability and accessibility.
The following are some major concepts that should be considered when creating the site in which the exhibit lives.
Information Architecture (IA) - The structure of the site (e.g., the site hierarchy, the way pages link to each other) and the labeling of information so that it is understandable and navigable. (Read Information Architecture Basics and see below.)
Taxonomy - A component of IA that involves the language chosen to label menus/navigation bars, page headers, etc. (Read Website Taxonomy Guidelines and Tips.)
Navigation - The means by which one moves within a site and finds specific information, e.g., the site navigation menu. (Read Supporting Navigation and Wayfinding.)
Wayfinding - Related to navigation, wayfinding is how one knows where they are within a site and if they are able to find their way back to information to which they previously navigated.
Page Organization and Layout - The way content (text, images, video, etc.) is organized on a page. (Read What Do Common Web Layouts Contain? and see below.)
When planning your site, it is helpful to sketch out your information architecture in diagram form and draw wireframes to plan page organization and layout.
The following provides an example of an information architecture diagram for an exhibit on the history of cats. Looking at the diagram, you can get a sense of how the curator decided to organize the exhibit's content logically (which could have been done in a multitude of ways) and structure the site in which the exhibit lives accordingly.
The exhibit site has a hierarchy of only two levels: the Home page is the top level and the rest of the pages are the second level. The terms History, Breeds, Culture, and Readings are part of the site's taxonomy and will be the labels in the navigation menu that users click to find their way to the various pages.
Accessibility image description: The diagram shows the structure of the site, which is made up of ten different web pages. At the top (or the first level of the hierarchy) is the Home page, represented by a rectangle with the word home written on it. Below that is a row of terms that run left to right. They are History, Breed, Culture, and Readings. Lines make them look as if they are branching off of the Home page. (These terms will be the labels in the navigation menu.) Branching off of these terms and situated below them are rectangles that represent pages. These pages make up the second level in the site's hierarchy. Branching off of the term History are the pages Wild Ancestors and Domestication. Branching off of the term Breeds are the pages Short Hair, Medium Hair, and Long Hair. Branching off of the term Culture are the pages Cats in Art, Cats in Literature, and Cats in Animation. Branching off of the term Readings is the page Further Readings.
Wireframes are simple drawings of web pages that help with planning the organization of content and layouts. Below is an example of a wireframe for a page in the History of Cats exhibit. Here you can see that when one clicks on Culture, options for the pages for cats in art, literature, and animation appear.
Cats in Art is the page's main header (also known as header 1 or h1) and lets users know the page's title and the overarching topic. The other headers, Ancient Representations and Classical Cats, are second-level subheaders (also known as header 2 or h2). Each subheader introduces or frames the content to follow and is assumed to apply until a new header is used. If Ancient Representations, for example, had subsections like Ancient China and Ancient Greece those would be header 3 or h3. Notice the pattern forming? Like the structuring of sites, pages are also structured using a hierarchy.
Accessibility image description: The image shows a barebones black and white drawing of a web page. At the top is the exhibit's title, The History of Cats. Below that is the navigation menu, which has the options Home, History, Breeds, Culture, and Readings. As if someone is clicking on the term Culture, a dropdown menu appears just below the word and has the list of links Cats in Art, Cats in Literature, and Cats in Animation. The featured page is Cats in Art. Those words appear as the main header on the top left of the page just below the navigation menu and are in the largest font on the page. Below this header are large rectangles that function as placeholders for what will be three images in the future. On the right side of the page just below the navigation menu is the subheader Ancient Representations, which is in the second largest font on the page. Below this subheader, there are lines that abstractly represent a block of textual content that will be added later. Below that content is another subheader, Classical Cats, which is the same font size as the previous subheader, and below it are also lines that represent a block of textual content.
