Check the mobile version in Yandex. Mobile Optimization Checker. Google Search Console. Interactive elements are too close

There is such a thing, Google will soon (according to rumors - from April 21, 2015) begin to rank very poorly sites that have not passed the check in Google Webmasters for ease of viewing on mobile devices Oh.

It is not clear exactly, will the site have problems only if it is shown to mobile users, or even to those who logged in from a PC, that is, there will be a separate issue?

In essence, this almost does not change for sites that have half, or a significant part, of mobile traffic. Therefore, it is better to pass the test as quickly as possible.

I'll tell you how to do this:

Before	After

The first piece, which helped to resolve the issue without additional gestures.

In robots.txt add the line:
Allow: /wp-content/themes/ Template_Name/style.css

(If the file with styles is located at a different address, then write it. If there are several files with styles, then insert the lines for each file.)

Second moment if we see the message "Interactive elements are too close to each other." Shown at google.com/webmasters/tools/mobile-friendly.
It is just that in the styles the required class prescribes more indents for links and buttons. Grabs margin or padding of 5px or more.
Sometimes the Adsense block can create such a problem. Perhaps you need to insert a larger block, or with a larger font.

P.S. Initially, I expect that the primary was done by you.

Site versions are not only a possible whim of developers, an additional item of expenses (or earnings, if we talk about contractors) and a manifestation of concern for the visitors of the resource. According to the latest statements from Google representatives, sites that do not meet the requirements of responsive design will be pessimized in mobile searches. Domestic search engine Yandex also issued recommendations "How important it is to be mobile" and assured that, acting for the convenience of users of mobile devices, it will mark mobile versions in search results and give preference to adaptive pages.

So, developers must necessarily adapt sites for smartphones and check the serviceability of the resource display. Otherwise, in the near future you can expect the loss of a significant part of traffic, and therefore potential customers, because the new algorithms of work from Google and Yandex are already in effect. You can check the mobile version of the site different ways: By changing the browser when switching to developer mode, using mobile device emulators or web services.

Website friendliness for mobile devices

Adaptability to mobile devices is assessed according to various parameters. It is important to check the mobile version of the site not only in terms of correct display, it is worth considering other factors:

lack of animation, "heavy" design and pictures;
resource loading speed (should be minimal);
no need for horizontal scrolling;
lack of Silverlight plugins and Java applets;
simple site navigation;
the code contains the viewport meta tag.

If the above conditions are met, the algorithms of the most common search engines recognize the web page as suitable for mobile devices and increase the site's position in the search results in relation to resources that are not adapted.

Real testing on mobile devices

The most convenient way is to test the mobile version of the site on real smartphones. This method will allow testing under real conditions. Ideally, it is better to check a web resource on several devices, but if the project budget does not include the costs of purchasing several smartphones of the most popular models, an Android or Apple device will suffice.

Resizing the browser window

The simplest, but not optimal in terms of validation, is to resize the browser window. If the page is made using technology, you can check the mobile version of the site in this way. But in cases where a separate design is applied, the resource needs a clear indication that the user came from a smartphone, tablet or other mobile device. So, this way allows you to check the availability of a mobile version of the site. But the correctness of the display (in technical terms) is unlikely to be assessed.

Switching to developer mode in a browser

A more optimal way to check the mobile version of the site (Google or Yandex, as well as others search engines highlight adaptability in the list of the most important factors affecting the ranking) - this is to switch to developer mode in the browser. The method works in a similar way with multiple browsers:

Mozilla: You can switch to developer mode by selecting the "Responsive Design" option from the "Develop" menu; pressing the combination Ctrl+ Shift + M; by clicking on the "Responsive Design Mode" button on the web developer's toolbar;
Chrome: switch to mobile mode by pressing F12, then select the mobile version icon (smartphone in the upper left corner of the window that appears).

In Opera, you can switch to developer mode to check the mobile version by pressing Ctrl + Shift + i, but there is another way. A special version of the browser - Opera Mobile Classic Emulator - allows you to evaluate mobile design in many ways. Versions of the program exist for the main operating systems.

Mobile device emulators: Android Studio and Apple Xcode

You can check the mobile version of the site ("Yandex" and Google) using mobile device emulators, which for Android and Apple are respectively Android Studio or Apple Xcode.

Such tools quite accurately reproduce the site as it will look on mobile devices: the programs are preinstalled with the most common versions of browsers for mobile devices. However, emulators do not take into account the download speed and some other nuances that can be observed in real conditions.

To check it, just install one of the above programs on your computer and open the site from the emulator.

Mobile design validation web services

There are more simple ways check the mobile version of the site. For example, the Responsinator online service allows you to assess the correctness of the display of the resource on mobile devices and the convenience of using the site on the part of the user. The resource displays the site as it would appear in six different devices based on Android or Apple and in multiple orientations.

Checking the optimization of web pages for mobile devices

Other resources that allow you to check the mobile version of the site additionally assess the adaptability, and not only show how the site would look on different devices. The most reputable services are Google Mobile Friendly and Yandex WebMaster (checking web pages). Bing's checker, or the W3C's Mobile Checker, are also evaluating site optimization for mobile devices.

All that is required from the webmaster when evaluating the version of the site for mobile devices using online services is to enter the resource address and wait for the analysis to finish. Most of the above services test optimizations for the mobile-friendliness parameters listed above.

So, you can evaluate the adaptability of a web resource in several ways: from testing on real smartphones, tablets or other mobile devices or changing the size of the web browser window, checking in emulators or in the web browser developer mode and ending with using services from Yandex and Google. It is very easy to check the mobile version of the site comprehensively, and this will allow you to make the necessary edits and improve the site's position in the search results.

Greetings, dear friends!

Mobile gadgets have taken over the world. Today they don't even go for bread without a phone.

Nowadays, the Internet is developing rapidly. Rapid market growth mobile internet forces the creators of web resources to adapt their sites for this type of device.

My point is that if you want your site to be successful and popular, then you should think about how to make it easy to view on all kinds of gadgets.

In this article, I will tell you how to check a site on mobile devices using special services. I roughly divided them into two groups: free and paid.

They all work on almost the same principle:

go to the website of the developer of this or that service
download the software you need
run the application
and after a while the mobile version of your website is in front of you!

There are services that can test your site online.

The choice, as always, is yours!

Free of charge

Mobile friendly... This application was created by Google specifically to check if a web resource is optimized for smartphones and other gadgets.

Responsinator... Thanks to this application, you can easily see how the site looks like on Kindle, iPad, Android, iPhone.

Ipad peek... One of the most popular free tools testing, with which you can see the display of your own website on the iPhone and iPad.

Opera Mini Simulator... Opera emulator contains a very large database mobile gadgets... Its only drawback can be considered the lack of an online mode, that is, to test your resource, you will have to download and install the necessary software.

Gomez... Assesses the compatibility of your resource with mobile devices by 30 parameters, which allows you to get the most complete assessment. For free use, you must enter your contact information.

MobiReady... A great testing tool that measures responsiveness of a design. Verification is based on the best W3C (World Wide Web Consortium) standards.

Mobile Phone Emulator and Screenfly... Similar services that also make it possible to view the state of a web resource on the screens of any gadgets.

Paid

CrossBrowserTesting... Checks on 130 different browsers and 25 operating systems, including: Blackberry, Android, iPad, iPhone. To use it, you will have to pay $ 29.95 monthly.

BrowserStack... Provides quick access to a huge database. It costs up to $ 19 for one month, but there is also a free version.

Browshot... Designed for removal from Android, iPad, iPhone. You will have to pay $ 1 for five screenshots.

Perfecto mobile... Gives access to the database of tablets and cell phones, which allows you to see how well the optimization is on each type of device. For its use you need to pay up to $ 15 per day.

Multi-Browser Viewer... A cross-browser application containing mobile emulators and browsers for testing in any format. It costs up to $ 140, and there is also a free demo version.

DeviceAnywhere... An excellent tool that makes it possible to point-check web content by testing a resource in real time. It can be either paid ($ 100 per month) or free.

As you can see, there are a lot of programs and services, choose the most convenient option and use it to your health.

Mobile version for search engines

Sometimes the site displays fine on all mobile devices, but google search engines and Yandex does not recognize its portability. It's just that Yandex and google have additional requirements for the mobile version.

You can check the adaptation of the mobile version for Google using the Mobile Friendly service. I already mentioned it in the list of free tools.

And for Yandex there is a similar tool in the currently tested version of the webmaster's office (https://beta.webmaster.yandex.ru/).

Subscribe to the blog news and you will learn a lot of interesting and useful things. In the meantime, I say goodbye to you, see you in a new article!

Sincerely! Abdullin Ruslan

In the current article, we will talk about how the mobile version of the site is checked, its convenience, readability and correct display.

You can check your website for mobile usability using various web services. In particular, this service from Google allows you to adequately assess the literacy of your mobile layout.

Google recently announced that sites that do not meet mobile layout requirements will pessimize mobile searches. This algorithm is already working and some sites that did not bother to display on mobile platforms did indeed get dropped in the SERPs for mobile devices.

If your site is three times convenient for desktop platforms, you need to check the quality of the mobile layout, otherwise you will lose an impressive part of your traffic (the share of mobile platforms in search is growing rapidly every year), which means you will lose your customers. Therefore, you need to adapt your sites for mobile devices and check the correctness of the display of sites in mobile browsers.

Checking the quality of mobile layout using Google Chrome

For developers, Google has a great tool to simulate mobile devices. This tool is built into the browser Google chrome... To access it you need to click F12 in the browser (go to developer mode) and click on the smartphone icon:

The page is converted to device switching mode, where you can select one of the popular mobile devices, network type (GPRS, 2G, 3G, 4G, etc.), specify strict display parameters. This allows you to simulate the operation of the site on specific mobile devices. Among available devices includes different iPad versions, iPad Mini, iPhone, BlackBerry, Google Nexus, HTC, LG, Nokia, Samsung Galaxy and some other popular devices.

By choosing a specific device, you can check the site on a mobile device. For example, displaying home page site "Nubex" on iPad 3:

And on the Samsung Galaxy S4:

Here you can not only see the display of the site on a particular device, but also fully work with the site, as if the necessary gadget is in front of you. Undoubtedly, this tool is simply irreplaceable when developing a mobile version of the site, but how your site will be displayed on real devices - you need to check on real devices. This is especially important if you need to check the display of the site in "native" browsers (Safari - for iPad / iPhone, IE - for Windows Phone etc.).

Good afternoon friends. Today I will step aside from advertising tools a bit and start a new blog column. It is called "Webmastering" and will include useful materials on improving the performance and quality of the site, landing pages. I'll start with an overview of a cool tool for checking a website for mobility.

Checking site speed with Google

Google offers 2 tools for this.

# 1 PageSpeed Insights

I think you know him well. Insert a link to your site, press the "Analyze" button and get the result in the form of two tabs.

The tab "For mobile" includes a report on the speed of loading a site for mobile devices and - important! - convenience rating site for smartphones. The tab "For computers", respectively, the same analysis for the desktop.

The best part is that the service allows you to download optimized images, css and scripts to use on your site. Here is such free help from google.

As you can see from the screenshot, I am having serious problems with the mobile version. How are you doing?

# 2 Testmysite.Withgoogle

In fact, this is the same tool, it just has a beautiful wrapper. I discovered this service the other day and was bribed by the reporting form.

When you insert a link to the site and click "Check", the service will offer the result in the form of a full-fledged dynamic landing page, on which it will succinctly and convincingly tell you how things are with the site and offer to download the full report.

Of course, I asked for a full report and received it by mail in a couple of minutes. It looks sensible, several screens of useful instructions with links to specific materials:

It is noteworthy that if you analyze the same site, then the figures for these tools will differ slightly. However, they work on the same technology.

This is how in just a few seconds you can not only check the site for mobility and check the loading speed - but also download a full-fledged report with optimized content. Is free. From google

Well, how are you doing with mobility?