How Function Focused Design Could Change the Way Websites Are Built

If you’re in business today, you’ve probably heard the phrase “mobile first” design. While the numbers support mobile friendly design (87% of those online are using their smartphones to access information) whether or not you should be utilizing mobile first, designing for desktop, or focusing on function is up for debate.

In this blog post we’ll discuss how web design has changed with mobile and why we believe progressive enhancement and a function focused approach is the strongest choice for design.

What is Mobile First Design?

While mobile first design sounds good, understanding what it really means is essential for your process. When you’re creating a new website, pitching a client, or just perusing options for improving your site and brand you’ll want to know the plusses and minuses.

Mobile First vs. Responsive Design

First things first: mobile first and responsive design are separate processes. Responsive design simply resizes, scales, and changes the master design and content based on the size of the screen you are on. From reducing features like Flash to removing extraneous content from the display it means you experience a portion of the desktop-oriented website.

Mobile first, however, turns this common strategy around. It starts with mobile in mind, and then adds features to improve user experience and keep the site fast. It also ensures the content reaching your users is as simple and beautiful as possible for their platform. Taking this a step further and thinking about the function and mindset of your user lets you design less for devices and more for intended usage.

Progressive Enhancement vs. Graceful Degradation

Another comparison for this is progressive enhancement vs. graceful degradation. While making your website responsive or adaptive makes it viewable on mobile, it doesn’t offer the same level of experience.

With progressive enhancement, your mobile user gets a product that looks great and functions well while working under the constraints of mobile. The next step of the workflow allows you to enhance and improve your offering with more robust features and content instead of constantly working in a scaling down mindset.

Which Way Should I Do It?

In most cases, progressive enhancement feels like the most intuitive process and generally produces better experiences for the user. While exceptions can be made if most of your users visit your site on desktop, make sure to consider if the reason that’s the case is because of a poor mobile experience. Cross checking engagement, bounce rate, and more will help you get a full picture how users are interacting with your site. This kind of function-focused design will help your site provide the best experience to your users, whenever and wherever they access it.

Want to know how to do it yourself? We recommend Ben Gremellion’s piece which explains the process beautifully in a hands-on guide. One of the key elements of mobile first and progressive enhancement? The sites are faster.

Why Should I Care About Site Speed?

53% of mobile visitors will abandon a site if it takes more than 3 seconds to load. So not only does designing for mobile create a better user experience. Beyond user experience and engagement metrics, having a faster and more usable site can help you make more money. With 35% of e-commerce sales being on mobile, you could be losing over a third of the pie when you fail to optimize for mobile platforms.

It also improves ad viewability by 25%, 70% longer average sessions, and a 35% lower bounce rate. Those are the kind of improvements that move the needle.

What Are the Drawbacks of Mobile First?

For most people, the main drawback is that it’s hard. Fitting everything you need into a small space with limited capabilities isn’t as fun as building a desktop experience, and designers may balk at the task. However, we strongly feel (like others) that it’s worth the effort, especially long term.

The Future of Mobile First

With Google’s mobile first indexing and mobile usage up, we don’t think this strategy is going anywhere soon. Increasingly people use their smartphones for information searches, shopping, and general browsing. While increasing use of mobile devices is pushing us towards this outlook, designing for different screens and experiences may be the next step.

Asking yourself simple usability questions can illuminate design dilemmas. Getting into the mind of the user may help designers and developers alike create sites that feel more human than mechanical. Personalization and intuitive design will change the way we work online. For more on primary and secondary screen access, and how to focus more on function over device with this piece from Paul Adams of Intercom.

From doing a full UX analysis to consulting on website optimizations, we can help you take your business to the next level. Reach out to us here at Mad Fish Digital. We’re happy to lend a hand.