I believe my baldness was caused by 2 factors. Genetics and having to get websites to render properly in Internet Explorer. Despite the fact that web standards exist I still find myself trying to adapt my website to different browsers and versions in addition to responsiveness.
Browser compatibility should be something considered when developing websites. If you’re looking to purchase a WordPress theme it’s important to think about this as you may lose potential visitors as a result of your website not rendering in previous versions of browsers.
From my personal experience I’ve found that less than 1% of visitors are still using earlier versions of IE9 and lower.
Personally I wouldn’t cater to this population still living in the stone ages but to some this might be a population worth marketing to. Especially if your niche is an elderly population who are likely not to be savvy enough to update their browsers you may want to consider this.
Despite the fact that many WordPress templates claim to be compatible with previous versions of Internet Explorer, it’s important to test this yourself, see if there are any conflicting plugins that will keep it from rendering properly and make necessary CSS adjustments.
Currently I was testing a WordPress theme called UDesign which is available on themeforest.com which claims to work in IE8 and above. While this is true to an extent, I almost sent a complaint to the authors about the theme compatibility until I realized the issue was caused by a plugin called Visual Composer which was included. In the themes demo the authors chose to use shortcodes instead of this plugin. As a result their demo worked in IE8. Having built my pages using Visual Composer I eventually discovered that it caused the site to not work properly in IE8 and lower.
This is why it’s important to test your website in different browsers, so that you can make sure you aren’t losing visitors due to compatibility issues that may arise during the development.
The latest version of Internet Explorer provides an emulator to test previous versions. Just hit F12 and select the desired version from the dropdown box to toggle between versions. Unfortunately this method of testing is not very accurate. It wasn’t until I tested a website on an old laptop running Windows XP with IE8 did I notice the issues that the emulator wasn’t able to pick up.
Aside from having an old laptop running Windows XP to test your website in earlier versions of Internet Explorer there is an easy way to do this by installing Oracle’s VirtualBox.
This open source software allows you to run multiple operating systems such as Linux, Windows, OS/2 and about 15 others on the same computer. Keep in mind that each instance takes up quite a bit of space.
With VirtualBox installed I can run multiple instances of IE 7 and 8 and correct any inconsistencies or issues easily. Any CSS changes should be made in a CSS file specific to the browser having formatting issues.
For instance if I want to make some CSS corrections to my site to improve how it’s displayed in IE8 then I would create a file called ie8.css and upload it in my CSS folder.
I would then add a conditional statement as shown below, placed above the tag which only executes the ie8.css file if the visitor is viewing their website using Internet Explorer 8.
As I’ve discovered recently there are some situations where the above call will not work. In this situation you can add custom code to the main CSS as follows:
/* css below will execute for all browsers */
Adding the \0/ after the parameter will execute the class in IE8 ONLY. See code example below:
/* CSS below will ONLY execute in IE8 */
I will create another blog to further explain how to create IE only stylesheets and how to add IE specific hacks to your stylesheet.