If not done correctly, the background of a mobile website could be a real deal breaker. Wallace Morrison (referred to by his friends as Morrison), a Duda Reseller who has perfected the art of mobile website design, has been generous enough to share some of his most coveted secrets – specifically on background images and color.
Morrison identifies how to navigate through the creative process by putting himself in his mobile visitor’s shoes and answering the question of: Would I want to see this background if I came back to the mobile site? He believes that if the background is pleasing, coming back to the site will not only be fun, but visitors will be more inclined to share it along with their friends.
Take a look at some of Morrison’s work in his portfolio (take note of the custom background images!).
Theresa: I took a look at your portfolio and am stunned on how each site has a custom background. When designing a mobile website, how do you decide what image, color or design to add to the background?
Morrison: In general, when we convert the site to mobile, there is usually a background color in place. Sometimes, that background may not be what you want so the first thing I do is eliminate the initial background that is on the mobile. Just because someone has, for example, a zebra print in the background on their desktop site, doesn’t mean it fits mobile.
If you are adding a very busy image, it can take away from the ability to read text. Unlike a desktop site, we don’t have much realty, so we really have to be minimal. If you want to get really creative, you can adjust a busy image by just using a portion of it.
Theresa: Of all the mobile websites you’ve built, which site had the best background?
Morrison: This is like choosing which of my kids do I love the most. To me, they all have the best background, because I make sure that everyone gets the best from me.
I will have to say that the one background I get the most attention from is the martini glass on Stepping Out Florida’s mobile site. I think it has to do with the purple, pink and red contrast and the navigation being transparent. I have always felt that this design is borderline busy and if I had added anything else to the background, I would have went overboard. The martini glass is the first thing you see when you land on the page and it really screams at you, but at the same time your eyes start veering towards the navigation.
Theresa: I know you’re busy brewing up another awesome mobile website. Care to give us a sneak peak of the background on your most recent project?
Morrison: I am actually working on a site now, the Acoustic Coffee House. When analyzing the desktop site, there is no background, but a yellow color. Here’s a quick peak.
Many things are going through my head at the moment as what to put in the background. Maybe, I should just stay clean and not use a background at all. Sometimes, not having a background is the best background to have. I am thinking about adding a nice cup of java with a fade so it doesn’t obstruct the navigation and lays as a nice backdrop, but I am a little indecisive on this. Originally, the background has a color of yellow and it may be made to be just as-is. I’ll have to toy more with it. However, adding a transparency to the menu so that the background shows through is a big help on this site.
Theresa: What advice could you lend fellow mobile website designers on choosing the best background image?
Morrison: My advice would be to study the subject and try to get a feel as to what would work best. Ask yourself the following: Is the image too busy for the site? Is the site so busy it needs a busy background? When you analyze what you are doing without jumping into it head first, you’ll save a lot of time afterwards trying to correct something. Whatever background you choose, needs to be as timely as possible. If you are a designer or want to be a designer, understand that tens of thousands and sometimes millions of people will be looking at your piece of small art, so the “need” or “no need” for a background is very important.
Note: If you’re interested in joining DudaMobile’s reseller program, visit our reseller page to learn more and signup.