Four Design Tips to Make Your Mobile Website Awesome

Four Design Tips to Make Your Mobile Website Awesome

It’s inevitable that all small businesses need a mobile website. It’s also likely that you might already have one. Last year mobile data traffic nearly tripled from the year before and is expected to greatly increase by the end of 2011. Considering the boom of the mobile revolution, going mobile is definitely a step in the right direction.

Though all mobile websites are unique, one aspect which remains consistant across the entire mobile web is the importance of proper mobile web design. In a recent study conducted by Google, 61% of users are unlikely to return to a mobile site that they had trouble accessing from their phone. A poorly designed mobile website could be detrimental to click through and conversion rates.

Fortunately, you don’t have to be well versed in the latest CSS and HTML to give your mobile website the sleek and professional design that it needs. Take a look at these four handy design tips that anyone can easily apply to their mobile website.

1. Customize the Content for Mobile

A mobile website is a condensed, tiny, one column version of a desktop site. Tailoring your content to the needs of the mobile user could greatly benefit the user experience and lead to a higher conversion rate through your site. the typical mobile user is on the go and in search for the information they need, fast. Eliminating some of the content that’s on your mobile site, which may only be viewed by a desktop user, could prevent customer confusion.

If you’re not quite ready to nix entire pages, then change the page order on your navigation menu. Put the links and pages a mobile user will likely use the most towards to top of the home page. Rearranging the page order of your mobile site will help your users find the information they are looking for, while also preserving the likeness of both sites.

2. Reduce Multimedia

We know how much you like the embedded YouTube videos and photo albums on your website. We like them too. Unfortunately, when designing a mobile website, large amounts of multimedia should be significantly scaled down or completely eliminated. Mobile users have limited bandwidth and a slower connection to the internet than desktop users, however when browsing the internet on their smart phones, they still expect sites to load at a quick rate. High volumes of photos and videos can slow down the load time of your site which will turn users away. One to two images per page and one video is enough multimedia for your mobile website.

3. Negative Space is Good Space

Negative space, also known as white space, is a key to mobile website design. Incorporating negative space in your mobile site will give it a clean look and make it easier for the user to navigate through.

Some simple things you can do to add negative space are:

  • Increase padding around important links and buttons.
  • Remove multimedia elements like excessive amounts of photos and video to eliminate clutter.
  • Add line breaks between large bodies of text.

Enhance the appearance of a mobile site’s negative space by keeping the background color of your site a light color and the text, a contrasting dark color.

4. Add Thumb-Friendly Elements

When designing your mobile site, consider following the general rule of thumb. Typically, mobile site browsers use four fingers to hold their phone while leaving their thumb free to scroll up and down on the screen. Turn important links on your mobile site into buttons to make it easer for site visitors to select them. For example, a phone number can be replaced with a click-to-call button and a link that returns the user to the home page can be replaced with a back home button.

Mobile Website Design Done Right

Take a look at these four examples of mobile websites which display excellent mobile website design.

Put Your Mobile Website Design Skills to the Test!

If you think your skills in designing and developing mobile websites are better than our examples, apply to join the DudaMobile Developer Network! Join now and be featured on Dudamobile.com, receive leads, and let us promote you to businesses who are in need of your services. Sign up through our website to be considered.

Email me if you have any questions at theresa(at)dudamobile(dot)com.

Mobile Website of the Week: SweetCakes By Ronda

Mobile Website of the Week: SweetCakes By Ronda

Mobile websites make our mouths water. This week for Mobile Website of the Week, we chose an extra sweet site as the winner.

Congratulations Ronda, owner of SweetCakes by Ronda!

Regular Website

Mobile Website

What Made this Mobile Website so Sweet?

In general, we loved how simple this mobile website is. The two aspects of this site that stood out to us were:

- Only five colors were used in this mobile website.

- There is a significant lack of multimedia elements (in the absolute best way possible!).

How did Ronda Make her Mobile Website?

Ronda has built her life around extravagant cake masterpieces. This being the case, you would think her mobile website designwould be as over the top as her cake decorations. When choosing the colors for her mobile website, Ronda decided less would be more.

I counted the colors Ronda used on her mobile site and found that she only used five (I counted black and white as colors). Ronda chose pink as her main color, which was used in the background, navigation menu accents and share widget accents. She kept the sites body text black and the navigation menu text grey.

Ronda kept her mobile website free of multimedia. Since mobile phones have a slower loading time when connecting to the internet, jam packing them with videos, audio and large photo galleries will make site’s connection even slower.

This might be the simplest photo gallery we’ve ever seen in a mobile website. Ten great photos of cakes send the clear message to Ronda’s mobile site visitors that she’s an excellent cake decorator. What else do they need to know?

Find out more about Ronda’s Sweet Cakes

Visit her website to see more cake creations. She also offers design and decorating classes, so sign up today through the contact page.

Could you be the Mobile Website of the Week winner next week?

Email me at theresa@dudamobile.com, tweet me at @dudamobile or contact me on facebook if you think your site rocks.

Has your mobile site been published? If your site wasn’t published, we didn’t see it (and neither did your customers). Check our Support Center for instruction on how to publish your mobile website!

Upcoming Webcast: Mobile Websites for Local Businesses

For all of you who are interested in learning more about how the mobile web is impacting local businesses, Duda would like to invite you to attend the Mobile Websites for Local Businesses webcast presented by DudaMobile’s very own Rajat Khurana, VP of Sales and Garrett McGrath, Sr. Product Manager of AT&T Interactive.

This hour long webcast will highlight the internet traffic shift to the mobile web and how small businesses can effectively reach their customers in this space. Find out more about the webcast here.

The webcast will be held Tuesday, August 23rd at 10:00am PST. Sign-up to attend through BrightTALK or below. This webcast is free of charge and open to all.

A BrightTALK Channel

DudaMobile Direct has Launched!

DudaMobile Direct has Launched!

The much anticipated big news is released!

We are pleased to announce the official launch of DudaMobile direct! We are happy to be the first, free, easy-to-use web-based platform that allows even the most non-techie user to easily turn websites into mobile friendly sites.

What’s new?

Along with the attractive, new facelift we’ve given our homepage, we have revamped the dashboard and added new templates. You can still find the famed Duda features which include: one-click conversion of existing website to mobile, auto-syncing between a standard website and mobile site, compatibility with all major smartphones and, as always, professional-looking mobile sites.

What does this mean for Beta users?

If you participated in our private beta, your site(s) created during that period will remain free of charge until next year. We will contact you via email regarding the payment change. Any site created starting August 2, 2011 will be priced according to our payment plan.

We thank you for helping us achieve our mission

The DudaMobile team is fully dedicated to making all regular websites mobile. We would like to thank EVERYONE who has supported the Dudas as we have been working hard to optimize the web for mobile devices.