Don't miss these Blodger posts!

Thursday, 6 December 2012

Top tools for best screen design

Once you have your first cut of your site which you have tried to build in accordance with the previous sets of rules, or if you have redesigned your site to optimise it, then try these tools to check your site.

The Google browser size tool at is useful for seeing what the percentage of people can see what on your site without having to scroll - but being phased out for Google analytics new tool.

Click on images below to enhance view.

Google browser size site showing what can be seen at each resolution
Soon to be redundant Google browser size.

Google analytics displays a different version for sites as below

Google Analytics screen usage displaying
Google analytics version

Note how the single advertisement in this site was placed in area where only the top bit was "above the fold". The Google tool also gives percentages of  where clicks are occuring most and in this example also states that there are 11% of clicks taking place below the fold. It shows how the majority of people stick to the landing area

Incidentally Google also gives mobile users a web site where they can type in a web address and it will try and convert any site to a mobile readable web site.

You can also see what your site look like on a mobile device on for example by using a site such as HowtoGoMo

HowtoGoMo site displaying on mobile device
HowtoGoMo displaying a site via a mobile

Another key issue is how to deal with Accessibility and for example laptop users who don't use a mouse. Awareness is needed to ensure for example that ALT tags are filled in images for example

Use tools such as and type your site into this. Using major frameworks such as Blogger and Wordpress should deal with many of issues as they have considered much of this in design of frameworks.

Whenever you design or redesign test your site and use these tools to ensure high grade landing area.

Previous posts were:


Blodger Copyright © 2010 LKart Theme is Designed by Lasantha

Downloaded from Free Templates

Modified to LK Magazine v2 Pimp No6 and Copyright © 2013 by Blodger