Connect with us

General Web Design

Designing Websites With User Behaviors In Mind

Every website is really an interface created for certain goals. Whether those goals are connecting with friends(Facebook) or searching the Internet(Google) the site is designed with those behaviors in mind.

Designers who understand this concept create much better experiences. The focus turns to usability first with “pretty” things like icons, colors, and aesthetics second.

In this guide I’ll share tips for designing usable websites that help users perform whatever they wanna do. This process starts with a lot of thinking and contemplation before moving into Photoshop or any design software.

User Goals Define The Design

If you don’t know what users want to do, then how can you design anything useful?

Figure out what your website is for and what users can accomplish on it. This should be web design 101 because it’s so basic, yet many designers rarely consider this idea.

user page flows

KPIs or Key Performance Indicators are important because these define your goals. Is your website made to sell products? Increase subscribers? Or do you just want people on the site for longer?

There is no “right” KPI but you should have some goal for your users. Without KPIs or goals then you simply can’t track anything.

You can design sites intuitively based on assumed goals, but this isn’t really designing with the user in mind.

The best way to design is merging your goals with the user’s goals into one cohesive final product. Someone who doesn’t use Twitter may visit an account to look at their tweets. But Twitter incentivizes that person by opening a login/signup window automatically.

twitter login box

This works because the user’s goal is to browse a Twitter account, which they can do. And the website’s goal is to increase interactions and/or increase signups, both being more accessible by adding that login window.

Figure out what your users want and what you want. Then find a way to merge them into one happy medium.

Testing & Tracking

Gauge your ideas based on KPIs and increases(or decreases) in whatever you want to happen. You should always be testing new ideas to see if you can optimize any parts of your website.

This is best done through A/B split testing which can be setup for free through Google Analytics. Think about what you want to happen and how you can make that happen.

time.com homepage

Consider this study of Time.com which dropped their bounce rate by 15% just by adding infinite scroll. This small addition to the user experience radically improved the number of people that stuck around to read content.

When working to improve certain metrics try to avoid numbers and quantitative ideas. Instead think about the user experience because this is really how design should be done. Consider what the user would think & feel using your site.

How could you improve that experience to meet your goals? Or what could you do that’ll help users accomplish their goals faster?

Some things can be as direct as the color of links on your site. Just changing colors can have a surprising effect on CTR, signups, or actions taken by a user.

Something similar happened with this Instagram case study where they increased the size of CTA buttons to see a 45% increase in click throughs. That’s huge!

But there is no single answer for everything. Each scenario is different so you need to test and find what works.

Make Halftime Changes

I like the way Gary Vaynerchuk approaches the willingness to adjust and change at the drop of a hat. He explains it like making quick halftime adjustments and being willing to, in writing terms, kill your darlings in pursuit of something better.

If you’re testing something that clearly isn’t working then don’t waste more time on it. Same with a new feature that users are complaining about. You need to know when to call it quits. And you should never get attached to anything.

Your userbase is what matters the most. Your personal feelings should not play a huge role in tracking what works. Be willing to change your feelings, strategies, and ideas based on new evidence. This is the cornerstone of great UX design and it’ll keep you on your toes at all times.

google logo

Why do you think Google’s layout has basically looked the same for almost two decades? Because it’s familiar.

People like familiarity, but they also want familiarity that works.

Facebook’s design has changed a lot since its inception. But realistically these changes are minor compared to the big picture.

The Facebook interface has seen many alterations—but the experience is still basically the same.

old facebook design circa 2011

I recently found this great article explaining how users are okay with interfaces that change, but only if those changes directly benefit the user.

People are generally against change. But the web is always changing, people know this. You can always make changes as long as they’re intuitive and add value to the interface.

Try to make changes for the user’s benefit and be willing to make them at any time. Never get too attached to any idea and be willing to change if needed.

The Holistic Approach

Every site you create should have smaller usable pieces and a larger composition. This larger composition is made up of all the smaller parts, and it’s the best holistic approach to design you can take.

Think about each website in “the big picture” to consider how it’s perceived by each visitor. Does the overall homepage appear friendly and easy to use? Is it obvious what to do once you land on the homepage? Would the average user know how to navigate?

A recent study proved that over 75% of a website’s trustworthiness & credibility is determined by the aesthetic. This means the composition and overall design quality both play a big factor in how people perceive a website.

new york times

Sometimes the brand can take over like with the New York Times which has its authority on its years of service to journalism.

However most people need to rely on authoritative designs that work well and serve a purpose.

Unfortunately many designers look at the big picture and still fall short. This has led to a mockery of Dribbble where many designers create useless interfaces, but get comments on how great their design looks. This leads to a design community that values aesthetics over practicality.

You have to consider more than just the appearance. Consider how the site works, if it responds quickly to user input, and if content is easy to understand. Does the site have an easy search feature? Do the dropdown menus load quickly & are they easy to use?

Also consider page load times because these have a big impact on how long users stay or if they ever come back.

A holistic approach to design considers more than what you can see. It’s also about what you experience by using the website.

ux testing

The best way to learn is to browse other sites and take notes.

Think about how you feel when the page first loads. Do you trust the website? Why or why not? What makes it seem authoritative(or sleazy) and how could you work that into your own designs?

If you can see the bigger picture and the smaller pieces then you’ll have an easier time understanding user psychology and planning for certain behaviors.

Wrapping Up

The process of user-centered design is actually very simple. You just need to be mindful of the user experience at every stage of the design process.

But getting into this kind of workflow is surprisingly difficult. It’s easy to slip away into self-focused ideas and start designing stuff you like without considering the overall experience.

I hope this guide can shed some light on how you can create interfaces with user behaviors in mind. This won’t come naturally at first but the more you design interfaces from scratch the more opportunities you’ll have to practice UI design with users in mind.

Jake is a freelance writer, designer, and illustrator. He currently writes articles on user experience design for web & mobile. You can see more work on his portfolio site and follow his tweets @jakerocheleau.

Click to comment

More in General Web Design

To Top