Back in the Wild West of Web Design, designers worked on the assumption that you’d view on a computer. For the most part that stayed true until the rise of Web-Enabled devices. Mobiles, tablets and anything that could connect to the internet became something designers now have to take into account. Now a lot of traffic is driven by people on their mobile phones. If your site is slow to load, doesn’t look good or isn’t easy to navigate, you’re out of the conversation. What are some of the things you need to take into consideration when designing for mobile? Here’s some of my experience.
Mobile and Speed
I’ve mentioned it above, but when someone comes to your site they are generally looking for information quickly. They are scrolling trying to find the exact piece of information they are looking for. If your site takes too long to load or you go into a long explanation then you have lost your user. I can tell you from experience when a site is slow to load I click back and look for another. Odds are you’re the same. Some things that slow down a page or site:
- embedded videos, that run automatically
- formatting the page to load all at once instead of gradually
- Filling the site with images not formatted for the web
On mobile it is imperative to get things as tight as possible. A good indicator of how well your site is at this is your bounce rate. The higher the percentage the less time people are spending on your site. There are countless resources out there to help you. Find them and take advantage of them!
Is it easy to navigate?
This is the main question you should be asking when designing a site in general. On mobile, it’s even more important. Luckily on most site builders you can see how it would look on different formats. The thing to be aware of is that what happens in one format, may affect another. A pixel measurement here or an image size there may fundamentally change how your site functions.
On top of that, there is the whole aspect of how do you get from one page to another. How do you show that there is a link? Can they see the menu? How does the burger bar look? These are all things you need to be thinking about in the back of your head as you design.
Something that I hit on in the article about how I designed my own site was user journey. This is again something you need to apply to the mobile version of your site. If you need a refresher there’s a link for how we built our site here!
How does it look?
What works in one format doesn’t necessarily translate to another. For example, having an image next to a block of text works really well on desktop. It is a quick way of visualising what you’re saying. On mobile not so much. Something will get smushed or if you format it so that the image is under the block you have to make sure it’s big enough to illustrate the point. Other times when an image is decorative, then you have to make sure it’s between something appropriate and not distracting. If I’m honest that’s just a good rule to have in general. A menu effect or page animation may look great on desktop, but might look odd on mobile and vice versa. Much like with desktop, try to look at sites that really work on mobile and try to give it your own spin.
Those are just some of the things you need to think about when designing for mobile. What are some of the things you love about web design for mobile? Let me know in the comment section.
If you want more articles like this one then why don’t you check out our Blog page? We publish articles every week so it’s worthwhile following us on Facebook or checking back in with us regularly.
