Website Terminology Guide

This guide is meant to help you understand the terminology we’ll use throughout our website project process. Please don’t hesitate to reach out with any questions you may have. We’re happy to help!

Website Strategy/Recommendations

Overall website game plan to help the client achieve their goals and amplify their brand.

Digital Strategy/Recommendations

Overall digital game plan that assesses an organization’s current digital approach (i.e. social media, emails, blog, etc.) and makes recommendations to help them achieve their goals online.

Information Architecture (IA)

The underlying organizational structure of a website. At Mission Minded, we use this to mean both the organization of pages into hierarchical sections (shown using a sitemap) and an outline for the content on those pages, (in the form of wireframes or a prototype). We generally refer to this on our website kickoff as being similar to the blueprint of a house — at the end of this stage, we don’t know what the color of the house will be (that comes in web design) but we do know which rooms are bedrooms and where the kitchen will go.

• Site Map: The first step in organizing the website and providing the team and client with an understanding of the website’s navigational hierarchy. The site map is a visual representation of all pages on the site organized into categories or sections, showing the relationship of pages to one another inside that structure.
• Wireframe: The next step in organizing the website in greater detail. Wireframes outline the content that will live on the pages, but do not show the design of the site. Generally, when we refer to wireframes, we’re talking about a static document, not a clickable website. We might opt to use a wireframe for a website that needs to show a lot of custom content structures that would be difficult to mock up efficiently with a live prototype.
• Prototype: Similar to a wireframe, a prototype outlines the content on each page. When we refer to a live prototype, we are generally referring to a bare bones website that can be navigated via a browser to give a more robust idea of the experience of clicking through the site as it will be set up. We might opt to use a prototype instead of a wireframe if we know that building out the full site structure to click through will be essential to understanding the navigation, or when doing so will get us a head start in prepping for development.

User Experience (UX)

The interaction a user has on a website. The concepts here tap into the mindset of a user and their needs and motivations (i.e. how easy is it for a user to complete the desired tasks? Is it a smooth experience or confusing?).

User Interface (UI)

The way that the visual elements of a page come together and interact. The concepts here tap into how aesthetically pleasing (or unpleasing) the information is designed on the website (i.e. the color of buttons, how the sections of a page interact upon scroll).

Hosting

The server that connects a website to the internet, “hosting” a website’s files (i.e. typically we recommend WPEngine as the host for the websites Mission Minded develops)

Domain Name

The URL or name of a website (i.e. Mission Minded’s domain is mission-minded.com)

DNS (Domain Name Servers)

The internet’s equivalent of a phone book. Your site’s DNS settings are what point your domain (i.e. mission-minded.com) to your host’s server.

Homepage

The opening or main page of a website.

Secondary page

Inner pages of a website (i.e. About Us).

Header

The area at the top of a page that includes main navigation.

Navigation/Menu

Part of the header that includes links to the inner parts of a website. May include primary AND secondary navigation.

• Primary Navigation: The main, most prominent links to inner pages of the site (i.e. Get Involved).
• Secondary Navigation: Other links to help the user find certain pages of the site quickly. They’re important enough to be called out, but not important enough to be a part of the primary navigation (i.e. Portals, Search).

Slider/Carousel

A slideshow for applying design treatments to rotating content such as multi-item photo or news displays.

Tab

A form of navigation that allows a user to browse multiple panels within a single window. Tabs make it easier for users to toggle between several sets of information on a given page.

Accordion

A vertically stacked list of items that hides and reveals content on demand. It’s most helpful for organizing sections of lengthy content.

Sidebar

The area of the page that includes information you don’t want a user to miss, but that isn’t part of the main content of the page. It’s sometimes used to guide the user to take action or find more related content (i.e. blog posts, testimonials).

Footer

The area at the bottom of a web page. May include an organization’s contact information, links to internal pages of the site, social media icons, search, newsletter signups, etc. The footer of all websites we develop should mention “Design by Mission Minded” and link to our website.

Hyperlink

An element on a web page that links to either another portion of the page or to another page altogether. These are usually underlined or highlighted in some other way to indicate interactivity.

Link Style States

• Default state: The basis for all other states, typically an underline or other highlighting feature that marks the element as “clickable”.
• Hover state: The change in design or animation that happens when a user rolls their cursor over the element (i.e. a promotional element expanding to include more content or a button changing color).
• Active/Pressed state: Styling that indicates when the pointer is clicking down in the boundary of an element.
• Visited state: Styling that indicates a user’s personal history with elements on a page, shows what they’ve already clicked on.

Breadcrumb

A navigational element on a web page that shows the current page in the context of the site’s page hierarchy (i.e. About Us > Our Team).

Banner or Hero Area

A large banner image or video, prominently placed on a web page, generally in the front and center. The hero area on a homepage is often the first visual element a visitor encounters on the site and acts as the user’s first impression of the organization.

Call to Action (CTA)

A prompt or instruction to a user intended to incite an action from the user. It usually includes a headline, a short description and a button or link to direct users to the desired action.

Static Content

Content that remains constant across web pages. For example, the organization or school’s logo and navigation/menu remain constant across pages.

Dynamic Content

Content that changes according to user input or behavior. For example, social media feeds that pull into a web page changes and updates when a user pulls up the page.

Microsite

A “sub-site” with navigation and page structure/design separate from the organization’s primary site. A microsite is focused on a single campaign or topic. It may be as small as a single page, and may or may not be accessed by a separate URL from the organization’s primary site.