What major precautions should I keep in mind for my application to work correctly on different browsers?

8

I run small systems using xhtml, ajax, and php. When I code I'm testing the parts in the Chrome developer tool (Ctr + I) and phptester.net. When I finish my application, I have to debug everything again so that I can properly run Firefox and Internet Explorer . What major care should I take to minimize this final debugging?

    
asked by anonymous 09.09.2014 / 23:37

2 answers

12

Features that are not in the default setting of HTML , CSS and JavaScript are solved differently by each browser; and even standardized features are sometimes also solved differently, either by bug or by vendor decision.

We developers have used HTML5 for example, but this version of HTML is not yet released so it is with specific features of this version that we have more difference in behavior between browsers (what is not closed is supported differently by each browser, or even supported).

So unfortunately there is no magic: you will have to continue testing and adapting your code so that it fits well in all browsers, and the richer you want your user interface, the more incompatibilities you will encounter (since the most basic features already are mature and standardized among browsers).

Some practices to minimize your rework:

  • Draw your page to look good even with layout differences between browsers (using fluid layout rather than fixed positions and sizes, for example).

  • Choose a browser as your "recommended". Use specific features to enhance the user experience in this browser, but do not let your application depend on this feature to work (the application will work in an alternate way even if it is less cool when it is not running in the "recommended" browser).

    li>
  • Use frameworks that abstract behavioral differences between browsers (for example JQuery).

  • When using a feature or library or framework check which browsers and their versions it supports.

10.09.2014 / 00:15
5

Complementing @ Caffé's answer:

In the specific case of Javascript, you can use a test framework , such as qUnit (from the same team of jQuery).

With it, you can write tests that ensure that your code works correctly. And as it runs right in the browser, you can rotate it in each of the browsers to check if everything is OK. But remember that depending on how your application is structured, it can be difficult to test it. The more modular the better.

You may want to read more about Test Driven Development .

And as @ Caffé has said, usually the developers of frameworks and libraries like jQuery , Bootstrap , Foundation , etc. have already tested your codes on different browsers. So, working on them usually lessens the scope for problems.

I particularly also recommend avoiding excessive use of Javascript. Generating HTML on the server is easier, including maintenance. Use Javascript for what's really needed.

    
10.09.2014 / 20:37