What is important to pay attention to when cross-browser testing. What is important to pay attention to during cross-browser testing

When it comes to exploring the web, Internet users have a wide variety of browsers to choose from. It is the responsibility of website designers and developers to ensure that the project is compatible with all kinds of browsers. Perhaps in the future all web browsers will render HTML/CSS code in the same way and in accordance with the standards. Then cross-browser verification will not be needed. But this is not yet achievable, so checking your project in modern and old versions of browsers is a must. Of course, if you have a lot of time and computers with different versions of operating systems and browsers, you can check the site for them. But there are also more efficient ways. In recent years, quite a few web services have appeared that developers and designers can use to quickly and easily do cross-browser testing. Some of these services take screenshots of your site in various browsers, others work as virtual machines. Let's consider some of them.

Browsershots

This service supports a large number of browsers - more than 164 combinations of browsers on four operating systems (Windows, Mac, Linux, BSD). Some of them may not even be needed. It is unlikely that there will be a user who works in the Dillo or Kazehakase browser on the BSD operating system, although you can still check.

By default, Browsershots checks on the latest versions of browsers, but older versions are also available. The more browsers that are defined for testing, the more time it will take to prepare the results. When choosing a test kit, this fact must be taken into account.

Browsershots provides paid and free services. However, the free service is quite slow and there is a limit on the number of screenshots you can request per day.The paid version is $29.95 or €23.95 per month and you can get 30 to 50 screenshots within two to five minutes.

When it comes to exploring the vastness of the global network, Internet users have a very wide choice of browsers ("browsers"). It is our responsibility as website designers and developers to ensure that the website is compatible with all kinds of browsers, in other words make the site cross-browser compatible.

But the question immediately arises - what browsers do users use? Now the most popular "viewers" of web pages are Internet Explorer 7 and 8, Mozilla Firefox, Google Chrome and Opera. However, for each type of site, depending on what subject it belongs to, the percentage of visitors with different browsers can vary greatly. Therefore, quite often, developers determine which audience they have to work with and, depending on the results, “prepare” the site only for certain types of browsers.

Of course, it is almost impossible to test a site on one machine, even with several types of viewers installed. But thanks to special tools and web services, you can easily determine how the site looks in a particular browser on different operating systems.

In this article, we have prepared for you a series of online tools and services, which can be safely used when testing the cross-browser compatibility of the site.

There are other services to check cross-browser resource but these are the main ones.

Hi all!

Today we will talk about the most important topic that directly affects behavioral factors (and therefore, site traffic and the amount of traffic from search engines) - how to view the display of the site in different browsers.

All of you probably know that there are several popular browsers (Safari, Chrome, Opera, Mozilla, etc.) of various versions. There are a lot of browser versions, because they are constantly updated, corrected, improved, and this happens really often. As a result, everything leads to the fact that there are more than a hundred programs for accessing the Internet. And this is bad because they are not consistent with each other: each browser perceives the html code (the one on which the sites on the Internet are written) in its own way.

That's why The display of the site in different browsers is different.. Because of this, various troubles arise: tables are displayed ugly in some browser, sidebars move somewhere, somewhere the site does not fit in the width (and horizontal scrolling appears).

You probably understand that all this will lead to one thing: the visitor will close the browser page with such a site and most likely will not return here again. Search engines will interpret this in their own way: “the site is not interesting to users, why then send visitors to it?”. In general, this will lead to the fact that the traffic from search engines will decrease, the position of the site will fall. The problem is urgent, and it must be dealt with.

Checking the display of the site in different browsers

There are special services that allow you to check the display of the site in several different browsers. They are still few, so you have to be content with what you have.

How to avoid problems with browsers

The only way to avoid problems with browsers is to use cross-browser layout. In this case, the source code of the site is processed in such a way that it looks approximately the same in all programs of all versions.

The most important rule in cross-browser layout is to specify percentages instead of pixels wherever you need to specify the sizes of blocks or parts of the site. The fact is that percentages are a relative (dynamic) value that does not depend on the screen width, its resolution, browser type, etc. And pixels are a static value that can be displayed in different ways.

The easiest way is not to carry out cross-browser layout yourself, but to entrust it to a layout designer, because he has more experience, he will do it faster, and you can make a lot of mistakes. I hope this article has opened your eyes to this important topic.

One of the standard customer requirements for developing a high-quality website is cross-browser compatibility and correct display on numerous modern devices. Therefore, every web developer sooner or later faces the issue of testing the website in different browsers.

» Crossbrowser compatibility- the property of the site to be displayed and work in all popular browsers is identical. Identity is understood as the absence of layout breakdowns and the ability to display material with the same degree of readability. The concept of “cross-browser compatibility” is very often confused with pixel-by-pixel matching, which are actually different concepts. (Wikipedia)

There are many different ways to test your site across different browsers and operating systems. For example, online services, local applications, installing multiple browsers on your computer, etc. There are paid and free services. In this review, we will draw your attention to the most optimal free and paid services for checking your site in different browsers and on different devices.

1. Browsershots (Free/Paid)

4. IE Tester (Free)

5. BrowserСam (paid)

BrowserCam- Very powerful paid online service for testing websites any browser and any platform. One of the main "chips" of this service is that it provides remote access (via VNC) to computers with already installed operating systems and browsers in which you can test your site. In addition, there is such an important option as testing under iPhone OS, Android, Blackberry, Windows Mobile. You can also test e-mails on different devices, which is very important for mailing companies.

Prices start at $19.95. per day depending on functionality.

6. CrossBrowser Testing (paid)

7. Litmus (paid/free)

8. Cloud Testing (paid)

— a paid online service that provides the ability to functionally test the site's cross-browser compatibility. You write a user behavior script with your browser and Selenium IDE, upload it, then Cloud Testing will run this script on multiple browsers and operating systems. He then provides screenshots.

Pricing policy starts from 99 c.u. per month .

9. Mogotest (paid)

— paid online service, which provides the ability to fully test cross-browser compatibility, including for private pages. An API is provided so integration into existing tools and workflows is possible.

Pricing policy starts from 15 USD. per month for individuals. At the same time, there is a possibility free to test selected package (trial version) 14 days.

10. Multi-Browser Viewer (paid)

Multi-Browser Viewer is a paid application that works with desktop and mobile browsers and includes 26 virtualizable browsers, 5 mobile browsers(including iPhone And iPad) And 61 screenshot browser(with their help you can see how the pages are rendered, but you can not see the result of user interaction with the site).

The pricing policy of Multi-Browser Viewer is 139.95 USD. for a single-user license and includes one year of products and updates. Also available free trial version of the program(14 days).

11. Sauce Labs (Free/Paid)

12. Spoon (Free)

13. Browsera (Free/Paid)

is an online service that automates cross-browser testing. It automatically detects differences in how pages are displayed by browsers, thereby simplifying the testing process.

The free version includes a fairly limited number of browsers and a low resolution. Paid packages start from 39 c.u. in 14 days and from 49 c.u. up to 99 c.u. for a monthly subscription.

—
When using this material, an active link to is required.

Crossbrowser compatibility- the property of the site to be displayed and work in all popular browsers is identical. Identity is understood as the absence of layout breakdowns and the ability to display material with the same degree of readability. The concept of "cross-browser compatibility" is very often confused with pixel-by-pixel correspondence, which are actually different concepts..

There are many different ways to test your site across different browsers and operating systems. For example, online services, local applications, installing multiple browsers on your computer, etc. There are paid and free services. In this review, we will draw your attention to the most optimal free and paid services for checking your site in different browsers and on different operating systems.

1. Browsershots (Free/Paid)

Browsershots is a web service that takes screenshots of your site in different operating systems and browsers (65 browsers are available in total). This is a convenient, albeit rather slow, way to check your site in many browsers at once. When you enter your site's address into the test field, it is queued for testing. After that, the screenshots will appear on the final page in turn. This may take from 5 minutes to 2 hours. In the free version, everything is pretty slow. In addition, one session (request) can only last 30 minutes.

It should be noted that this site has a multilingual interface (including Russian and Ukrainian.)

However, although this service is advertised as free, it also has paid services. For 29.95 c.u. per month you will receive the so-called "priority processing": screenshots will appear much faster than in the free version, you can get from 30 to 50 screenshots in just 5 minutes. In addition, only you will see your screenshots, while in the free version they are eventually laid out in the general feed.

2.Adobe

Until March 2013, Adobe had an excellent free Adobe BrowserLab service for testing the site in different browsers and systems. But now it's closed and instead the new Adobe Edge Inspect CC service is introduced.+

Adobe Edge Inspect CC is a product that is part of a fundamentally new organization of Adobe products - the Adobe Creative Cloud. You can get an account in this cloud using several packages, all of which are paid. The average one costs $49.99. per month. You can try Adobe Creative Cloud for free for 30 days.

3. IE NetRenderer (Free)

IE NetRenderer- a free online service only for the Internet Explorer browser, which allows you to check your site under the Internet Explorer browser versions: 9, 8, 7, 6, 5.5.

Everything is simple here: enter the address of your site, select the version of IE and immediately get a screenshot.

4. IE Tester (Free)

IETester is an absolutely free application only for the Internet Explorer browser that allows you to view the site locally on your computer in different versions of Internet Explorer (versions: 10, 9, 8, 7, 6, 5.5) under Windows 7, Vista and XP operating systems.

To do this, you need to download IE Tester and install it on your computer.

5. BrowserСam (paid)

BrowserCam- a very powerful paid online service for testing sites under any browser and any platform. One of the main "chips" of this service is that it provides remote access (via VNC) to computers with already installed operating systems and browsers in which you can test your site. In addition, there is such an important option as testing for iPhone OS, Android, Blackberry, Windows Mobile. You can also test emails on different devices, which is very important for mailing companies.

Prices start at $19.95 per day depending on functionality.

6. CrossBrowser Testing (paid)

CrossBrowserTesting- also a very functional paid service, where you can check the site in a few minutes in different browsers, on different operating systems, on different devices (more than 100 verification options are supported, including testing for Android, iPad, iPhone).

The pricing policy is more profitable and flexible than that of the previous BrowserCam service: the base price starts from 29.95 USD. in Week. In addition, a free trial period of 7 days is given for each of the three packages, although with a somewhat limited quota than in the paid version.

7. Litmus (paid/free)

Litmus- an online service that provides the ability to test the site on different browsers. In addition to providing screenshots, at the same time it checks the validity of html and css code. Its peculiarity is that it is mainly focused on testing e-mails in different browsers and on different devices. It is possible to test email in 30 different email clients and other important features such as email analytics.

The paid version of the service involves three packages: basic ($49 per month), plus ($99 per month), premium ($299 per month). The free trial version is valid for 7 days.

8. Cloud Testing (paid)

cloud testing- a paid online service that provides the ability to functionally test the site's cross-browser compatibility. You record a user behavior script with your browser and Selenium IDE, upload it, after which Cloud Testing will execute this script in multiple browsers and operating systems. He then provides screenshots.

Pricing policy starts from 99 c.u. per month.

9. Mogotest (paid)

Mogotest- a paid online service that provides the ability to fully test cross-browser compatibility, including for private pages. An API is provided so integration into existing tools and workflows is possible.

Pricing policy starts from 15 USD. per month for individuals. At the same time, it is possible to test the selected package (trial version) for free for 14 days.

10. Multi-Browser Viewer (paid)

Multi-Browser Viewer- a paid application that works with desktop and mobile browsers and includes 26 virtualized browsers, 5 mobile browsers (including iPhone and iPad) and 61 screenshot browsers (with their help you can see how pages are rendered, but you can not see the result user interaction with the site).

The pricing policy of Multi-Browser Viewer is 139.95 USD. for a single-user license and includes one year of products and updates. In addition, a free trial version of the program (14 days) is available.

11. Sauce Labs (Free/Paid)

Sauce Labs- an online service that provides access to a variety of browsers on different operating systems and establishes a connection between your browser and a configured virtual machine.

The service provides paid packages (prices start from $49 per month), in addition, there is a free testing quota: 200 minutes per month and allows you to create automated testing tests in browsers (using Selenium).

12. Spoon (Free)

Spoon is an online program emulation service. Provides free access to Firefox, Chrome, Opera and Safari for Windows users. Different versions of Firefox, Chrome, Safari, Opera browsers are available. Technically, Spoon supports IE virtualization, but this feature has been disabled at the request of Microsoft.

13. Browsera (Free/Paid)

browser is an online service that provides automation of cross-browser testing. It automatically detects differences in how pages are displayed by browsers, thereby simplifying the testing process.

The free version includes a fairly limited number of browsers and a low resolution. Paid packages start from 39 c.u. in 14 days and from 49 c.u. up to 99 c.u. for a monthly subscription.