Cross Browser Web Design

Chris Bruce

Do you think that you know what your Web site looks like? Are you sure? If you haven’t checked it out using a variety of different browsers, screen resolutions, and color depths, then you may have no idea how your site’s visitors really see your site!

Imagine – you go out and buy a brand new big screen television, you know those really expensive ones you always see at Best Buy. You get your television home and set it up. Excited, you turn it on and switch to your favorite channel only to find out that you can't watch your favorite channel because your television is not compatible with it. Now, we all know that this can't happen because television manufacturers and television broadcasters conform to standards defined by standards committees.

Web browsers are similar in that they must also follow the standards defined by a committee. In the case of HTML, the World Wide Web Consortium, or W3C for short, defines the various standards for Hypertext Markup Language (HTML) as well as other Web standards. These standards must be followed by both website designers and Web browser developers in order for websites to display information correctly.

As the HTML standards change, browser developers release new versions to conform to these standards. Unfortunately, most end-users don't always have the latest browser versions installed. This is compounded by the fact that many browser developers might conform to the standards differently. With all these different browsers, websites can look and behave very differently from browser to browser. In some cases, websites may not even work at all. There are so many standards for HTML that it seems impossible for one person to know all of them. That is why the W3C has free tools to validate your HTML code. You can use HTML Tidy or their online validator. These will provide an initial assessment to make sure your website code follows the published standards.

When designing a website, there are some key things that need to be considered, including screen size and the number of colors that your site is going to use. Most designers are targeting 800x600 and many new monitors are supporting much higher resolutions. But watch out if you expect to have any television based Web browsers as they are limited to 544x372. Most monitors can handle at least 16-bit color depth (65,536 colors), however television based Web browsers are mostly supporting only 8-bit color depth (256 colors) and colors will look very different from television to television.

In order to make your website look "cool," you may resort to DHTML and javascript. This is probably the number one problem with browser compatibility. Many old browsers only support a very small subset of the javascript functions that current browsers support. Furthermore, Netscape and Internet Explorer have different implementations of DHTML and javascript and may need to be coded differently based on the browser viewing the page.

What about Flash, Java, and other plug-ins? There are good and bad points about these. Not only can you go beyond what the browser supports, but you can do some really sophisticated things that HTML does not support. As long as the user has the correct plug-in and version installed, your code will display correctly. But the downside is that users may not have the plug-in installed and/or may not want to install it. So you have no way to guarantee that the user will go through the effort of downloading and installing the plug-in in order to even use your site. Website users have literally declared war on browser pop-ups. Mozilla based browsers have built-in mechanisms to prevent pop-ups. There is also a free plug-in called Ad Shield that works with Internet Explorer. So if you are using pop-ups for important aspects of your site (like free trial memberships), well, don't. There is a good chance that many of your site's users won't even know that those pop-ups exist.

Website designers must pay special attention to making websites accessible to the largest audience possible. This can be a difficult challenge, especially if you don't have access to the many different browsers and versions available. Not to mention testing them on different operating systems. Netmechanic and Any Browser provide detailed testing and will literally show a snapshot of what your site looks like using over 16 different browser configurations. This is the starting point for identifying visual problems with your site.

HTML standards will continue to change, the browser war will wage on, and websites will continue to push the envelope for improved user experience. In order to get an accurate assessment of your website users, you need to pay attention to the type of browsers being used on your site. All this information is captured in your website logs, so you should spend some time checking these statistics on a regular basis, so you can make sure that your website is correctly working for all of your users.

Chris Bruce is a programmer at Bionic Pixels specializing in server-side web development.

More Articles


Trying to Stop Web Fraud Before It Happens

Jonathan Corona ·

Webmasters Shouldn’t Wait for Disaster to Hit

Cathy Beardsley ·

Hefner’s Legacy Lives On in the Industry

Juicy Jay ·

Privacy Notices Shouldn’t Be Treated as an Afterthought

Corey D. Silverstein ·

Legal Issues Pop Up When Filming Sex in Public

Lawrence G. Walters ·

A Road Less Traveled: Accepting Alternative Payment Solutions

Stephen Yagielowicz ·

Credit Card Processing Today: Decline or Dominance?

Stephen Yagielowicz ·

Shifting Regulations: Keeping on the Straight and Narrow

Stephen Yagielowicz ·

Putting Your Best Foot Forward: Billing's Best Practices

Stephen Yagielowicz ·

PornDoe Premium — 35 Network Sites and Counting

Rhett Pardon ·
Show More