# Site Organization ### Major Concepts 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](https://www.usability.gov/what-and-why/information-architecture.html) 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](https://martech.org/website-taxonomy-guidelines-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](https://accessibility.huit.harvard.edu/support-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?](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/Common_web_layouts) and see below.) ### Planning Your Organization 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. #### Information Architecture 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. ![](https://4055173823-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LgXtIWpHMikxGQHLU5T%2Fuploads%2FyoAJOLOTIRXXCtw0rAEn%2Fia_cats.jpeg?alt=media\&token=c9275331-b383-4a30-8cb7-7dbaf15d08c0) **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 C*ulture* are the pages *Cats in Art*, *Cats in Literature*, and *Cats in Animation.* Branching off of the term *Readings* is the page *Further Readings*. #### Page Organization and Layout [Wireframes](https://www.usability.gov/how-to-and-tools/methods/wireframing.html) 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. ![](https://4055173823-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LgXtIWpHMikxGQHLU5T%2Fuploads%2FZ9lWcMzm3t6IogBIfSR4%2Fpage-cats.jpg?alt=media\&token=1cd6fed0-f5dd-4766-9c24-99c0bada9ca4) **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. --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://bcds.gitbook.io/learn/tutorials/digital-exhibits/getting-started-with-digital-exhibits/basic-steps/site-organization.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.