Is there any cross-browser testing tool that is free?

I’ve tried browsershots.org but it rejects codepen.

If codepen blocks browsershots it’s likely to block any other similar tool.

Can you not upload your page to a website somewhere?

Testing for… what, exactly?

Huh… Is www.freehosting.com a reliable web host?

I don’t know, I’ve never tried free hosting, but given the price you could afford to try it and see…

They require registering a new domain or transferring your own domain.

I am curious to know if they accept free domains from “FreeNom.com

Hi there Chronzam,

why don’t you just use Chrome’s Toggle device toolbar

…or Firefox’s Responsive Design Mode

…for your testing your pages locally? :biggrin:

coothead

Those mode are for mobile devices.

I did not visit your link, so my assumption about it was
incorrect, I do apologise for this silly mistake of mine.

coothead

I reiterate my initial question.

What exactly are you trying to test?

There are tools to test things, but they can’t/don’t test everything website.

I thought a general “fact” was that the only true way to test a pages design was to use different browsers on different devices, different operating systems, that emulators were good but imperfect. Obviously, testing every device/OS/browser is impractical to the point of being impossible.

IMHO one of the better ways to approach this is to gather information about your site visitors and test design for them.

IMHO one of the best ways is to ensure that the page is error free - valid HTML and no script errors - and to check browser compatibility status when in doubt.

I remember when RWD first became a thing and I gathered user viewport dimension data. At the time, visitors were mostly desktop instead of mobile and I was impressed that the numbers were literally all over the place. I have not found it again, but I read about a mobile device that in addition to common values, let users set custom resolutions. i.e. any X and Y axis values, 0 to ∞ It was then that I stopped wondering if I needed separate mobile pages and decided I should learn about RWD.

When you think about it, even if only a small proportion of visitors have custom browser settings, there are just too many different possibilities to test them all. I imagine any “tester” is doing more not all.

2 Likes

I agree wholeheartedly with everything @Mittineague posted and use Google’s Free Mobile Testing utility because it also picks up desktop problems. Far quicker to use tool along with the free w3.org HTML and CSS validation checkers than testing in different browsers.

https://search.google.com/test/mobile-friendly

Edit:

Does anyone know of a quick and simple colour checker because I am “colour deaf”.

I believe that’s just what browsershots does, including dozens of browsers that were past their sell-by date yonks ago.

1 Like

Chrome’s testing utils are very good, but they can not fully emulate all the quirks and things (like image scaling or font rendering) that come with different devices and operating systems. The Chrome tools are good to build with, but there is no replacement for actually running your code on the device + OS + browser that you’re trying to test.

2 Likes

As others have mentioned the best way to test is to have access to he device and browser that concerns you.

These days you don’t really need to test older browsers (unless its IE) and even then I would be careful in supporting any browser that is not supported by its own vendor.

If you have a windows machine you can download IE11, Edge, Firefox, Chrome and Opera (and others) and test them all yourself.

If you have a mac machine you can add Safari to the list but won’t be able to test IE or edge unless you run something like parallels. The benefit of having a mac machine is that you can also download the Apple SDK which contains a simulator for all nearly all Apple devices which renders and acts 99.9% as per the original device.

Before I retired from web development had about 5 computers so I could do my testing easily and be sure everything was working. Its easy to accumulate old computers or laptops or simply keep your old ones when you upgrade. (I only use two computers these days with Windows and Mac systems so I can still play around and test modern browsers.)

However if you are a hobbyist or just learning then you can’t go to those lengths which is where forums like Sitepoint come in useful as there will be a variety of people testing things on different systems. You can usually get help on specific issues as someone hanging around is likely to have that system or browser.

As far as mobile testing goes then as mentioned you can test nearly all apple devices on the mac simulator but most people these days have at least one mobile phone so that can serve as a start for testing. Just put your site online and navigate to it on your own mobile device.

The devtoolos on Chrome, Firefox etc are good for testing responsive design and for testing that the layout fits certain devices but they are not exact simulators and indeed do not replicate the environment at all properly. You really need to test on the actual device to see correct behaviour and code interpretation.

However you can save an awful lot of time if you simply open and close your browser window slowly to see how your design reacts to less or more space. Fix those issues first and then you can go on to platform specific issues afterwards.

Unfortunately such is the life of a web developer :slight_smile:

2 Likes

< offtopic >

Here is a downloadable tool for Windows/MacOS…

https://developer.paciellogroup.com/resources/contrastanalyser/

…and an online tool for Linux…

https://contrastchecker.com

< /offtopic >

coothead

Many thanks for the links, I was hoping for a utility similar to the w3.org valiation tools where I could just insert a link and receive a report.

Edit:

Just been given the ideal page checker, courtesy of @coothead

https://achecker.ca/checker/index.php

…and another. thanks to @coothead, which checks colour readabilty, input link is way down near the bottom of the page:

https://webaim.org/articles/

1 Like

This add-on/extension…

Web-Developer Web Developer

…includes the same link via > Tools > Validate Accessibility. :winky:

coothead

2 Likes