Related Websites: SciFiNow | iCreate | HD Review | Digital Photographer | Digital Camera Buyer
All Apps
Dreamweaver
Flash
Photoshop
 
Home
Podcasts
Blog
Shop
About The Mag
Magazine Sample
Latest & Back Issues
Contact Us
WD Forum
Subscribe
 
Main Features
Main Interviews
E-Commerce
Creative Careers
Tutorial Files
Website Gallery Awards
All Time Greatest Sites
Web Hosting Guide
Top Website Lists
Agency Profiles
Recommended Links
 
Imagine Website
Imagine Subscriptions
Imagine Shop
   
 
 
 
 
 
 
 
 
 
 
Which next-gen browser?
We survey the latest versions of the web’s hottest browser brands and identify features that will impact the way you work today and tomorrow
One of the problems the internet has always faced is also regarded as one of its biggest strengths. Nobody owns it, and to a greater extent nobody has the authority to govern or dictate it – if such a notion was possible.
The framework it is built on is open and you don’t need to have any kind of special licence to build content for it. What’s more, the commercial forces that compete for online territory don’t have to agree on how they operate. This has never been more unfortunate than within the browser market, where some of the world’s biggest software companies struggle to become your favoured window onto the world wide web. All claim first and foremost to offer the best viewing experience, with faster and more secure performance for demanding consumers – but what about the support for the developers building the content?
This is where things get more alarming. You see, the considerations for what goes on under the hood tend to be brushed under the carpet and discretely ignored. What then transpires is that web designers and coders suddenly make disgruntled noises about the lack of genuine CSS support, odd interpretations of the document object model (DOM), horrible little holes or glitches and God knows what else. Sadly, this strife isn’t merely confined to the beta release phases of the new Internet Explorer, Firefox, Opera, Safari et al, but instead becomes a characteristic that developers have to put up with. So why don’t we just stop whingeing and boycott the troublesome browsers until they take notice? Nice theory, but if your hated browser happens to have a decent market share of users, then alienating them with an unforgiving website could be fatal. Instead, we’re forced to find workarounds that make things work across as many browsers and devices as possible – even Dreamweaver automatically adds code!
So seeing as we’re checking out some of the new CSS3 tags this issue, we thought an overview of the features and specs for the current generation of browsers might be a useful idea. Primarily with developers in mind, we’ll briefly describe the publicised merits of Internet Explorer 8, Firefox 3, Opera 9.5 and Safari 3, while looking at where they sit in regards to the popular Acid standards test.


INTERNET EXPLORER 7 & 8
As the world’s leader can Microsoft show everyone the way with its latest browers?
As the unmistakeable leader of the browser market, Microsoft’s Internet Explorer would naturally bear the brunt of bad press. Popularity is a doubleedged sword when it comes to aspects of security, a particular bone of contention for IE as attackers will always target the commonest denominator – but what about web standards? Sadly, Microsoft’s ability to almost guarantee ubiquity by packaging the client with Windows hasn’t seen it adopt the moral high ground when it comes to supporting established development rules either. For example, version 7 is known to support a mere 54 per cent of the CSS2.1 specification, which is some 40 per cent behind equivalent estimates for Firefox and Opera. As you’ll see from our boxout, this is also reflected in the results of recent Acid tests and arguably the worst performance of Acid2 and Acid3 out of the bunch. What also seems evident is that different versions of IE don’t tend to improve the level of web standards support from the one before, or are at least erratic in terms of the issues addressed. One of the things this means for developers is that they must code certain hacks into pages optimised for IE versions whereby the browser selects what code to run from a series of switch statements only it can read. These are known as conditional comments:
<p><!--[if IE]>
According to the conditional comment, this is Internet Explorer
<![endif]-->
<!--[if IE 4]>
According to the conditional comment, this is Internet Explorer 4
<![endif]-->
<!--[if IE 5.0]>
According to the conditional comment, this is Internet Explorer 5.0
<![endif]-->
<!--[if IE 5.5]>
According to the conditional comment, this is Internet Explorer 5.5
<![endif]-->
<!--[if IE 6]>
According to the conditional comment, this is Internet Explorer 6
<![endif]-->
<!--[if IE 7]>
According to the conditional comment, this is Internet Explorer 7
<![endif]-->
Similarly, you will have noticed when coding script for multiple browsers that often referencing the page document object model can be tough. In simple terms, this often affects how JavaScript can interact with elements such as text boxes, images, forms, object arrays or whatever. Internet Explorer uses the Trident layout engine and therefore renders or builds pages differently, which then impacts on universal DOM rules. A typical hack here has been to code browser identity checks into scripts to use specific DOM calls where needed and work around such inconsistencies. The example below shows how checking the browser name can be used to load an Internet Explorer optimised page instead of the normal Index:
<script language=”JavaScript” type=”text/JavaScript”>
if(navigator.appName == “Microsoft Internet Explorer”)
{
window.location = “ExplorerIndex.html”
}
window.location == “Index.html”
</script>
The real message here is that Internet Explorer has contributed to a negative trend of code ‘hacking’ to overcome standards neglect. This creates a very disjointed approach and something not many web developers would advise, instead recommending better crossbrowser testing of content and stripping back of the features that cause grief. Throw into the mix that Internet Explorer 8 will eschew many of the workarounds needed for version 7 and you’ve got even more of a balancing act to maintain!
VERSION 8 BETA
The good news is that early signs of Internet Explorer 8 suggested Microsoft was going back to the drawing board on standards support. It took great pride in releasing the beta version to the public at its MIX developer conference in March, showing how webpages rendered exactly the same as its contemporaries – wow, finally! However, reception of the new version has been lukewarm to say the least, with doubts over commitments to fully support CSS2.1 and even more worries over support for CSS3. Only a few selectors are known to feature for the latter, although we should remember that the browser remains very much a work in progress. At the moment it can claim an Acid2 test pass, but does horribly on Acid3 despite all the other older clients gaining much higher scores.
Another point to bear in mind is our earlier one about catering for different versions of Explorer. The beta of version 8 lets users switch between ‘standards mode’ and an emulation of the quirky IE7 so that the enhancements don’t effectively ‘break the web’. However, there’s also a provision made for developers who wish to declare or force the rendering engine that the new browser should use so as to get the intended result. This ‘meta switching’ idea is essentially a more robust and simpler way to hard code compatibility, and involves placing a line similar to the one below in the <head> of your document’s page:
<meta http-equiv=”X-UA-Compatible” content=”IE=8” />


OPERA 9.5
Small but perfectly formed, this is one cult phenomenon that seems determined to bring high levels of standards support to the masses
Developed originally as a research project in 1994 at Norwegian telecommunications firm Telenor, Opera was first released as a browser to the public in 1996. Version 2.0, as it was christened then, only ran on Windows, although it was quickly ported for other devices and platforms in the following years. Mobile support has subsequently become a key part of what the browser represents commercially, with the Opera Mini version for mobile phones proving hugely popular alongside clients built especially for the Nintendo DS and Wii consoles.
With the desktop version now open to Mac and PC users, Opera boasts a meagre but devoted market share of approximately one per cent – although it remains highly regarded for being a trailblazer of new features and standards compliancy. In fact, previous iterations up to version 9.5 have often had to include capabilities for improving the rendering of standards bereft websites, simply because Opera adheres to and supports them so strictly. It is credited as being one of the first to implement CSS and currently claims support for the following:
HTML 4.01, XHTML 1.1 (plus Basic, Mobile Profile, +Voice), HTML 5 (partial) CSS2.1, CSS 3 (partial)
WML 2.0, XSLT, XPath, XSL-FO, ECMAScript 3 (JavaScript), DOM 2
XMLHttpRequest (see box out), HTTP 1.1 Unicode, SVG 1.1, GIF89a, JPEG and PNG (with alpha)
If you check out our Acid testing section of this feature, you’ll spot that Opera 9.5 gets the best score of the bunch – despite only managing 83/100.
It’s worth pointing out that the visual result is easily the most coherent of all four and that the Opera team claim to have nonstable development versions achieving maximum marks. Also from the list, you’ll see that Opera has partial support for HTML 5, when in fact it is reported to lead the way with support for the new specification:
Canvas element
contentEditable
Cross-document messaging
Element.tabindex attribute and the Element, {blur, focus} methods getElementsByClassName
Embed and Video
Navigator.onLine attribute and the Window, {online,offline} events Server-sent events
Web Forms 2.0


SAFARI 3.1
Apple’s own OS X browser doesn’t do much shouting when it comes to standards support – so what’s it like and where’s it going next?
Apple released Safari 3.1 in March with an updated rendering engine that boasted speed gains over already impressive performance times. In accordance with literature released at the time (http://docs.info.apple.com/article.html?artnum=307467) it also added some next-generation standards support too, including basic animation effects with CSS transforms/transitions and the much touted <video> and <audio> tag elements expected in Firefox 3.1:
<video src=myMovie.mov autoplay>
</video> //example of HTML 5’s video tag
@font-face {
font-family: JuicyFruit;
src: url(‘JuicyFruit-Regular.ttf’);
} //example of CSS3’s @font-face
In addition to adding the @font-face CSS3 attribute (above) for facilitating custom typefaces regardless of system install, the browser has also implemented offline storage facilities for web application development. This HTML 5 addition could be big news for RIA builders and emulates the likes of Adobe AIR and Google Gears whereby caching of data allows for offline operation. We can’t unfortunately find any evidence of this facility being demonstrated properly yet and it’ll be a while before any of this stuff goes mainstream while waiting for the other browsers to catch up.
VERSION 4
There’s not much concrete information about where Apple will take its browser from the current version 3; however, speculation is rife. Here’s a look at some of the key areas being talking about…
JavaScript speeds gains of 53 per cent
Set to appear in the forthcoming Snow Leopard update of OS X
Ability to save webpages and launch them from the desktop. These site-specific browsers or SSBs are effectively UI-reduced clients that provide direct access to web apps
Incorporation of various CSS-based graphic improvements, including gradients, masks and reflections


FIREFOX 3
As the main contender to the browser crown does Firefox look so rosy to web developers?
With a reputed user base of just under 20 per cent worldwide, Firefox is the most popular browser after Microsoft Internet Explorer 8. A product of the Mozilla Corporation and available freely under an open-source licence, it started out as a client known as Phoenix in 2002 and was only released under the Firefox moniker in 2004. Recent versions, including the latest third, have largely been characterised by tabbed browsing, the ability to install extensions that add additional functionality and a wellpublicised edge over Internet Explorer when it comes to security.
In terms of standards compliance and page rendering, Firefox uses the Gecko layout engine to implement current specifications and pre-empt those likely to be introduced at a later date. Mozilla actually does a great job of informing developers of new nightly builds and bug fixes on its Bugzilla forum (https://bugzilla.mozilla.org), where notifications on new developments for future versions are also posted.
As far as the current version goes, it manages a 71/100 in Acid3 and boasts a number of new features or additions of interest to developers:
HTML 4 - <script> tag must have a closing (/script) tag
JavaScript 1.8 – Script object made obsolete and no longer supported
Microformats – global Microformats object added for accessing API
HTML 5 – drag, dragend (events) and activeElement, hasFocus (DOM attributes)
DOM – 12 new methods added
SVG 1.1 – All filters supported and foreignObject, pattern, mask (elements) Animated PNG (APNG) image format

CODENAME ‘SHIRETOKO’
This is the codename for Firefox 3.1 and various new enhancements that should be of great interest to web developers are being talked about. A posting on Wikipedia claims that support for HTML 5’s <video> tag is to be implemented, which will allow video objects to be defined and operated within the page much like images – with src, width, height properties, etc. Ajax and Web 2.0 fans will be interested to hear that cross-site XMLHttpRequest capabilities are planned for the release, which will have huge benefits in building complex web apps and simplifying mashup work. Based on the Gecko 1.9.1 engine, it is also widely anticipated that Firefox 3.1 will have full CSS3 selector support, having had preAlpha builds pass a number of homebrew tests (www.css3. info/selectors-test/test.html) with flying colours. Expect to find these additions:


A winner would be nice…
So what conclusions can we draw from this browser round-up, and where does it leave them all in respect to how they perform? Well, first we should stress that judging them on the Acid tests should not be a sole barometer of how good the browser is from a developer’s perspective. This is merely a well-known benchmark in the same way that speed tests are used to measure page loading times or JavaScript parsing – the results don’t really mean all that much in practice. Until one of them can boast 100 per cent performance on standards and page rendering, the rest will never be pressured into following suit.
What’s more, can such brilliance ever be attained when the specifications and rules that define the many technologies we use are always evolving? Couple that with the fact that browser vendors are usually only motivated by achieving a download ubiquity, which is mainly driven by end users. Unfortunately, they are an audience who largely don’t know whether bad performance is down to a site’s design or the browser they use – and let’s face it, rarely are they disgruntled enough to investigate it.
For the developers, we have to admit that the inconsistencies between the latest crop of web browsers are as evident as ever, but hopefully everyone can take heart that work is being done to bring them together. In a climate where the genetics of online design is changing, it seems likely that necessary advances and cross-platform implementations of HTML 5, CSS3 and Ajax will be influential in releases to come. There is evidence that while each browser still has work to do, each one seems keen to improve.
If you have got any news or opinions on the latest browsers, development issues you’ve spotted or rumours on forthcoming versions, then email the Web Designer team at webdesigner@imagine-publishing.co.uk or share your thoughts on our forum at www.webdesignermag.co.uk
 
 
     
   
 
     
       
         
Privacy Policy
 
Site version 1.0 - All rights reserved © 2005 - 2006 Imagine Publishing Ltd
recommended : Plugins - Flash Player 7+, Resolution - 1024x768, Browsers - Internet Explorer 5.5+, Safari 2.0+
 
Copyright © 2007 Imagine Publishing Ltd. All rights reserved
 
Imagine Publishing Ltd, Richmond House, 33 Richmond Hill, Bournemouth, Dorset, BH2 6EZ
Registered company 5374037 (England) : VAT No 864 6042 18
Directors: Damian Butt, Steven Boyd, Mark Kendrick, Alistair Ramsay, Harry Dhand, Andrew Hartley, Sam Watkinson