Basics of Web Authoring and Design

{Elements of User Experience: Hypertext System}

Web as Hypertext System

Surface

Visual Design: The look of the finished product.

The surface plane is the final step of building a website. Surface plane is concerned with sensory design and the presentation of elements in the skeleton plane. In this plane, you will use the various visual design theories to create a website that is visually appealing to your audience.

Skeleton

Navigation Design: The set of screen elements that allow the user to move through the information architecture.

Navigation design is concerned with users' abilities to go different places on the site. Website navigation is used to provide a way for users to get from one page to another, undersstand the relationship between different pages, and understand where the current page falls within the larger website.

There are five different common navigation systems: global, local, supplementary, contextual, and courtesy navigation. Other ways of creating navigation is in tools such as site maps and indexes.

Information Design: The presentation of information in a way that facilitates understanding in your audience.

Information design is centered around communicating information and ideas to the user. Information design involves aspects of grouping and arranging pieces of information, deciding how to present visual information, or navigation throughout the page.

Navigation design and information design come together to inform the page layout.

Structure

Information Architecture: The arrangement of content elements within the information space.

Information architecture is the organizational scheme users utilize to navigate the website. Organizational schemes can be formed using either a bottom-up or top-down approach.

In the bottom-up organizational approach, designers begin with the connent and functional requirements, grouping them into higher-level catergories.

In the top-down organizational approach, designers begin with user needs and product objectives, breaking up functionalit or content into subcategories.

Information architectures can be represented by different kinds of architectural structures: hierarchal, matric, organic, or sequential. In each architectural structure of your website, information should be arranged according to some principle, which will be defined by your audience and purpose. You should have consistent vocabulary throughout your website.

The website structure can be illustrated using an architecture diagram. The system of creating these diagrams is called "Visual Vocabulary."

Scope

Content Requirements: A description of the various content elements that will be required within your website.

Content requirements describe what information or content should be containedd within the website. The requirements cover images, audio, video, and text.

Strategy

The strategy plane is the fundamental building block of your website. This plane is concerned with the questions of what does the user want or need to get out of the website and what do you, as a designer, want to get out of the website.

User Needs: The goals for the site that come from our users.

Users have their own reasons for coming to the website and since they are our audience, it is important that we take their thoughts and desires into consideration.

Garrett recommends different strategies for addressing user needs:

Segmenting Users
- This is when you divide users into subgroups based on their shared characteristics. Some subgroups to use are age, gender, education level, experience with technology, etc.
Creating Personas
- This is when you create one or more fictional users, complete with their name, picture, and background details. This helps you get an idea of who you are targeting with your page and what common features they share.
Conducting User Research
- This is when yhou learn about users through conducting surveys, focus groups, interviews, task analysis, contextual inquiry, or user testing. More than one of these methods of conducting user research can be used. The more you use, the better understanding of your audience and their needs.

Site Objectives: The goals and objectives for our site

Just as users have their reasons and needs from your website, you also have your own objectives and goals in mind. These site objectives come from combining your original exigence for creating the site with the user's needs.

Garrett recommends different strategies for determining site objectives:

Identify Business Goals
- This is where you articulate the purpose(s) of your website.
Consider Brand Unity
- This is ensuring that the website is consistent with your visual brand and the individual message you are trying to communicate.
Set Success Metrics
- This is establishing benchmarks (or a timeline) for meeting user needs and site objectives.

User needs and product objectives can be described within a formal strategy document.