Guidelines for Making W3C Compatible Mobile Websites

W3C MobileOk Checker performs tests on a web page to determine its level of mobile-friendliness.

This also helps in page speed.
Following are some basic guidelines to make mobile sites W3C compatible.

  • The total size of the page should not be exceeded 20 kilobytes (Primary document, Images, Style sheets)
  • Big pages require a possibly high cost and a long waiting time in many mobile networks. For instance, on many mobile networks, downloading 100KB worth of data takes as long as 1 minute.
  • Scale down images to a reasonable size. Remove images that are not essential to the layout of the page.
  • Make CSS & Javascript external. Eliminate inline CSS & javascript code. It increases page size as well as blocks initial content from loading.
  • <input type=’image’> assumes that the user will click on a specific area of an image, which is not possible on many mobile devices. So don’t use the image input type, try to use another input mechanism like “button”, “submit” or <img> etc…
  • The size of the document’s markup should not exceed 10 kilobytes. Mobile devices have limited screens. Long pages on small screens are confusing, because users can’t see the big picture and feel lost. The 10Kb limit ensures that the page is still usable on devices with small screens. Continue reading

Best Techniques for Web Page Load Time Optimization

Followings are some best techniques to speed up your websites:

1.    Include CSS in head – always render CSS file in the head section

2.    JavaScript in footer – move JavaScript calls to web page footer.

3.    Avoid inline CSS and JavaScript expressions. It increases html size and http

4.    Avoid duplicate CSS & javascript code. Keep optimized files.

5.    on window.onload

a. Render heavy JavaScript based objects on window.onload event. Like

  • JS widgets
  • Social media sharing buttons scripts

It will help to improve web page content loading time.  Once browser completed rendering of main content then objects written on window onload event will be rendered into background and doesn’t require user to wait for them

Continue reading