What Makes A Mobile Responsive Website Successful

Mobile responsive websites are a necessity. The poor desktop system, while certainly extinct, has at the very least seen the sun set on its heyday. Mobile is where it’s at, and your website needs to be mobile responsive. So, what makes a successful mobile responsive site?

marketing and Internet online business websites need successful presentation and company homepage design

A website that is responsive to all sorts of devices is the ultimate goal

One Site For All Mobile Responsive Devices

Although there’s a lot of talk about having separate websites to accommodate smart phones on one end and desktops and laptops on the other, this is not necessarily a good plan. One website, adaptable to all platforms, should suffice. After all, creating multiple sites is a redundant investment of time, energy, resources, and money.

Keep It Simple

Consider your full site’s design when looking to go mobile responsive. How much of the content is extraneous, essentially useless to the average visitor? It can be argued that approaching full site design from the perspective of “how much of this will transition easily to a mobile device?” can help in making sure that empty frills are kept out altogether and that only good, relevant, useful content survives.

Keep both your HTML and site navigation simple and clean. When it comes to navigation, avoid drop-downs if at all possible. If you can’t do that, then at least keep it to one level.

Define and Choose Breakpoints

Breakpoints are the points where you insert a change to the resolution in order to accommodate the displays of a wide variety of devices (e.g. smart phones, tablets, laptops). The three major breaks are:

  • First generation smart phones
  • High-end smart phones and portrait iPads
  • Larger displays, such as desktops

However, if possible, there are three more that you should try to accommodate:

  • Low resolution mobile phone displays
  • Landscape iPads and trigger tablets
  • Wide screen desktop displays

Linearize Your Content

Make sure all of your content lines up into one nice neat vertical column. You can easily accomplish this by overriding all column bloc widths in your mobile style sheet. Give all blocs a 100% Width.

Make Sure The Layout Is Flexible

You can’t go wrong using relative width instead of fixed width, as well as using columns to get content organized (yes, this is a corollary to the previous point). Do it right, and there’s no device that your site can’t adapt to!

Image Issues

No, not your personal reputation; we’re talking here about website images. Make sure the images are of good quality. Incorporate breakpoints and adaptive sizing. Scale those images, and don’t forget to take into consideration retina displays.

Odds And Ends

Here are a few extra things to keep in mind when you design a successful flexible site:

  • Use larger calls to action, including larger buttons; not everyone has slender graceful fingers.
  • Avoid pop ups; they’re annoying enough on a desktop system- on a smart phone, they’re practically war crimes.
  • Make sure that the Search function is easily locatable; nothing is more frustrating than looking everywhere to find that blessed little magnifying glass and blank field.
  • Scrolling is better than multiple pagination; scrolling is smooth and easy, loading multiple pages is an aggravating pain in the butt.

Keep these points in mind, and you’ll have a site that can be accessed and enjoyed fully by anyone, regardless of their device.

John Terra has been a freelance writer since 1985. He writes about everything from gutter cleaning to how to process mobile payments. His proportion of laptop use to smartphone use runs about 60-40.

VN:F [1.9.22_1171]
Rating: 10.0/10 (1 vote cast)
What Makes A Mobile Responsive Website Successful, 10.0 out of 10 based on 1 rating

Born and raised in the Boston area, I was rocketed to New Hampshire, where under the Granite State's yellow sun and lack of income tax, I have gained the powers of super-sarcasm, brilliant creativity, and slightly disturbing sense of humor.

No comments.

Leave a Reply