0

I am creating an online community platform where users can post blog-like items. I currently have made a design that displays recent posts, along with a sidebar where users can filter existing posts using categories and tags. Clicking on a posts' title will bring the user to the full article.

enter image description here

-

The idea is that when a user checks, for example, the tutorial category along with the Magento 2 tag, only posts with at least these types are displayed and all other items will be hidden, like this picture:

enter image description here

As you can see these categories and tags are also featured in the recent posts. Users can also click on these tags to filter the items on the platform accordingly.

In this case, would it usability-wise be a good idea to also include these tags on recent posts, or does it seem unnecessary and/or confusing should I stick with displaying categories and tags on the sidebar only?

Edit: As DasBeasto asked in the comments, the filtered posts are those that have at least the selected tags.

2
  • Does it filter to posts that have only those two tags, or at least those two tags? Lets say that post in your last image also had the tag Wordpress. If you hid those tags the user wouldn't know that it may be a Wordpress only solution.
    – DasBeasto
    Aug 30, 2017 at 13:03
  • It filters to posts that have at least those tags. I edited in the question, thank you.
    – Rubenxfd
    Aug 30, 2017 at 13:13

1 Answer 1

1

Do you have plans for anything other than desktop?

Since designers have little control over viewport size, that filter bar may be need to be either minimized, or become adaptive to perhaps a horizontal filter bar. In either case, the filter takes up less (or no) space.

Even in a full screen view it's hard to keep track of the filtered state.

By keeping categories and tags visible in the scrolling article/tutorial teasers, users can still useful information. You can do this with some subtle design. Coloring the categories might be overload in this case because you have to interpret the colors as well.

As an example, here's how mashable puts a category in gray text above the article title:

enter image description here

Categories vs Tags

Right now, it appears you're treating Categories and tags as the same visually.

Categories are usually discreet and singular. In most editorial sites they represent a news section. An article can be in only one category, but it can have multiple tags associated with it. There are some sites that seem to mix the two without consequence, but they're often graphically depicted differently.

I see that you have a list view, but I assume there's a detail page for each of these items. Since you seem to have a site geared towards reading and learning (content), you'll often see on article detail pages a pattern of the category placed in a subtle way close to the article title. This saves the user time if he / she knows they're in the right place.

Tags are often clustered at the end of the article, where the reader can click and drill into related concepts.

4
  • Thank you for your answer! The platform will focus mostly on desktop users. Mobile devices have a lower priority and will be dealt with at a later stage. I agree that categories are different than tags, and initially had the idea of only displaying the category type like you showed in your image, and leave the tags at the bottom of the article. So, what I understand is that it would be better to only display a category type when scrolling trough the teasers and delete the allocated tags?
    – Rubenxfd
    Aug 30, 2017 at 14:20
  • You might try doing both, but maybe make the tags in the list page very subtle, underneath the summary text like you have already. It's one of those situations where some subtle visual design can make a big difference.
    – Mike M
    Aug 30, 2017 at 14:23
  • Thanks, just need to point out that this is a wireframe and not a visual design, so it might look ugly, but it is design to test the usability.
    – Rubenxfd
    Aug 30, 2017 at 14:26
  • Oh of course! I love balsamiq for exactly this fact. Otherwise teams get sucked into bikeshedding discussions. :)
    – Mike M
    Aug 30, 2017 at 14:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.