back to top


UX Principals for Better Content

We’ve all been creators of content at some point of our lives: our first diary, school essays, text messages, work emails, and social posts. In the same vein, we’ve all been consumers of content too: news articles, textbooks, school reading assignments, fiction, website content, comic books, movies we watch…etc etc.

If you are reading this Medium post by me now, you’re consuming content I created for you. Content is permeate every aspect of our lives because our need to communicate is paramount. Jeffery Zeldman famously said:

Do you like this zen theme? I created it using Visme’s templates. Pretty amazing collection of social media graphic templates here


Indeed, content is at the heart of design. Without content, design will have no meaning. This recent post on Signal vs Noise is a brute reminder that our favourite apps without words would be void of meaning and funtion to us: just look at what happens when you strip away all the words on your most used apps.

What Basecapm would look like without words. Image courtesy: Mig Reyes

So how do we make sure that the content you put out on your product or website provides value to users? To produce value-driven, user-friendly content, there is a lot we can borrow from user-centric design principals. Let me lay down the most important ones here.

1. Know your audience

The 5Ws in user research apply to content strategy as well. Know who your audience are, where they are located, what is the context they are consuming your content in, why they are reading your content, how are they reading your content. A great way to sum up these insights is a Persona.

A robust persona details your users goals, motivations and frustrations. It serves to inform your content strategy. Here we are talking about Persona for UX content, which could slightly differ from Persona for Marketing. Both would include facts like age, gender, location, profession etc, however Persona for content would also stress UX-centric information such as their habits and preference. Do they normally watch short videos on mobile, or long form content on desktop? Do they like a humorous voice, or a serious tone?

Another great tool to delve deeper into your content persona is the empathy map. Empathy maps are like an extension of Persona. It helps you to connect with your users thought various sensory experiences such as what they see, what they hear, how they think and feel, and how they articluate how they feel. With the empathy map, you will experience your target users not just as an “consumer” but a living, breathing human.

An empathy maps details what a user would see, hear, think and feel. Image source:

2. Empathize with your audience with content

This is easier said than done. Most brands see their product or website as a platform to broadcast their own brand voice. Wouldn’t it be a waste of my digital real estate if I don’t talk about how great my product or services are on my very own website?

User centric content is a delicate balancing act between what the brand offers and what the users need. Most users come to your site or product with an intent in mind: it could be that they are seeking out a new solution, to compare a competitor solution with yours, or simply checking out whether they can afford your solutions.

If your content does not match their intent, they will abandon your site even if it’s beautifully designed with the most well-crafted copy. Advertising can only get you so far to keep a customer. What your content need to convey is the following message:

a) you have correctly interpreted their intent

b) you fully understand their problem

c) you have the expertise to confidently solve their problem

Trust is earned through putting your users first and providing value without asking for anything in return. A few simple tips to keep in mind when you craft your website copy:

  1. Speak to your customer’s with what benefits them, instead of speaking at them with what your product offers
  2. Use easy-to-understand, plain language. Avoid industry jargons.
  3. Deliver knowledge that helps your users solve problems.

In my humble opinion Survey Money does a great job at this. Their homepage content puts users first: what they can action to get their desired outcome. Plus, plenty of value-added tips to help them get started.

Survey Money does a great job at crafting emphatic web content


3. Design your content to be accessible to all user groups

Consider what one would need to do to make a shopping app accessible to shoppers of all backgrounds. If your content hierachy is communicated through different colours, would a color blind person be able to see it? If your text font is rather small, would an elderly be able to read the fine print? If someone is holding on to a bus rail while browsing in the app, would they be able to place an order with one hand only?

In a perfect world, you audience might be well-educate, young and healthy, physically capable people who are self-sufficient and have no limitations. However in the real world, people have all kinds of limitations. These limitations could be intellectual, cultural, physical, or social-economical.

If you understand who your target group is, you should also take the extra mile to discover what their limitations are. Make sure your content meet the needs of all people, especially those with special needs.

A great example of accessible web design is Not only does the site has very clear visual hierarchy, elegant simplicity in design and copy, lots of white space, minimalist palette with high contrast colours, the site is also completely controllable by keyboard. Users can execute command by pressing enter. sets the accessibility bar for web content.

A leader in accessible designs, Apple has detailed their approach to accessiblity in various Apple products: from designing fitness apps for those on the wheelchair, to using VoiceOver to descibe what’s on screen so that even a blind person can take photos with iPhone. Check out Apple’s accessibility principals here.

[Originally published on UX Planet][/vc_column_text][/vc_column][/vc_row]