Ok…so now what?
In a previous blog focused on user experience, we mentioned the importance of determining user needs, in order to inform the design, structure and functionality of a website. If the UX research goes well—meaning you’ve asked the right questions to help achieve your goals—you should end up with an array of information and data that will allow you to design an optimal web experience. Many times, this abundance of information can be overwhelming and needs to be translated into ‘web design’ terms. You need to ask yourself, “What does this mean for the website?” This stage is called ‘information architecture,’ the art of organizing information and applying it to a design that supports usability and findability. There are three key areas covered in this stage, including: sitemap, brainstorm and content audit (with a little overlap).
Similar to a road map or the blueprints of a building, a sitemap is a visual outline of a website, including the homepage and all sub-pages. The creation of a sitemap is important because it provides a very high-level look at all of the site’s pages and how they connect. It interprets what the users’ ultimate goals are and structures the pages to cater to those needs in as few clicks as possible#
The first step in creating a sitemap is listing out all of the pages that you'll need to accomplish your UX goals and then turning that into a diagram. Having a visual representation will allow you to quickly spot gaps and awkward transitions within the site. Plus, visuals are generally easier to digest than blocks of text when it comes to conceptualizing. Laying out all of your pages in advance also ensures that you've considered every piece of content before actually putting in the production work.
Additionally, your UX research should establish personas, meaning the target users who are intended to visit your site. Knowing your personas ahead of time is essential when structuring a website, as it indicates how much education a user may need in order to be converted into a customer. For example, while one person may already be brand loyal and ready to fill their shopping cart, another might need some convincing before being shown a product. ]This plays a major role in planning navigation and structuring your sitemap.
While developing a sitemap, you should go through each page and formulate ideas for the specific sections. Creating a “verbal wireframe," commonly referred to as the brainstorm phase, helps build ideas and directs the design.
At this stage, you should lay out all of your content ideas. Think about anything your website could possibly need and hash it out—you'll have time to refine later. What’s important is that you capture all of your thoughts and organize them in terms of what makes sense for the UX. You want to identify:
- The major categories that your website will have
- Subcategories for each major category
- Which pages fit into which subcategories
- How to create efficient, user-friendly navigation
One of the most important questions you have to answer when structuring a website is what value you’re adding to your business. Moreover, your content, layout and navigation should keep all of your business goals on track and generate, convert and retain users.
Great design and UX is only as good as the content. While refreshing an existing site, a thorough analysis of all the pages should be conducted to decide what content needs to be updated and what needs to be replaced; determine which links work and what videos are outdated. Consider it a spring cleaning of sorts!
If the website is being created from scratch, it’s up to you to determine the kind of copy, photography, and graphics suitable for the UX. Whenever possible, it’s preferred to design wireframes and later prototypes with actual copy. Additionally, if there’s custom artwork to be made or a photoshoot to be planned, the sooner this can get going the better. The reason being is that if a wireframe lacks actual content, a lot is left to the imagination/interpretation of the client, which is where things can get complicated. Therefore, in order to facilitate an efficient design process, you want to obtain as much content from the client as quickly as possible.
Once the sitemap has been laid out, the ideas for each section are refined and the content audit is cataloged, you’re in great shape to connect with the client. You’ll have the opportunity to present tangible solutions and visions, based on research and experience. This helps all stakeholders get on the same page and allows the client to get excited about the future of their site. With their sign of approval, you can move on to the next stage of web design—wireframing!