IE8 is a legacy browser

It seems only yesterday when all Web sites had to support Internet Explorer versions 6, 7 or 8. IE8 is the latest Microsoft-approved browser available for the once dominant Windows XP operating system. Yet times are a changing. Whichever way you measure Web browser market share, not only have Chrome, Safari and Firefox unseated IE from its former pre-eminence, but most IE users have moved on to versions 9, 10 or 11 and more important, Windows XP is no longer supported by its creator. In 2010 a group of Web developers organised a petition to persuade the UK government to move away from the old bete noire of CSS and Javscript geeks, IE6. Unfortunately, many just upgraded to IE7 or 8 rather than adopt a different browser. Officialdom’s much acclaimed love for equality and diversity does not seem to extend to browser choice. Overzealous IT managers seem to treat any applications without a Microsoft certificate of approval as potential threat to their tightly integrated ecosystem. Until recently, if someone chose to install an alternative browser, IT managers would consider them slightly subversive and potential troublemakers, not the kind of people who just do what they’re told and go with the flow or, in other words, dangerous free spirits. However, while Firefox speareheaded the original challenge to IE dominance in the mid twenty-zeroes, it wasn’t until Google introduced Chrome and Apple mass-marketed its iDevices running only Safari, that mainstream users became aware of competing browsers. We transitioned from a world where everyone just shopped at Tesco, except a few hippy outcasts who boycotted it, to a world full of colourful browser and device choices. Indeed for many the Internet is a just a means of accessing Facebook, Twitter, Amazon and a narrow set of other ubiquitous Web services. You may as well just use a dedicated app for an optimal experience on your device of choice, so instead of clicking on the blue e next to Window XP’s start buttom, you look for the Flogo on your new smartphone.

Here is just a short list of CSS and Javascript methods that IE8 and earlier do not support:

  1. Canvas and SVG: Canvas allows developers to programatically create and transform bitmapped images with Javascript. Scalar Vector Graphics can render any complex maze of geometric shapes, which combined with CSS and Javascript can yield infinitely scalable graphic interfaces and interactive games, e-learning applications, booking systems etc.. In the bad old days we needed plugins such as Adobe Flash, Java or Microsoft Silverlight to accomplish such feats.
  2. Video and audio tags: Together with SVG and Canvas these kill the need for external plugins or media players. Remember the days of Realplayer, Windows Media Player and QuickTime? Now their capabilities are built into browsers.
  3. New semantic HTML5 tags. Fancy tags names like <article>, <section>, <figure>, <figcaption>, <nav>, <aside>, <header>, <footer> may seem like syntactic sugar, but they make HTML not only more human-readable, but also let Web applications play nicely with search engines. IE8 and earlier require a special Javascript polyfill, which naturally makes IE8 even more sluggish.
  4. Media Queries: Not all devices are the same size. Today they range from smartphones to gigantic high definition monitors. So how do we deliver the same content to all devices, but customise the layout and relative spacing and font sizes to suit the target device? Using media queries, we can target different style rules at different screen sizes or even media types. Again a Javascript polyfill, Respond.js, can enable IE8 to correctly read media queries but it comes with a performance penalty.
  5. Root EMs: This unit lets developers rebase font sizes, padding, margin and line height relative to the root font-size, which can then respond to screen size or device size. REMs help overcome the compounding issue with EMs and some complex calculations with font-size inheritance. However, IE8 does not support REMs meaning in many practical cases, REM values have to be converted to pixel equivalents based on the default root font-size of 16px. This can lead to unnecessary duplication.
  6. CSS transitions: Now smooth transitions and simple animations can be managed entirely by CSS.
  7. Viewport Units: Until recently it was only easy to scale web pages by screen width, the height could either be given an absolute value in pixels with very different visual effects on different screen sizes or simply allowed to accommodate their content. Viewport units finally let us size layout elements and text in terms of the available screen size.
  8. Opacity and RGBA: IE8 only understands Microsoft’s proprietary filter syntax for transparent layers and does not support the alpha channel in background colours at all. As a result such styles have to be duplicated just for old IE and background colours can only be translucent if foreground colours and images are too.
  9. Border radius and box shadow: These stylistic effects are not as popular as they were a few years ago, but can now be effortlessly implemented in any modern browser with just 1 line of CSS. Old IE required designers to apply background images for such effects, leading to more CSS and more image assets.