Why do we need to know this
Because a large proportion of the visitors to your site will be using a mobile phone or tablet. A site made for desktop does not look good or function properly on a mobile or tablet. A lot of websites out there at the moment are not mobile friendly which means their users are not getting the best experience and will be more inclined to leave. Google are now also penalizing non-mobile friendly sites in their search results, meaning your target audience will not even find your site while searching on a mobile or tablet. This results in a lot of missed sales as according to Mary Meeker of Internet Trends 2016 50% of web browsing is done on mobile or tablet.
How do I know if my website is mobile friendly
You could just minimize the window of your browser and resize it slowly to see how it behaves at different screen sizes, maybe adding the extension Viewport Dimensions to chrome to see what pixel widths your website is looking good at. See the table below for the standard sizes of mobile, tablet and desktop.
|<= 320px||iPhone, Samsung, LG,HTC 320 X 440||This is your mobile first default style if making a mobile first responsive website. At this size, space is precious and you should make sure that you have no more than 3 items in the navigation menu.|
|> 320px||iPhone, Samsung, LG,HTC 320 X 440,Motorola – 320 x 480,Motorola, Nokia Lumia
– 480 x 800
|This view port size is most used with phones in the landscape position. Make sure that the main content is above the fold as they say in the news paper industry. It refers to having important articles in the section above the fold in a news paper so that people glancing at it when its folded in two will see the important news.|
|> 480px||HTC 540x960 and Samsung/Motorola 720x1280||At greater than 480 we can start adding more navigation to the primary and some more images|
|>768px||Tables like HTC,Samsung,Motorola Ipad||At this size we need to ensure that the navigation and buttons are clickable|
|>=960px||Desktop, Laptop and some Tablets||This is the size that we want to display everything that we couldn't on mobile and tablet. As size is not a concern we can concentrate on good design.|
Alternatively you can run the Google Mobile Friendly Test and just enter your website URL and click Analyze. This will give you breakdown on whether your site is mobile friendly or not and also provides suggestions on what to do.