How to Create a Mobile Version of Your Website

One of the most important points in owning a website is making sure you have a lot of visitors to access it. Besides it being informative and having many other useful features you have to think about it being easy to access from different points of view – whether a person wants to view your website but has a slow internet connection or simply wants to check it on the go from his/her mobile phone. Mobile phones are indispensable nowadays and there are lots of people that use them for browsing the Internet so they don’t have to carry their laptop with them everywhere but still have access to the information they need.

More and more website designer focus on having a “mobile version” of their websites and this is definitely a new trend to consider if you want to hit success. Although it might have the same background as simple websites that you can easily view on your PC, you have to follow certain rules when going for a mobile version for your website as mobile phones are different and have special requirements when browsing the Internet, due to their technical features. This is why we decided to present some techniques and key aspects that you would need to take into consideration when you decide on making a mobile version for your website.

Create a Mobile Version of Website

Basically all you have to worry about is the layout and the coding – that’s what needs to be done a bit differently. In choosing the correct layout you will have to pay attention to some stuff like the logo, the easy website navigation and the content. Keep the structure of your mobile version simple, sometimes just one column is enough for a good design, remember that users would like to find the information he is looking for fast and easy. When you would like to include the logo of your website in the mobile version, you have to make sure for it to be the correct size as it might take a long time for it to load. It usually doesn’t have to exceed 2 KBs, this way you can keep your logo nicely fit into the page and make it easy to load.

Mobile Version of Your Website

Don’t forget about the navigation bar, place it somewhere easy to access and be sure to have there the links to all the necessary pages on your website. The content of your website is one of the most important things that people look for in the first place so be sure for it to be exactly the same as on your “normal” website. If you alter the information or make it shorter be sure to link it to the main the page where users can find the whole article, otherwise it might turn them away if they are not pleased.

Be sure not to have too many images in your content, as I’ve mentioned before it takes a long time for them to load on a mobile so try to use graphics only when necessary and if you do decide on placing images in your content, be sure to have the right size and compress them. It is also recommended to use .jpeg, .gif and .png formats on your pictures as there are the most light-weight. Placing ads in your mobile version is also not the best idea; just leave them for the normal version.

One more thing you should pay attention to is the footer, don’t overload it with links and information that is not necessarily important. Just make sure for it to be neat and simple.

Last but not least important is offering the visitors the possibility to browse the normal layout of your website. Some developers place this option at the bottom of the website so when a user is freaked out about the mobile version layout he can easily switch to the layout he is used to browse on his personal computer, although it might take some time for it to load, anyhow it’s their choice.

Speaking about coding, remember to use proper code, make sure it completely complies with the existing standards as mobile browsers are not as powerful as the ones used on personal computers. In order to make sure for the layout to look nice on any mobile phone, whether it has larger or smaller screen is to use fluid layouts – this feature will automatically adjust to the screen size on any mobile phone. Try not to use any super fancy scripts for your mobile version (i.e. Javascript or Flash) as sometimes this might screw up the devices because some of them fail to interpret these codes in the right way. Take into consideration that mobile browsers are different and read the script differently so you might want to add an automatic “Mobile Browser Detection & Redirection” server-side like PHP for instance. The mobile version of your website HAS to be automatically triggered for every mobile user, otherwise it is not complete.

Other than the tips stated above you can also use website builders. With the help of these, you can host and build the mobile version of your website with no coding knowledge.

That’s about it, I hope this information was helpful and will make you think about making the mobile version of your website and let us know – we would like to check them out!

A girl that lives through the lens of her camera - as this is the best way to see things as you want them to see. Born and raised in Moldova, now living in sunny Cyprus.

Newsletter

4 Comments
  1. Johny Jan 24, 4:03 am

    I second that

    Reply
    0
  2. steff Jan 24, 12:40 pm

    if i am correct and i remember right there is a plugin for wordpress that automatically creates a mobile version of your blog. haven’t tried that yet though!

    Reply
    0
  3. Designi1 Jan 24, 1:14 pm

    Hey… nice words here… you should split a bit more your long text in some h2 sub menus.

    Actually php do not read your screens (but will do mobile detection :D). because is server side language as you spoke. Or in 1 one year was what read about when i wrote my article about how to convert your site to a friendly mobile version. Needs to be a script that work in a client side to read the dimensions of the screen… Php will be no useful to check any screen dimension.

    But as every one knows every mobile as different capabilities… some can get almost 800×600 resolution :D is almost one 10 years later screen monitor :D

    i got the same conclusion as you did. You´ve a lots of free web to mobile services online. Its a way to choose the best one.

    once more, nice words, keep going great work!

    Reply
    0
  4. Robbie Gee Jul 27, 7:55 pm

    I love this site & this post has some INVALUABLE information. Mobile websites is really where it’s at. I surf the net on my phone all the time & come accross sites that are NOT optimised for mobile! Crazy!

    Guess what I do when I land on such a site? SURF ON DUDE!(sorry)

    Robbie

    Reply
    0

Leave a Reply

*
* Minimum length: 20 characters