We now have a live iWeb site and thanks to our self-promotion on various social media networks, forums and other sites we have started getting in a steady stream of visitors. Okay so the numbers aren’t huge….yet, but give it time; it can take ages. This lesson isn’t something you necessarily have to consider straight away but might want to look at it if your site really takes off; we are going to make our iWeb sites mobile friendly.
There is a variety of things to take into consideration when designing a site for mobile users and we shall be touching on as many as we can. There are also a few links to some mobile web-site galleries for your inspiration.
[premium level=”1″ teaser=”yes” message=”Sorry, you need to be an active subscriber to view this post.”]
With so many different mobile devices offering so many different screen sizes and different browsers it goes without saying that you are going to need a separate version of your site for mobile visitors. But you needn’t panic. You do not need to recreate your iWeb site again just smaller, mobile sites are all about getting the best from what you already offer.
Making it easy and obvious for your visitors to get around your web site is always important, but it becomes more so when they are using a mobile device. If a user is being charged for the amount of time they spend on-line whilst on their phone or other mobile device then they want to find what they are looking for as quickly as possible. In reality you shouldn’t need or even use the same navigation that you have on your full iWeb site, you just need the important pages.
You can check your Google Analytics stats to see which pages are getting the most hits on your site and which wants aren’t so that can help you decide which pages to include.
Keep the design simple
I know it may seem obvious but it is something you really must abide by. Once again, think of your users (and more particularly their phone bills) before you start building. Having an image heavy site that takes time to load is not good and mobile users will soon switch off and go elsewhere. Plain, legible text is the key.
Get with social media
Twitter and Facebook are everywhere now, even more so on mobile devices so including links to your social media accounts is a great way for mobile users to keep in touch and remind them that you are there. They may not remember visiting your site when they were in Starbucks but if they are sitting at home on their MacBook and see your entry in their Twitter feed it may jog their memory to check out your site in more detail.
Make sure your brand is what a user sees first
How many times have you visited a web-site, whether it is a mobile one or not, and not seen the site’s logo or brand name? As I have mentioned already a few times users of mobile browsers don’t have much time so getting your brand noticed first and foremost is extremely important.
Lose the bells and whistles
The real estate of a mobile browsers window is nowhere near as much as a regular computer or laptop. The last thing a user needs is flashy animated GIFs, unnecessary splash screens or lengthy forms to fill in. Don’t distract your visitors with clutter your mobile site does not need, just concentrate on the important content.
To redirect or not to redirect, that is the question
Once you have designed your site you now have another decision to make. Do you automatically redirect mobile users to your mobile site or do you let them make their own decision. It’s a toughy and there is no definitive answer. Me personally I would let the user decide because I know how annoying it can be being redirected to a mobile site when I am browsing on my iPad; but the choice is yours.
If you do want to automatically redirect users just use the code you can see below and replace the URL (in red) with the URL for your mobile site:
Place that code in the head section of your regular iWeb site’s pages (remember how easy that is using the?) and then publish your site. Just be prepared for complaints from users. Of course if you do get inundated you can always take the script out.
Here’s the mobile version of the Themes for iWeb site I built. I concentrated on the home page (naturally), a page showing a few themes just to whet the appetite of a visitor, there is a page advertising my eBook and finally a contact page. You’ll notice that the navigation is simple, just four pages with basic, clearly laid out design; no fuss or muddle.
I’d be interested to hear what you think.
If you need some inspiration for your mobile site take a look at a few of these sites, there is some excellent work:
Well that’s it folks, Day 21 had arrived. As promised you get to have the whole lot as an eBook but before I do publish the link I want to take this opportunity to ask you all if you have any questions about anything you have read over the last 21 Days. If you do, please either leave a comment or send me an e-mail though my contact page and I will then publish another post for all the subscribers answering those questions, along with the link to download the eBook. I hope to hear from you soon, and I hope you enjoyed the program, of course I would love to see all of your ‘new and improved’ iWeb sites, so why not send me a link too!