Mobile devices are everywhere. You could say they have officially taken over the world. A mobile device is classified as any device small enough to fit in your hand. There is not a place in the world you probably can’t find one. Heck, I bet there is some guy in a lost civilization out there, wearing pants made out of grass, Instagramming pictures of the piranha soup he just made. While responsive [mobile] design has only taken off in the last five or so years, websites have been around for much longer. But they haven’t always been friendly to the smaller cousins of the desktop computer.
You can still browse the web and find websites that haven’t quite managed to adapt to the times. Once loaded, these websites look what you might imagine a movie would look like from the far back row of a drive-in theater. The text is so tiny. You can’t quite narrow in on the menu link you are trying to push with your now seemingly gargantuan index finger. The images are so small that you can’t tell if you are looking at that spool of network cable you wanted to buy or a pile of fish bait. To add fuel to the fire, some of these sites are trying to load amazing and fancy slideshows or super-huge images to the mix. Meanwhile your carrier is counting those bytes as shiny golden coins like Scrooge McDuck.
To be fair, the technology didn’t always exist to facilitate responsive design. What is responsive design? It is an approach to crafting websites to improve the viewing and interaction experience of the user (that’s you) . Without boring you to tears, let me explain in a couple sentences. Web pages use styling rules to determine how the images and text are laid out in a website, and there are ways to create rules that apply to the website on different screen sizes. These rules weren’t always available to developers and designers. Thankfully, now we can make an image show nicely on just a fraction of a desktop monitor and also make that image fill up the entire width of the screen when viewing it on a mobile device.
Why is this important? Because users (again, that’s you) want everything to be simple and easy. They don’t want to have to pinch and zoom to see an image or make a link large enough so that their fingers can click it and only it. Desktop views of a website might include hundreds of images and paragraphs and links, and because the real estate of your desktop monitor is probably huge, it doesn’t feel so crowded. But once you get down to the itsy, bitsy screen sizes of your iPhone, all of those elements get pushed together and crowd your screen. It makes it hard to find what you are looking for, and frankly it’s just plain frustrating.
You know what I’m talking about. How many times have you just given up on navigating a website because it was just too much work? User engagement is important in mobile design. You want to keep a user there are long as you can. You want them to find what they are looking for because then they will come back. If you are selling a product, you want to make sure that they can find that product and buy it before their attention is demanded elsewhere.
A few simple tips for designing a mobile website are as follows:
- The search should be at the top.
- Registration should not be required
- Navigation should be simplified.
- If you are selling a product, finding that product should be easy.
- Adding that product to the cart should be easy.
- Paying for that product should be easy.
- Images should be of small size and sparse.
- Fancy effects and slideshows should be hidden.
What this means is that for mobile design to be successful it needs to avoid distracting the user, and it needs to provide everything they need at the tip of their fingers. As a website owner, this usually means that you will have to do away with those fancy slideshows that you want to show off. Remember, it’s not about you (the owner), it’s about the overall user experience. Keeping a user’s attention is important, but making them want to come back is even more important.
Fortunately, we can help. Want more information? Contact us today!
Follow Us!