How to test your website layout for different screen sizes

With the explosion of mobile website traffic in the past few years, it is important to make sure your site looks great on all screen sizes. When browsing on a smartphone or tablet, visitors expect your site to look great. Google has also announced that they will mobile design is a ranking factor in their search results. We discuss how to test your website layout for different screen sizes.
Testing Website On Different Screem Sizes
Testing the mobile readiness of your website is a key task when launching a new site and when maintaining your site. Not having a mobile ready site will cause you to miss a lot of traffic and will lead to unhappy visitors. So what can you do to test if your site is mobile ready?
Your Website On Mobile
The first thing to do is to check that Google identifies your site as mobile ready. Go to Google Mobile-Friendly Test and enter your URL. Google will then test your site to see if it thinks your site is mobile ready. If it is not you will need to change the design or create a specific mobile version of your site.
If Google sees your site as mobile ready you can then test to see how it looks on different screen sizes.
There are many different screen sizes for smartphones and tablets so it is unlikely that you will own them all. Luckily there is a website that allows you to see how your site looks on different devices.
Website on tablet
Go to mobiletest.mewhere you can see how your site looks on x different devices. These devices include phones from Apple, HTC, Nokia and Samsung. With the knowledge of how your site looks on each device, you can make design changes if needed.

What to do if your site is not mobile ready.

 
If your site is not mobile ready you really need to change the design. There are 2 options.
1. Move to a responsive design. A responsive design means that your site will adapt to different screen sizes automatically. If you are using WordPress most modern themes are responsive. You can find responsive themes for WordPress here.
Phone and Tablet Responsive Layout
2. Create a mobile version of your site. The other option is to create a mobile version of your site.
Having a site that looks great on smart phones and tablets is key to getting mobile traffic. The amount of this traffic is increasing everyday so it is imperative that your site is optimized for mobile.

  • Facebook
  • Twitter
  • Linkedin
  • Pinterest
This div height required for enabling the sticky sidebar
Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views :