MAKE SURE YOUR Website's Cross Browser CompatibilityPosted by Bowden McKinney on May 17th, 2021 I was recently contracted to edit a clients existing site, a very professional looking site which probably did not come cheap. Beautiful graphics, effective in its marketing theory and powerful at conveying messages. But the first thing I noticed once the page loaded was a misplaced graphic. The problem was in the code, Firefox was having some trouble reading it. I checked in Internet Explorer, sure enough, it was fine. Seems the designer worked in WEB BROWSER and hadn't checked they layout in other browsers. Because the client also uses IE, neither of these knew concerning the design flaw... but for 46% of the web viewing population, these were seeing this as their first impression. It is important to check for cross browser compatibility which means that your sites design, and more importantly, your message isn't lost in browser translation. For designers, developers and webmasters, it's assumed by the client that your job will undoubtedly be done professionally and their site is wonderful for everyone. Here are four steps to ensure that your site is cross browser compatible. 1. Use Clean Valid Code Whether utilizing a template or creating your personal design, I cant stress the importance of clean, valid code. When your code is valid, a browser knows how to proceed with it. Cleaner code helps se's crawl through your information more easily, and gives your visitors a better 'as-intended', faster loading experience. For Additional info , search for a reference to HTML/CSS validity. For programmers, check w3schools for mention of valid code. If you eventually opt to use a little bit of invalid code, understand the purpose of that code, then check and check, in multiple browsers, that it is not messing up your pages. 2. Validate HTML/XHTML Run your website through W3's HTML Validator. When I started writing code, my pages would keep coming back with hundreds of errors. Validation could be a long, arduous process. Starting with good code might help avoid major headaches (for you personally and your clients). It can be tricky to get errors in code. The Validator reports each error by line number. The actual line of code the error is on may also be hard to find, and will become even harder when working with PHP software (such as a WordPress theme) that pull pages together from separate files. If you proceed through errors with patience, I believe a person with basic html knowledge can get through validation with just a little practice. Don't Give Up. 3. Validate CSS Next, run your site although CSS Validator. This tests for CSS level 2.1. CSS3 can be acquired and employed in many browsers. Obviously CSS3 won't validate here, but Personally, i feel that its Wii enough reason to ditch CSS3. Just make sure to sign in your browsers to see if it works as intended. 4. Check with BrowserShots.org Most users have either Firefox or WEB BROWSER on the local machine so its easy to test your designs. But what about all of the other browsers available? Because of BrowserShots.org, you don't need to install every browser to know what your site looks like. Check the browsers you would like to test from their list, let the site do its job, and they're going to take a screenshot and demonstrate how your pages look in each browser. Be patient, it takes a while to deliver your screenshots.Like it? Share it! More by this author |