http://www.yourtechtamer.com/blog/2012/11/making-your-website-mobile-friendly-you-have-to-do-it/
Greetings, All –
I am so sorry for the lack of posts this past month…Honestly, it feels like I just wrote the last post a week ago, and it’s already a month old. Oye! How does that happen?!?!
First, a very Happy Thanksgiving to all our readers here in the United States. It is a time to give thanks, and I certainly thank all my loyal readers and clients – for without you, it’s no fun.
We all know that more and more people are checking out websites on their smartphones. People are on-the-go…they hear about something and immediately check it out – from their phone. UNFORTUNATELY, a ‘normal’ website will not appear correctly on a phone…well, that’s not exactly right…they appear correctly many times, but they might be itty-bitty and no mere mortal (certainly, not any mortal over the age of 35) can actually read the text, or images and text can be ‘off’. That said, converting your site can often end up in the ‘too hard’ pile…We don’t know how to go about it, we don’t have time to do it…whatever the excuse.
A reader of this blog asked if I knew ‘how to make a website mobile’. While I knew THEORETICALLY what was involved, I didn’t really know the HOW – having put my own website in the ‘too hard’ pile for making it ‘mobile-friendly’. So, I figured that it was about time to figure it out. Imagine my happiness and delight when I found a GOOGLE related site which helps you -for f*r*e*e – convert your existing site to a mobile application.
Follow along…it’s really not a bad experience!
Here is the ‘traditional’ home page for our website YourTechTamer.com
We want to ‘mobilize’ this site using Google’s HowToGoMo application (HowToGoMo.com). The music to my ears (well, eyes), was the link ‘build your free site now‘.
Enter your URL and press ‘Make My Site Mobile’. GoMo presents you with an initial mobile layout that you can then edit:
You can play around with any number of designs, or leave it at the default created. Once you’re happy with the basic design, it’s time to work on changing colors, etc. Click on ‘Next’ to bring up the next screen:
I only changed the number of navigation items showing, but you can change any number of different things to customize the look and feel of your new mobile site. You can create a ‘push to call’ button. You can change colors/images. Basically, let your creativity shine and see where it takes you! Once you’re done, you’ll need to create a signon for ‘DudaMobile’ (they’ll be hosting your new mobile site). Once you’ve entered the information, its time to PREVIEW your new mobile site – see how it appears on the four major types of mobile devices:
Make sure you check how your individual pages appear…because that’s as important as how the navigation adjusts. Some highly formatted pages do not ‘mobilize’ well. Check with your web developer if they don’t.
You can also setup blogs as mobile sites – check out the mobile version of this blog at http://mobile.dudamobile.com/site/yourtechtamerblog from your smartphone.
If you’re happy with it, hit ‘Setup My Mobile Website Redirect’. This publishes the mobile site on Duda’s servers:
Lastly, you need to give a snipped of code to your webdeveloper to put in the header of the home page of your website. It’s an easy step and is explained very well on this screen:
Why do you need this? You need it to allow users to be directed automatically to the correct site for them based upon the device that they are using. The web can be intelligent enough to know when someone is trying to search on a site from a mobile device. If it senses that the ‘searching device’ is a mobile device, it will automatically redirect the user to the ‘mobilized’ version of the site and away from the ‘standard’ website.
There’s only one caveat…the mobile site is only free for a year…after that, it will be $108…but the good news is that you don’t need to leave a credit card on file…use the site for a full year and see how you like it…tweak it and adjust it. At the end of the year, you can pay the $108 OR you can actually give your website developer the code that was created from the site (yes, you can get to the HTML and CSS code within the ‘build your mobile website’ screens) and integrate it into your own website code. Either way appears to work.
At worst, you get experience – for free – with what you want to appear on a mobile site…then you are a knowledgeable consumer if you choose to have the mobile site integrated into your hosting…and you can show a website designer exactly how you want it to appear.
Have fun MOBILIZING!!!!
4 Comments
Yes! Finsllү ѕomething about Mobile Marketing.
Wow thanks for that! I had never heard of howtogomo before reading this and that is surprising because google normally do a great job of getting their products out there, I’m going to give this a try, hopefully google don’t do their normally trick and develop something for 6 months and then all of a sudden stop development and start something else haha leaving everyone it a kafuffal :]
Great post, Sandy.
One of the key things you mentioned is the snippet of code put in the header of your “regular” website.
The type site created here, as you demonstrated, is great for smartphones… but you don’t necessarily want people with tablets (ALSO a mobile device) to see only what fits onto the screen of a smartphone. The code will allow the person to see the correct layout for the specific device being use.
Happy Thanksgiving to you too! Great to see you back on here!
Charlie Seymour Jr
http://DrMarcAndCharlie.com
Thanks, Charlie! You’re absolutely right…the snippet of code directs the site to the correct layout based upon the device being used. Quite remarkable, when you think about it!