From 2018 until now, over 50% of web site traffic comes from mobile devices. Obviously, web design is very important, especially if over half of internet traffic is on mobile devices. But mobile web design is a delicate balance because you want to optimize your website for different devices (PC / mobile) and screen sizes.
A lot of website building tools (like WordPress) can really help to automate the mobile web design process, but there are still things you need to get in there and manually adjust. So in this article, I’m going to tell you the 3 biggest mistakes to avoid when designing websites with mobile devices in mind.
A lack of responsive design
Responsive design is singularly the most important consideration when designing for mobile devices – actually when designing websites in general. Responsive design allows your website to automatically fit itself to the screen size of the device it is being viewed on. But I don’t mean the website will simply shrink for a phone screen because that would make the text pretty unreadable, right?
The responsive design utilizes grids and layouts, so for example in landscape mode, your website’s menu may appear on the left side, with the content display in the middle to right, whereas in portrait mode your menu may become a button at the top right corner.
So again, responsive design doesn’t mean shrinking your website, it means rearranging your content’s layout to better fit on screen sizes and orientations. It’s a very important step in web design, not just specifically for mobile.
If you need some third-party help with the perfect mobile web design, I recommend checking out some of the best firms specializing in UI and UX.
Using homepage carousels
The web design industry sadly went through a carousel (slideshow) phase, which nobody ever actually liked, but for whatever reason, it was deemed stylish for a time. If you’re considering a homepage carousel, or already have one, there are far better options which I’ll mention. But first, let’s examine why carousels are bad.
- People generally ignore them, carousels look too much like banner ads.
- Sliders generally lack mobile optimization, as they load multiple large images at once while running additional javascript. Hello, poor loading times on mobile data.
- They aren’t really accessibility-friendly, as the arrows to scroll through sliders are often really tiny and hard to see, especially for users with visual impairments.
Some better options than carousels are smart content, static call-outs with clear calls to action, and (optimized) gifs or videos. Studies show that 95% of web users retain information when it’s obtained through a video.
However, be aware that people also really hate autoplay videos, so make sure your homepage video allows users to play it themselves, rather than automatically playing as soon as they load your website.
Your content isn’t scannable
On average, people only read around 28% of the text on a typical website. If you’ve got paragraphs and paragraphs of content, whether it’s about your business and your services offered, you’ve got a problem.
Nobody is reading those walls of text, especially on a mobile device. At best, they’re speed-reading through it and plucking out the most important information.
Slim down your content. There’s a great trick most (good) content writers use – pruning unnecessary words and sentences from the text. I’m guilty of being too verbose sometimes. I’m doing it right now. But I’m hammering a point home, and I can be a bit more verbose because you actually came here to read this article. In my head, I’m writing as if I were actually speaking to you in the same room.
But generally, whether it’s writing blog topics or website copy, the goal is to be clear, concise, and short. Also, break up your paragraphs more. A paragraph is defined as being between three to eight sentences, and you should be leaning more towards the three than the eight.
You want nice little white picket fences of text, not walls.
