Browser Compatibility Test

Safari

Chrome

Firefox

I found that when comparing browsers between one another, there are quite a few differences that most people just never see.

One of the first major differences I found when I compared them all was quality of images that were loaded.

Chrome

Firefox

When we look at this little slightly off-center and titled button on my homepage, we see how on Chrome there is clear stair stepping on the lines, while Firefox doesn’t have this at all.

This becomes even clearer when you take a closer look at the edges of images, seeing slight stair stepping on Chrome but not anywhere else.

Another strange difference with Firefox this time was how some text was ever so slightly bigger than on Chrome or Safari.

Chrome

Firefox

While this one is much harder to see without having two separate windows open, text on Firefox will always look slightly different presented here than on Safari or Chrome.

These two problems are the most prominent I see when comparing Chrome and Firefox, with text always looking either slightly bigger on Firefox, or images and text feeling extra sharp on Chrome, creating a stair-stepping effect on most edges.

Safari, from what I found, tended to be the most consistent, having clear images and text throughout.

Phone

Tablet

We also see some differences on mobile and tablets as well.

One of the main differences I saw was how many aspects on the page need to be fixed to better accommodate mobile and tablet design. Things like the Learn More buttons sometimes going to two lines or images looking slightly longer than they should be some of the main problems.

Otherwise, everything looks fairly close to the original! I definitely need to go back in and double-check my mobile site soon so that people aren’t getting a worse experience through that medium.