During one of our recent UX consultations — as is often the case — we hosted members of a UW department who needed some help navigating the early stages of a full-site redesign. The current site, everyone agreed was confusing and not helpful in allowing users to quickly find the information they were looking for. However, how in the world do they actually “fix” this?
As we realized that the challenges that this team was facing come up again and again with groups looking to redesign a current website, or even if they are starting from scratch, we’ve decided to post a generalized and anonymized version of the notes from this consultation on the blog. Keep in mind that this isn’t an exhaustive list…just a quick listing of some considerations that often go overlooked.
- Feeling overwhelmed with the numerous audiences that the website is trying to support.
- Unsure how to connect target audience groups with the interactions and information they need.
- Many questionable elements on the page have been added or suggested by some other committee or stakeholder.
- Terminology, placement of elements, and differentiation of navigation menus (this particular group had several navigation menus) seem problematic, but not sure how to find the “right” terminology, element placement and navigation structure.
Audiences and Goals
- Define your audiences: Who is using the site? Prioritize the audiences by your vision of what purpose the site serves. Try to create primary and secondary audiences. Audiences that don’t fit those classifications should likely be ignored to preserve clarity of purpose.
- Audience goals vs. business goals/needs: Don’t conflate them. Create separate lists for each audience you have defined AND a separate list of business goals. Go ahead and make assumptions and then validate as necessary.
- Business Goals: Why are you creating this site? What information do you want your audiences to give you and what information do you want audiences to take away from your site? Stakeholders can help define business goals.
- Audience Goals: Each of your defined primary and secondary audiences will have multiple goals when visiting your site. Representatives from your audiences can help define/validate audience goals.
- Consolidate Audiences: Look for similarities in different audiences’ goals as a way to merge audience groups. The benefit to consolidating audiences (when possible) is that there are fewer people you need to keep in mind as you move through the redesign.
IA and Navigation
- Create workflows backwards from audience goals: Start with what audiences hope to accomplish and lay out the tasks that they need to complete in order to accomplish the goals.
- Pair information to the audience tasks: What information does an audience need in order to accomplish the task?
- Navigation primarily serves people who navigate and peruse the site. Plan the information hierarchy around people who are using the site, not people who just need to get to one or two pages. Those pages will find a place in the hierarchy and shouldn’t dictate the hierarchy.
- Having audiences self-select by “identity” is often problematic: While there are exceptions, your audiences are thinking about tasks (“I need to register for classes”) rather than self-identity (“I’m a new student”). Think about action-oriented navigation to help people move forward. The Washington DOL site has some good examples of task-based navigation.
- Consider contextualizing information for your audiences. We’re not saying to never have audience-based landing pages that contextualize the information. If an audience has truly different needs, then it can be useful to compartmentalize that context for them.
- Navigation doesn’t always start at the home page. Don’t forget about people landing in the middle of your site via Google. If the navigation changes dramatically from the top level pages to the deeper pages, the folks landing on the deeper pages from Google are going to feel a little lost.
- Consider global actions. Some goals rely on immediate action or risk losing the audience. If a business need is to bring in funding (or to facilitate collaboration, or whatever), have a call to action button for that on all pages.
Narrative of the Experience (for visual and non-visual usage)
- Consider the narrative of experience. What is the narrative that you are building to support users in navigating your site to reach their goals? How is this reflected in the pageflow? The visual design? The code?
- Think about the goals of each page and how these fit into the end goals for users. The home page likely has the goal of getting each audience started on their primary goals.
- Consider the semantic structure of your site/pages. How do you organize your code to tell the story that you are telling? What is the heading structure for each page? What is the semantic way to build your page elements? You might need to build things non-semantically, but then you can build the narrative in other ways, such as using ARIA (Accessible Rich Internet Applications).
- Think of Accessibility as simply an alternate presentation of site narrative. Get accessibility experts to test your site not only for basic accessibility, but for the presentation of a clear narrative. For those on the UW campus, see the Accessible Technology Lab.
- Focus on Simplicity. Design to the minimum necessary to help an audience accomplish their goals. Minimum what? EVERYTHING: text, functionality, navigation, levels of hierarchy, etc. It is far easier to find what needs to be added to a simple design than to find what specifically needs to be taken out of an overly-complex design.
- Mobile first is both Design AND code. The mobile-first approach doesn’t stop at the UI design, it should continue to the code and helps you focus on the minimum code footprint that you can leave for mobile to take care of known audience needs. So, not just simplicity in the UI, but translating it to simplicity in the codebase.
- Iterate and test. If trying to decide if something (content, functionality, etc.) is NECESSARY, just leave it out and get user reactions; this will speed up your process and it’s easy to add content back in if needed.
- Users will scan your content. Help them. Use headers and sub-headers in the content. Break up text into small sections that are clearly labeled. Think about users taking a quick scan of your page to determine where they will focus. If they don’t see immediate indication that there is relevant content, you will likely lose them.
- Scrolling isn’t something to avoid by rule. People aren’t afraid to scroll if the content is relevant and easily scannable.