Design with Mobile in Mind
My favorite web courses to take in art school were those focused on mobile design and development. It felt odd to design a mockup that focused heavily on mobile-first rather than desktop. In these courses, I learned about the importance of user experience and responsiveness. During my time at school, mobile web surfing was increasing with no end in sight. Since mobile users are a massive audience for the web it only makes sense that designers make it a priority.
What is a Mobile-First Design?
Mobile-first design is sketching, prototyping, and designing for the smallest screen first (most likely a phone) and then scaling up to larger screens. Because there is such limited space on a mobile screen, it is critical to include only important content. When designing for mobile it is important to realize that the information being sought is probably different from those searching on the desktop. Meaning, the mobile versions have easy to get to information and navigation while a desktop has more detailed information.
Less content is MORE content!
We all know that content should always be the top focus for clients. Not only does this give depth to a brand, it promotes SEO. When on a desktop you have a vast amount of space to organize chunks of paragraphs in a creative way. With mobile, you are extremely limited. To be mobile-first, your content needs to be concise, clear, and to the point. Not everyone on mobile has time to read through 600 words to get to the info they came for. A good question to ask a client when is what is the most important thing you want your customers to get out of this page? Designing with a clear content strategy will help focus on the essentials.
Keep it Simple!
People love simplicity when it comes to a website. There is nothing worse than an unorganized website on top of a pretty “ugly” over the top design (yikes). When you design for mobile and expand to the desktop you have more elements to incorporate but with the base already laid out for you. Imagine having a ton of navigation links on the desktop. When your customer is on mobile you now have to scroll down lower on the screen just to access a certain page. Not good. When thinking about the mobile design you should try to compile similar pages, making the experience enjoyable without promoting unnecessary anxiety.
Optimization is Key!
If you aren’t aware of how important it is to optimize images on the web, I’m here to help! Images affect load time, if this is a problem on your site, don’t expect your customers to stick around. For mobile, it is just as serious. There are many factors that can damage a customer’s interaction with your website, a poor connection for example, and you want to ensure they get what they came for. The two main factors to be aware of are the quality and the actual file size. Tools such as Photoshop (save for web) is my goto to minimize file size perfectly.
Take Better Action with Your Call to Actions!
One of my biggest pet peeves when visiting different types of sites are broken links. It is so detrimental to a site that has a link or file that a customer knows they need but can’t take any further steps. While having working links is important, the placement of these links right at the top of the list. Calls to action are useless if they aren’t designed with mobile in mind, meaning you are missing out on leads and sales. Prioritize your important CTAs to the top of the page as well as the bottom so customers are taken where they need to go.
Final Thoughts
The user experience should and always will be the number one priority when it comes to design. To learn more about what we can look forward to with UI and UX, check out Staci’s blog, “The Future of UI and UX”!