Bowsers and protocols and their differences

This topic, dealing with differences in browsers is extremely important. The feeling you get when you see your carefully crafted webpage or site fall into an ugly heap on another computer which uses a different monitor, browser, screen setting, or operating system can be devastating.
But, a fact of life is that there is digidiversity and it leads to outcomes that can not be predicted or avoided if you spend your life in front a single a monitor, always use the same browser, screen setting and O/S.

I hope to heighten your awareness of issues related to this situation and after that, it's up to you how knowledgeable you become in this area.

Clients will rarely know how difficult it is to avoid all the pittfalls and create a page/site that loads just like you'd like in all environments (never identically though).
That means they will be unlikely to approve a large budget-component towards troubleshooting this aspect of web-design.

The major issues presented here will at least help anticipate the most common problems and prevent some of the most shocking outcomes.

The most common problems between browsers are without question

• The rendering of colour
• The "normal" and "default" response to html.
• The "interpretation" of HTML and Javascript codes by different browser.

After that you have the equally large problem of "overdesign" which is as much a harware issue as it is one related to software. Designers and artists often forget thatthere are people online who have low-end machines/modems/connections. They may be still running an early Netscape or NTSC Mosaic, they may be on AOL etc.etc.

Put simply: the further you go towards the excotic in terms of special effects on your page/site the smaller your audience becomes.

It also helps to be aware of usage statistics in this game and no matter which set of statistics you look at, I.E. has gained the statistical lead.

Tyre stores will stock more of the most popular brand and type of tyre and may keep some of the more exotic or unusual types of tyres in stock, but not in great quantities.

Web-designers can learn from this simple logic. Design for the majority out there and maybe have components of the site featuring more exotic and experimental code.

Right now that probably translates into: design for a 'Windows'95'(or'98) user running 16 or 32 meg RAM (that still happens), Netscape 3, a 15" VGA monitor and no exotic plug-ins from Macromedia or anyone else for that matter.

So, in the light of all this, we will spend a little time on the following:

 
• html across browsers
• colour issues between browsers
• awareness of browser usage statistics

The simplest scenario: you have written a <div> ..align= whatever tag into your page (or, you have used an editor and it has written it in without you even knowing) and you look at the page somewhere running Internet Explorer-or NCSA Mosaic (yes, some people still use it) and the entire page loads differently to how you remember it looked on your machine.
That's because you had Netscape running and it reads <div> tags. Alternate scenario, you used the <col> tag and the page looked fine in Explorer . Then noticed neither Netscape or Mosaic wanted anything to do with your fancy <div> tags.
I've made my point. Now it's up to you to search the net until you come up with the info you need that tells you which browsers understand which html 3.2/4.0/xhtml tags An example of these issues can be seen on this AOL page.
Html 4.0 is now the accepted standard and XHTML is recommended and in use but it's not yet save to go into that water. Html 3.2 is more widely accepted by diverse browsers. Browser differences when designing web pages
The major web browsers are Internet Explorer and Netscape Navigator. Opera however is becoming quite popular and version 5 allowed it to compete on an equal footing with IE and Netscape with a banner-ad supported freeware release. As browsers have developed they have supported the various web standards for HTML, DHTML, Javascript and XML to a differing degree.

Netscape
When Netscape released its 4.79 version release, it was estimated that about 35% of web users were using it. Netscape 4 included support for cascading style sheets (CSS), inline support for PNG graphics, and improved OLE support, as well as layering and absolute positioning.
Netscape 6 introduced support for XML and adheres much more closely to the W3C web standards than previous versions of both Netscape and Internet Explorer, and therefore handles DHTML and CSS stylesheets much better. However in terms of performance, Netscape 4.7 and IE outperform it. Badly written code can cause this browser to crash easily, however version 6.2.2 has fixed some of the bugs.
For more detailed information on designing web pages for Netscape click here.

Internet Explorer
Internet Explorer is probably the most user-friendly and best performing browser.
Internet Explorer version 4 introduced support for Dynamic HTML (DHTML).
Internet Explorer 5.5 introduced support for XML.
Support for CSS stylesheets has beed good since version 4 however this is where mistakes can be made designing web pages because it supports many CSS properties that are not supported in Netscape version 4.x. It also does not comply completely with the web standards for CSS supoprt.
For more detailed information on Internet Explorer's features click here.

Opera
Opera is an excellent browser which can now compete with the big two, IE and Netscape. It has good performance and speed and Version 4+ supports nearly everything with good multimedia capabilities. For more detailed information on Opera's features click here..
Testing your web pages
The best way to test your web pages is to download and install the version you want to your own computer.
You can download older versions of Netscape from:
http://home.netscape.com/download/archive/index.html
You can download older versions of Internet Explorer from:
http://www.microsoft.com/windows/ie/downloads/archive/default.asp
(IE 4.x is no longer available for download and is not supported by Microsoft)
If you need to get hold of browsers which are not available for download then try and get hold of a copy of an older web design or internet magazine. Most of these include discs which include the current major browsers at the time of publishing.
When you download the program, it will ask you which directory you want to save it in. Create a new directory under your "Program files" directory (eg: Netscape4.7) and then save it there. If it does not install automatically on your computer then browse to the directory where you saved it and double click the .exe file. Note that when installing, you will be asked if you want to make the new browser your default browser. Make sure that you don't check this box if you don't want this option. You can always change the default browser later in your Internet settings.
There is also a site called AnyBrowser which will allow you to preview your live website in different browsers if you cannot view them on your own PC. This is a second best option as you would not be seeing your site first hand as a visitor would see it. It is still very useful tool if you cannot download browsers to your PC.

Internet Explorer
Netscape
Opera

Browserwatch is very useful for it's stats as well as links
 
 

Links to html code and XHTML issues

• Download html 4.0 code (The recommended standard since April 1998) from W3C  
• Alan and Lucy Richmond have also provided an excellent and very detailed guide to HTML 4.0
• HTML 4.0 and XHTML differences are explained here

• A Netscape colors page illustrates Netscape's color setup and has a great interactive display of the browser supported colour and the corresponding hex values.

 
• Adobe provides extensive details about  the browser colour issue. They also provide both Mac and Windows Photoshop Swatches palettes.

 
• Other Sites providing useful explanatory material include homepages  by Jennifer Burke and Alan Richmond.

 
• Lynda Weinman offers several Photoshop palettes at her ftp site. Check out her color page to see how they look organized by hue vs. value.     

•  Virus issues and browsers

• Netscape software and plug-in's download
• Netscape search