chrisdasie's posterous

Make the button bigger

Tue, 29 Nov 2011 03:45:00 PST

There is a lot of talk around the web about always have a responsive designfor any web project that you create. But one thing we never seem to talk about is how to actually design for this space. So people are doing an amazing job of this like Think Vitamin/Treehouse, Simon Collison to name a few. But what really makes these great and easy to navigate through.

Well it’s the spacing and size of buttons. So often we talk in desktop screens about hierarchy and whitespace around elements, but when we get into our responsive designs all of this can change. We navigate responsive designs differently. We’re using our big thick fingers to click on buttons and navigate information. So then why when we design for these smaller screens do we also make the buttons that much smaller.

You might say it’s because we are working in a screen size of 320px and other various sizes. But that just means that you need to review the strategy we’ve developed and user experiences we want to create. Yes you are in a 320px space but this just means that less is more. Don’t make your buttons smaller so that you have room for a thousand other things. Reduce the amount of content you have so that you can fit those buttons in there. If it’s a site with a significant amount of images then maybe you reduce it down to 3 or 4 than than 20. Small touches and quick evaluations of your strategies will go miles with how the user sorts through your content.

We need to start looking at making these buttons bigger. We need to take on new perspectives in regards to our hierarchies. Our user experience will greatly improve if we are just make navigation easy. We can still have our whitespace around elements. But we need to judge the sizing different. This might mean you add some extra padding around the button text or maybe you center the button in the screen rather than floating it right or left. Just make it easy for that user.

Like most I’ve fallen into this trap a few times. Thinking that if I make that button and bigger then I’ll lose the detail or elegance of my design. But in the end, designing that button to be a bit bigger always helped and created a better user experience. By doing this I was able to remove concern from my clients and myself that the user would click and get lost in content they didn’t actually care about. Sure the time spent on these new pages would be great from an analytics standpoint but would that user ever return knowing that they had such trouble navigating to the information they wanted. Probably not.

So I ask you to all consider this when creating your next responsive design to make buttons bigger for your user. You might think it’s the wrong way to go but your user will be forever grateful if they can navigate your content more easily.

chrisdasie's posterous

Make the button bigger

Jonas Downey joins 37signals as a UI designer

Mac morning to ya!

Lobster Becomes The New Comic Sans | Da Sie Designs

Excited to read my new copy of smashing book #2

Winter Scene

Newsletter Wireframe

LiamMather.com

Downtown - Courthouse

Give Me Process

Let the app design begin

Web Designers vs. Web Developers...but what if you're both?

All You Need To Know About Web Designers [Infographic]

Love/Hate

Ultimate Guide to Website Wireframing

Ultimate Guide to Website Wireframing

Why You Should Wireframe Your Web Designs

Wireframe vs. Mockup vs. Prototype

How to Create a Wireframe

What to Include in a Wireframe

Low-Fidelity vs. High-Fidelity Wireframes

Wireframing Techniques

The Wireframing Process

Tools for Wireframing

Pen and Paper

Web-Based Tools

Desktop and Hybrid Apps

HTML Wireframes

Wireframing Templates

Using Wireframes to Think Through a Design

Wireframes as a Project Deliverable

Polished vs. Sketchy

Wireframing Resources

Related Content

About the Author

Leave a Comment

Da Sie | Da Sie Designs | Web Font Awards

Typefaces used:

Da Sie Designs

TAXI : The Driver Speaks - Steve Jobs: Presentation Tactics for Ad Agencies

Steve Jobs on branding (an oldie but a goodie)

Is influence tools the new way to measure social media?

Difference - ReflectionOf.Me