Tag: information architecture

10 Steps That Will Improve The Structure of Your Website

10 Steps That Will Improve The Structure of Your Website

It is not enough to just create a website and have content on it. Its structure is another significant thing you have to take into account. It is the way that the various pages on your site link with each other. If your website has a well-designed structure, you will get better user experience, higher ranks on search engines, as well as better navigation. It is what will determine whether a visitor will want to explore deeper or abandon the page. Here are 10 steps that will improve the structure of your website and drive more traffic and conversions.

1. Understand your business

You might already think that you know all there is to know about your business. However, when consulting with your website designer to come up with a good structure for your business, you will have to identify some key elements of your business. For instance, the industry it is in, your competition, what you are offering, as well as how much you will be selling them. With this information, you will be able to determine what you need to do to make your website stand out from the rest.

2. Do some research on keywords

Now that you know what business you are in, your next step is to find out what keywords you will need to use to make your website easier to find on search engines. You will need to understand who your customers are, what they need, as well as what they want to achieve. Compile a list of phrases and words they can use to find your site. You will need to update your keywords regularly to ensure that your content remains relevant.

3. Conduct a competition analysis

Similar to keyword research, you will need to identify who your competitors are and what keywords they use to drive traffic to their site. Take the list of words you found and check which businesses are already ranking high on them. You can then include words that have low competition but can drive traffic to your site.

4. Determine the hierarchy of your content

Here is where the real website structuring begins. The human brain likes it when things are arranged logically and all pages balance with each other. Your site should have the main categories placed on top followed by their sub-categories. It will help with the creation of the pages’ URLs. However, do not create too many subcategories as it commonly happens in a health site and ensure that the numbers of subcategories are the same for all the main categories.

5. Menus should be visible

To make your website userfriendly, you will need to make it easy to navigate to different pages on the site. For this reason, the menu should be placed in a position where it is easy to locate. According to studies, 50% of users rely on the navigation menu to learn more about the site. Improve your visitor’s first impression by placing your menu front and center.

6. Improve the structure of your URLs

The URLs of the various pages on your site are usually displayed on search engines when people search for your content. Instead of using IDs such as letters or numbers that do not make sense to the visitor use words relating to the document. For instance, structure.com/about or structure.com/about/services.

7. Use HTML or CSS

Using HTML makes it easier for web crawlers to navigate your page. HTML is what provides the structure for websites while CSS is used to control the format, layout, and presentation of your site. If your navigation is not easy to access, web crawlers won’t find it and will result in a low rank.

8. Interlink your pages

Write many articles on those words you would like to rank for. You should then link these posts with each other. These links have three main benefits:

  • They make it easy for visitors to navigate the page
  • They establish a hierarchy of information in the site
  • Increased viewers for your sites’ pages

9. Boost Orphaned articles

These are the posts on your site that most of the others do not relate to. They are usually not easily found by visitors and search engines because they do not have many links from the other articles on the site. To identify them, sort all the articles on your site by the number of links. You can then increase the number of links to the articles to make them more visible.

10. Create your site map

A site map is a hierarchical list of all the pages in your site. It helps both the users and the search engine to navigate the site. Most search engines use the site map to learn about the new pages on your site.

Conclusion

If you do not define the structure of your website, then it will only be a website full of articles and content that do not make sense to the user. It will be difficult for search engines to find the most important information you want to pass across and hence the ranking will below. Improve the structure of your website using the above 10 steps and you will make it not only userfriendly but also SEO friendly.

Author – Dylan Menders

Read more

The Results of Information Architecture Audits

The Results of Information Architecture Audits

When a site clearly and intuitively conveys its story or service across and compels you to take action, it showcases sound information architecture underneath its user-facing interface.

Information architecture is the structural mapping of all the usable information in a site that encases all content in a logical order and connection, which seamlessly pushes its goals to the user’s needs. The lack or absence of sound information architecture results in bad user experience, high bounce rates and lower click throughs. This is why IA auditing is a crucial task in developing sites.

IA auditing can pinpoint underlying problems in user interface, user experience, navigation systems, and even SEO rankings. This article delves into the results and possible impacts of an information architecture audit.

Heart of the UX

IA is the central thread that weaves into the UX. Problematic or unintuitive UX designs often come up in IA audit as the lack in logical structural systems in place to store and easily retrieve data. Discoverability and autocomplete actions are the most common UX pitfalls. Integrating both company and user goals communicated in good UX is a key hallmark of a great IA.

Hackernoon notes that the growing complexity of front end development tools results in the preclusion of lower skilled developers. In what it calls ‘back-endification’ of front-end development, competition becomes more complicated and competitive edges becomes granular.  Maryville University highlights how the software development industry is expected to grow exponentially up until 2024, at which point experts predict that there will be 1.1 million computing-related jobs available. This is just one of the many implications of faulty IA and lax auditing from beginner UX designers.

Navigation design

IA audits also lays bare problems in navigation design. Navigation design and architecture must cater to the simplest and most encompassing way content within the IA can be presented to the user. A common mistake is choosing a navigation design disjunct to the site’s content.

Smashing Magazine suggests that great navigation design considers what users look for in your site. How it’s presented though should depend on the depth of indexing and categorization used in the site’s IA.

A rigorous IA audit can segregate crucial categories – core content – and optional categories within a site. This helps in increasing ease in navigation for your core audiences while affording other niche users with good UX.

IA first, everything else comes after

This is why when approaching a design or redesigning a site, it always pays to look under the hood first. A thorough IA audit can give you a concrete idea on the complexity of the site’s content. An efficient and thoughtful IA can lead to better UX, interface, navigation, and user retention design.

The FlowMapp x Figma bundle helps you build a great UI and navigation design by letting you create detailed site maps corresponding to the content and goal of your site. As site competition becomes granular, the key challenge in 2019 is cutting off garbage and focusing on your main priorities.

 

Alyssa_Ambers

Written by: Alyssa Ambers

Read more

UX research in MVP building

Main

This article will tell you a true story about a startup led by a small team of enthusiasts.

Bandlink is a service that allows musicians to quickly and conveniently upload and organize information about their upcoming concerts and performances, release or create a full-fledged website, without attracting developers.

To date, Bandlink has already helped 10 thousand of musicians to share important information with their fans, which has provided us with almost 1.5 million visitors. Unfortunately, before creating Bandlink as it is now, we were destined to make the same mistakes other new teams made. And some teams are even making these mistakes right now. We want to share our story with all creators of digital products because this certainly is a useful experience.

How It All Began

How It All Began

The history of Bandlink begins with its creators’ sincere love for music and the desire to devote as much time to it as possible. It was decided to develop the product for those who shared our interests – people with hearts full of music, eager to follow their favorite artists. We chose a name for the service – “Bandtraq”, decided what features we want to see in it, conducted a survey of potential users and began the developing. From our point of view, Bandtraq was supposed to be a platform where all the information published by a musician was conveniently organized and categorized. The idea to provide information about upcoming concerts, new tweets, and releases in one place seemed beautiful to us.

Faill

Fail

We spent a lot of effort on development, and in our opinion we made a good product – Bandtraq worked perfectly, but, unfortunately, was not getting popular. The increase in amount of unique users and new registrations was very little. We conducted a number of promotional activities, but still did not receive the increase we were looking for. We found ourselves in a situation where we spent half a year developing a good-quality product that was interesting only to a very little group of people.

Our forces were running out, but we tried to realize the mistakes that were made. This realization allowed us to carry on developing a good and useful product.

The main problem was that after the decision to create Bandtraq, we did not pay enough attention to the practice of classical UX research. At the time of creating Bandtraq, we had only had a general idea of our target audience and its needs. Also, during the development period a competitive offer appeared on the market – it was basically duplicating our service functionality for free. This fact served as a basis for the subsequent problems associated with the Bandtraq monetization.

Looking back with the experience we already have, it is worth to mention that it is practically impossible to work with the target audience within the framework of the above-mentioned project (or other projects like this), even in the absence of competition. There are two main reasons for this:

  • Lack of product involvement (Bandtraq practically was a wall filled with information blocks, where users could only share or view the source material)
  • Lack of motivation to pay for a subscription (It was difficult to explain the benefits of our service to an ordinary user. ‘All this information can be found on the Internet for free – why would I pay?’)

After we analyzed the existing problems and looked at our product from the inside, we researched the market again and noticed something:

For 2018, the number of downloads of music releases from iTunes has decreased by 27%, and the sale of music albums on physical media has decreased by 41%. On the other hand, there was a growth in streaming services popularity. Today, streaming services occupy 75% of the music market, leaving only 25% to other ways of listening to music. Musicians regularly publish their releases at various platforms and services, such as Spotify and Apple Music. The number of streaming services is constantly growing, and this forces musicians to publish their work on as many services as possible. They understand that streaming services operate on a subscription system, and if a person has paid for a subscription on one service, he will not be able to listen to a song or an album until it appears on this service.

This makes musicians publish posts that have a really large amount of links to various streaming services. We have distinguished this ‘pain’ because of the analysis of our service. Studying this problem in more detail, we found several possible solutions. Bandtraq had led us to a market in which our technology and experience could successfully fit. Analyzing future competitors, we decided to develop a new product, using the previous technology stack as a base. We began with a UX research in order to test our hypothesis and evaluate the expediency of moving from B2C to B2B.

Interview

Interview

We have interviewed different musicians and other people that are connected with the music industry in one way or another. The purpose of the interviews was to test the hypothesis that was born during the period of our reflections on the work done. To skip ahead, our hypothesis was confirmed – almost every interviewee who had to publish releases complained about the inconvenience associated with social media publishing. We were also able to understand the problem deeper, as well as look at it from different angles.

«It is incredibly tedious to collect all the links to different websites. I tried to paste them into one post, so that people could find everything in one place, but it was rather difficult. It is possible on Facebook, but impossible on Instagram – there is a limitation to the amount of characters that can be put in an Instagram bio» Artyom, 22, cloud rap artist

interview photo

During the interviews, a lot of musicians have marked Instagram as their top-priority platform, because the audience here is very active. However, it is practically impossible to include links to all streaming services there due to the fact that links can be published only in a profile description, and there is a character limit.

empaty map

Empathy Map

The knowledge about future users of our service received during the interviews proved to be priceless. We used the obtained data to create the Empathy Map in order to distinguish and work out each ‘pain’ of our future Clients. The clustering of problems obtained from the interviews allowed us to form the following points of interest:

Readability (for listeners)

  • A lot of links (hard to find the right one),
  • Long URLs (the posts are hard to read),
  • No Instagram links (many people use Instagram as their only social network),
  • Too many ticket services for one event (difficult to choose the most appropriate offer).

Time (for musicians)

  • Time-consuming activities (a musician or a manager has to spend a lot of time to consolidate information),
  • No Instagram links (impossible to publish the right amount of links in a profile due to the character limit),
  • Confusion when publishing (while copying a link to the clipboard, the user may forget whether he had already copied a particular link or not – this is due to the large amount of links that need to be collected in one place),
  • Lots of platforms (publishing on a large number of platforms is necessary for a musician, because fans use different platforms to listen to music – it is important to make the releases available everywhere),
  • Impossible to maintain (publications with releases can not be organized into a unified system – this is a huge concern for managers),
  • A lot of concerts (no convenient way to create and edit information regarding upcoming tours),
  • Social networks publishing (posting the information in all the social networks takes a lot of time).

Personas

Personas

After seeing the ‘pains’ that our future users experience, we began to form the Personas of ideal Bandlink users. It was decided to conduct more ‘in-depth’ interviews with our key Personas – an Indie Artist and a Manager, at that time. Let us get acquainted!

Personas Mark

Mark. 18 years old. Indie artist

This is Mark, he lives in Moscow. As a child, he had been studying at a music school for some time, but he left it because he did not see any perspective in learning how to play classical instruments. Despite the lack of music education, Mark continues to study music and publishes rap releases regularly. He has a small fan base, but it is not enough to provide him with sufficient income at the moment. Therefore, Mark has to do a part-time job to be able to buy new music equipment and pay the university tuition. Mark needs the university because his parents do not agree that he is being serious about working in music industry and that he is ready to devote his life to it. Despite the difficulties, his fan base (though not so big yet) instills him with hope that he can get a lot more popular.

Goals

  • To get popular,
  • To prove to his loved ones that music is a serious occupation,
  • To be financially independent.

Pains

  • Lack of funds sufficient for comfortable living,
  • Slow fan base growth speed.

FlowMapp Personas Alexey

Alexey. 31 years old. Music manager

Alexey was born in St. Petersburg, but he currently lives and works in Moscow. He graduated from the university with a degree in law, but from the very beginning of his studies he could not imagine himself as a lawyer. Alexey is very passionate about music – he devoted a lot of his free time attending concerts of various bands that came to his city. Over time, Alexey’s musical taste became more demanding, however, concert organizers did not invite the musical groups that interested him to the city. After visiting a music festival in Europe, he had an idea to organize a concert of one of his favorite bands in his hometown. Alex took the first step to make music his profession. During his studies at the university, he successfully organized several concerts, earned some money and realized that he wants to continue doing this. The more concerts Alexey organized, the more he got acquainted with various musicians and music managers. Over time, work in the industry and new acquaintances provided him with the opportunity to supervise various musical groups. Alexey is fond of his work – he likes working with musicians and likes to be a part of an industry that inspires millions of people including himself.

Goals

  • To increase the popularity of supervised artists (to increase his income),
  • To have an opportunity to spend more time with his family and friends.

Pains

  • Lack of free time,
  • Inconvenient (spontaneous) working schedule.

Statement of work

Statement of work

By the time we ‘got acquainted’ with the ideal Personas of Bandlink, we began to understand how our product should look like. In order not to repeat the mistakes of Bandtraq, we decided not to develop the ideal version of our service right away, but to develop an MVP.

The minimum statement of work was as follows:

Bandlink on the outside – the page with all the links to a musician’s release. The page should load instantly, have a short link (to fit in Instagram bio) and a ‘Share’ button (to quickly copy the link to the clipboard or share it on social networks).

Bandlink on the inside – an intuitive dashboard that should allow a person that has no IT background to quickly create, edit and manage links. It is also necessary to make links to new releases appear on different platforms automatically, once the link to iTunes is made. This function should relieve the user from the pointless ‘copy-paste’ activities.

Information architecture development

Information architecture development

In conditions of limited development funds, we could not allow any extra expenses. We decided to fix the requirements before proceeding to the product prototyping. For this, we used FlowMapp.

logo

FlowMapp is a UX platform that helps to collect and organize product development requirements, and also allows you to manage a project throughout the whole process of development using an interactive sitemap.

Using FlowMapp, we have created two projects: Bandlink / Marketing and Bandlink / Dashboard.

Bandlink / Marketing includes all the pages, blog and other information pages of our service, which are designed to attract new users and to show the service documentation.

Bandlink / Dashboard is the service itself. It includes main functional features, dashboard and pages that allow to create new links. Using the dashboard, the user interacts with the product, researches how to solve that or another ‘pain’ of a particular Persona.

sitemap

Take a look at the screenshot – you can see how intuitively the hierarchical structure is presented. FlowMapp allowed us to design an information architecture and look at the project from another point of view. Detailed information architecture allowed the designer and developers to visually assess the scale of the development from the very beginning, leading to appropriate time requirements.

Using FlowMapp, you can add blocks of information, files, links and comments inside every sitemap card. We have used those functions in order to see the context. The statement of work was always in the cards description, every card had a comments section where we discussed various relevant topics, and we always kept the archives with the content in attachments. We have also successfully organized the navigation through the hierarchical structure of sitemap on FlowMapp, based on prototypes made in Figma. The thing is, when the designer started to create the design, he used Figma as a prototyping tool, but to keep other team members from spending time studying the frame layout logic in his project, he added Main Link to the current frame in FlowMapp, thereby providing quick access to the current frame for the whole team.

figma

After we finished the development of Bandlink’s navigation system, we have started to install labels on sitemap cards. This allowed us to quickly understand at what stage the development of a particular page was at.

Labels that were used during the course of development:

  • Done,
  • WIP,
  • Unique design,
  • Feedback required.

labels

It should also be noted that in the process of development the overall number of labels has increased, and labels became narrower:

  • Text required,
  • Pictures required.

We have used such labels on pages where only illustrations or text were required – everything else was finished.
FlowMapp allowed us to properly organize the workflow in which each participant could easily find the necessary information despite being in the office or at an outsource.

User Flow Development

User Flow Development

Let us return to a stage of Bandlink development where we had the first version of the information architecture ready. In order to think over the experience of interaction with our product for each Persona and to understand the principles of our service better, we started designing User Flow using FlowMapp.

User Flow are finished user scenarios that are built based on the data obtained through conducted UX researches.

Over the course of User Flow development, we highlighted both the entry points for our Personas and their experience in interacting with our product. For this reason, we have developed a lot of User Flows, grouping them with particular Personas. The examples of User Flow are displayed here.

User flow

The development of User Flow provided us with better understand of how our service works, and most importantly, made it clear for our users. The next stage was prototyping and release, but we will tell you about these stages in another article.

Conclusion

Looking back, it is important to mention that the time we spent on researches had already paid off in early stages of product development. There is also a classic example of “Before” and “After” – the improvements are clear. Failure of Bandtraq and then integration of preliminary UX studies, followed by Bandlink’s dynamic growth. Despite the fact that Bandlink provides us with good results, we continue to explore the needs of its target audience. First Personas of Bandlink allowed us to develop an adequate subscription plan for our service.

Throughout the course of product development, we are now able to understand our audience deeper and to work out their every ‘pain’. The number of our service’s Personas is also rising and the service is changing along with the needs of users.

Pricing

Of course, the process of development may be launched without using the above-mentioned frameworks like Persona. However, those useful tools greatly speed up and improve the process of development. This is also a good way to improve the teamwork – we have engaged programmers and designers to the process of Persona and User Flow development, which in turn helped them to better understand the product and needs of the audience and sped up the overall development process.

Read more