Increasing user engagement on company blog

Data Analysis –  Wireframing – Team Collaboration

As the Marketing Coordinator for a boutique web design agency, I led the digital marketing efforts to increase the reach of our thought leadership on technical topics to help with staff recruitment, visibility in market, and qualified lead generation.

In tangent with a project revamping the company’s online case study portfolio + crafting an inbound marketing strategy, I led the redesign of the company's blog, using wireframes to communicate my ideas to the design team and the company’s partners.

We had several blog posts that were well-optimized for SEO and consistently had high levels of traffic, but high bounce rates as well. Even though user intent was likely to get the information they needed and leave, I wanted to entice them to explore other relevant content or connect with us on social media to get updates on newly-published content.

Problem

Siloed content created a dead-end for inbound blog post traffic. Further, the blog landing page was a paginated feed without filters or personality.

Solution

My goal was to add features that would increase ease of navigation through the blog and to encourage users to explore content and connect with relevant topics. I began by drawing out my ideas on paper, then used Balsamiq Mockups to flesh out those ideas. I worked closely with a frontend developer to test updates and fine-tune features, most of which are still used on the company’s blog.


The Process

Data Analysis with Curiosity

While conducting an SEO audit, I noticed a handful of evergreen, technical blog posts consistently had very high levels of traffic. I wanted to take advantage of this inbound traffic and encourage users to explore more of our content – especially our guides and development posts. By showcasing our technical expertise and building trust, our blog was a tool for bolstering our capacity for client projects as well as an employee recruitment tool.

Wireframing

My approach with nearly all projects is to start laying down ideas with pencil and paper. It gives me an opportunity to focus on core functions and features, and initial instinct for a product.

My pottery mentor once told me: if you can draw it, you can do it. This was about envisioning a wheel-thrown form, but I’ve since applied the logic to digital product planning.

A sketch of a blog feed with a sidebar of content categories

Blog feed — landing page

I wanted to bring a personal element to the blog landing page by adding author photos to accompany each blog post.

I also added a sidebar with main category buckets to encourage browsing, and a search bar and archive search to help users find specific posts.


A sketch of a blog post with an author spotlight section

Blog post — detail page

On the blog post, I included a hero image and added an author spotlight at the bottom of the post. I wanted to reinforce the personality of my colleagues and feature them as experts, and encourage users to connect to more of their content.

Further, I added navigation within the body for the user to return to the main blog landing page or jump to a filtered feed of the topic they were currently reading (e.g. design).


Mockups

A mockup of a blog feed with a sidebar of content categories

Blog feed — landing page

We dropped the category icons and opted instead for text-based Categories filter with radio buttons to serve as focus indicators.


A mockuo of a blog post with an author spotlight section

Blog post — detail page

For the MVP, we retained much of the original look and feel of the original blog post, but introduced the sidebar features and a slim author spotlight.

Next Steps: Incorporating User Feedback & Iterating on Design

Before investing in building out new features, I conducted user testing to explore user intent and popularity of defined features.

Based on the features included in the initial mockup, some findings that influenced changes included:

  • One feature that was hardly touched was the archive feature to browse older published content. Instead, users filtered down by category and would scroll to explore older content in the results feed. We removed this feature.

  • One feature we had not thought, of but was mentioned by a few users, of was to include a “popular posts” list in the sidebar. We opted to include this over the “Recent [Category] Posts” feed since the category results page served the same purpose.

Team Collaboration

Early in the process, I engaged with our frontend developer about the project – this was early in my digital agency career, and I was still learning about usability and digital accessibility best practices, as well as our Drupal platform capabilities.

We collaborated to outline desired features for the MVP, and ideas for future iterations based on data. Additionally, incorporating user feedback helped us to make decisions before investing the developer’s time to build out the features.

Outcome

Paired with an inbound marketing strategy, the introduction of the new blog features correlated with desirable outcomes in our web traffic data:

  • Bounce rate decreased an average of 12% (top five posts before update compared to six months after update)

  • Time on page increased an average of 8 seconds on blog content (top 20 posts with highest pageviews each, average from six months of data post-update)

  • Increased pageviews on employee profile pages by 64% (from six months of data post-update)