Tuesday, September 27, 2011

Web Browser Conflicts Explained

A quick look at Wikipedia reveals that Mosaic was the first popular World Wide Web browser to mix image elements with text. It was developed at the National Center for Supercomputing Applications in 1992, released to the public in 1993 for non commercial use, and orphaned in 1997.

Mosaic project alumni and other users established Mosaic Communications Corporation which eventually became Netscape Communications Corporation, producing Netscape Navigator. A different group established Spyglass Inc. with their own version of Mosaic. When Microsoft was not allowed to license the Netscape Navigator, they made a deal with Spyglass for fees partly based on browser sales. Microsoft called their browser Internet Explorer and introduced it as an add on to Windows 95. MS bundled IE with later versions of Windows, thus having no sales revenues on the browser, which caused Spyglass to threaten legal action, resulting in $8 million settlement to Spyglass.

Netscape had initial market dominance, based on user acceptance. IE gained dominance via distribution with Windows. Such competition fostered both proprietary code and the evolution toward similar user interfaces. As of this writing, Netscape has been discontinued, and the non-profit Mozilla Foundation has continued Netscape concepts into the open source FireFox browser and related applications.

The Safari browser was developed by Apple Inc. for distribution with Mac OS X. It was first released as a public beta in January 2003 and is now available for Windows. It is claimed to be significantly faster than the alternatives.

The Opera browser ranks behind Internet Explorer, Mozilla Firefox, Safari, and Netscape in popularity. It is now free for personal use. Some of its security concepts and other features have influenced development of the other main browsers.

A recent web template was made elastic ("fluid" or "liquid") using the DIV element instead of TABLE for layout and variable font sizes. A floating text box (DIV) was added so that it remained fixed as the user scrolled down through a page. The results looked great in FireFox 2.x, and nearly the same in Opera 9.x and Safari 3.x, except that "fixed" box scrolled in Safari. For Internet Explorer 7.x, the fixed box scrolled, spacings differed, text background colors didn't stay with highlighted text, and some menu colors (for active, hover, visited links) were totally screwed up. In other words, IE 7, supposedly free of bugs found in prior releases, is not usable for this design template.

Rather than load down the template design with work-arounds for IE, it was replaced with a TABLE layout for positioning, plus some other HTML Tags/Elements on menus and text selections. It still has elasticity and variable font sizes from dimensioning mostly in "em" and "%" rather than "px".

The logo.jpg image stays fixed in size when font size is changed, for FireFox and Safari, but is elastic for Opera and Internet Explorer. Either is acceptable if the base image has adequate resolution, namely upwards of 144 dots or pixels per inch, perhaps minimum 300. The 72 ppi that Adobe recommends for screen images is more suited for small icons.

For the uncommitted web designer, it seems that ease of coding for these four browsers ranks as FireFox, Opera, Safari, Internet Explorer, with IE being a problem. Netscape is no longer an issue, but it is the ancestor of FF.

IE browser through version 7 still does some things differently from the other most popular browsers. As a consequence, a lot of web design effort is wasted on making web pages work the same for IE as for other browsers. One workaround is to have web pages check the browser in use, then switch CSS style sheets or JavaScript definitions to match. The alternative is for page builders to design for only one browser, usually justified with a statement "optimized for nnnnn browser".

It is unfortunate for designers and web users that Microsoft is so resistant to open standards.

Article Source: http://EzineArticles.com/971399

No comments: