For most of us in the digital world, it is no longer shocking to hear that a huge percentage of people access the web on their mobile (now 64%) and a hefty percent of users have limited access to a desktop computer (currently 15%), but there is still a raging debate amongst designers about the best way to design websites: mobile first or desktop first?
So, which is it? Should people design for mobile or desktop first?
This may sound like I’m “sitting on the fence,” but I simply don’t believe in one over the other. Set up your workspace with three crucial break points, then block your content types out across all three.
Designing for mobile first stops a lot of creatives from thinking bigger. Designing desktop first leaves the mobile experience feeling unloved.
Most mobile first advocates preach an all-or-nothing approach, but that’s not realistic. Designing across the spectrum, iteratively, is sure to lead to better results.
What are the benefits for designing for desktop first?
Most designers can think wider, more conceptually, on a larger canvas. You can think immersive, full screen experience without considering the limitations. However it’s harder to rationalise your style guide, e.g. typography relationships.
What are the benefits of design for mobile first?
Designing from the smallest size first is easier, as you start with the truly essential. It also means that hardest screen size is catered for at the beginning and you can add additional functionality / content as you go on to work with larger formats.
One of the biggest advantages with mobile first is that you're approaching the design from a what's really crucial, content-first perspective. If you're questioning its validity when it comes to mobile, you've got to ask yourself how necessary it really is in the grand scheme of things. More of an IA benefit, I guess.
Do you find designing for mobile too limiting?
No. To me it feels like a better connection with the end user. Mobile brings information to people wherever they are, whenever they need it. It feels more valuable. Touch feels like a more instinctive interaction than sitting at your desk driving with a mouse. Gestures give the users more control: being able to swipe, tap, pinch allows the content to be explored in many exciting ways.
On top of that there’s more opportunity to layer your designs; off canvas information and menus seem to make a purer experience. The desktop can be rather overwhelming with information and choice, whereas mobile seems more considered and pure.
Designers have always had constraints. In print it might have been dimensions, printing process, cost, etc. The web is no different, but instead the constraints are a fluid canvas, variable connections, and cost in terms of performance and user experience.
Know each medium's constraints and use them to your advantage.
Do you think how people use mobile vs. desktop should be taken into account in the design process?
Both should equally be highly functional, but I would agree that there’s more opportunity on desktop to create. However it’s not black and white. If the purpose of the platform is to serve up information, then there is no need for anything but beautifully delivered, quick content. If you are trying to sell a product, there is more room to take the user on a journey, as long as it doesn’t hinder the purchase.
Do you find ‘graceful degradation’ is still a discussion point?
It’s still something we factor in. We tend to start from best-case scenario and work down. However with browsers slowly getting better and quicker connection speeds it’s become less of a concern. For a lot of people, the conversation around graceful degradation has moved to a concept of progressive enhancement. It's a glass-half full way of building from the foundations and enhancing when features are available to you. It means you're not leaving anyone out in the cold by not considering a fallback for an edge-case degradation.
How to do future proof your designs?
You don’t. Simply use your experience and knowledge of what works. Keep up-to-date with new techniques, but be aware of simply jumping on trends.
Sticking to simple design principles; colour partnerships, typographic hierarchy, clean grids, and signposting are the essentials that will keep your site from being out of date before it’s even launched.
Remember, when a site goes live, that’s when it’s born. That’s the starting point. The revisions, testing, evolving are the only way to make your website stand the test of time. Find out whats not working and change it. Stress test your designs as much as possible as you design. Ensure that when the clients get ahold of the CMS or the business expands into Germany (much longer character counts), everything holds together.
Please leave us any thoughts you have on designing for mobile or desktop in the comments.