Normally many mobile devices should be able to access your website. However your website, which has not been optimized for mobile display, may looks pretty crappy on those handsets, like mobile phone, smart phone, tablet. A website designed to be viewed on laptop, PC, computers might not work well on some mobile devices. If you have a website, you should definitely test it on a mobile device, especially the most popular ones like iPhone, iPad, Samsung Galaxy phones, HTC phones, Nokia Windows phones, Microsoft tablet Windows RT, etc.
When you use a mobile device to access a website, like the iPhone for example, it is likely to take longer to load, the screen is much smaller compared to a desktop computer and navigation requires a lot of zooming and pinching. If you happen to open some web page with flash content, you will find they are not displaying at all on iPhone. A mobile device does not have the same horsepower that desktop computers have to handle high bandwidth sites as quickly as PCs. It does not have a wide screen to display very wide or long web pages. It does not support some of the popular scripts or files either.
Tips for Building Mobile Websites
Know Your Target Users and Mobile Devices They Use
Typically a website for mobile should be more content compact, smaller in width/height, has clear interface and simple navigation, etc. There is a wide range of mobile devices and OS for them nowadays, such as Android phones and tablets, Windows phones, Windows RT, iPhone, iPad, BlackBerry, etc. You will need to find out your target audience and how they access internet. In any case, ensure your website is at least usable on the majority of mobile platforms and web browsers.
Smaller Websites for Mobile
A smart phone or tablet could be too small to fully display those desktop websites. For example , an iPhone 4 has a screen resolution of 640 x 960 pixels, HTC Touch Pro has a 480×640 pixel screen. Thus to make website for mobile, you have to make it smaller for the best display on smaller screen. You may need to redesign your navigation menu, break up long text or pages, etc.
Use Clean & Valid Markups for Mobile Website
Clean and valid coding is not only search engine friendly but also mobile friendly. Develop with the most recent HTML version and markups HTML5 is your best choice. Compared to earlier HTML versions, HTML5 is a huge move toward mobile website design for its excellent compatibility on mobile devices. HTML5 does not only have features to help make SEO friendly websites, you can actually develop more clean yet interactive and mobile compatible website with HTML 5.
Avoid Flash on Mobile website
Not all smartphones and mobile devices support Flash, notable the Apple iOS devices, iPad, iPhone, iTouch, do not support Flash at all. If videos are necessary for your mobile website, you can use HTML5 videos in web pages.
Minimize the Use of Videos on Mobile website
As we have mentions above, the internet connection speed on mobile devices is not suitable for high bandwidth websites. Also as mobile devices connect to Internet mostly through wi-fi, normally the wireless connection is not as stable and fast as the cable connection. Website visitors nowadays may not have to patience to wait long for your slow loading speed.
Codes to avoid on Mobile website design
Since mobile users do not use a mouse, some relevant script or code is totally unnecessary and will be ignored. Some might even case troubles or errors, such as the :hover in CSS or mouseover in JavaScript. The :hover selector is used to select elements when you mouse over them. The selector is mostly seen on links, however it is absolutely useless on mobile devices.
Switch between mobile website and desktop website versions
No matter how well is your website optimized for mobile, you should always include an option for your mobile visitors to view the standard website.
Speed up mobile site loading
The last but not the least, you should make use of fast mobile website hosting service which can great increase your page loading speed, reduce bounce rate, bring better user experience and higher SEO score.
