how to achieve a cross browser compatible webdesign ?
- Thread starter swifer07
- Start date
- Messages
- 3,819
- Reaction score
- 163
- Points
- 63
To make your design cross browser compatible, make sure you design it using the W3C standards. As long as you comply with those standards, your design should work in all browsers.
- Messages
- 11,750
- Reaction score
- 581
- Points
- 113
sorry to break it to you, but following standards alone won't do that, as some browsers refuse to follow the standards (mainly older IE).
Most of the time you need to find the small tricks, like giving a few special rules that apply only to IE...
But following standards is a very good place to start.
- Messages
- 3,819
- Reaction score
- 163
- Points
- 63
Well, I know that. But the quirks in IE 6 and lower are just stupid. No one should be using those browsers anyways, but it is still good to include a style sheet only for IE or w/e.
- Messages
- 11,750
- Reaction score
- 581
- Points
- 113
actually, there's quirks with ie7 as well... I had to implement special rules on my mainsite to make it look good in ie7 due to ie7 handeling padding/margin a bit different then firefox does.
ie8 on the other hand doesn't require as many special codes as ie7 does.
ie8 on the other hand doesn't require as many special codes as ie7 does.
- Messages
- 3,819
- Reaction score
- 163
- Points
- 63
Ah, I forgot about ie7. Most of my designs don't need special implecations. Just as long as they aren't very un-simple, you should be all set.
Armacci Design
New Member
- Messages
- 38
- Reaction score
- 0
- Points
- 0
Essentially, the most important thing for a developer to do in terms of cross-platform support is test the site themselves. My development workstation has every browser you can think of installed, including some of the most outdated (original Netscape... haha) and obscure pieces of software out there. When my company finishes a site for a client, there is an entire day devoted to manually checking different browser compatibility, along with frequent checks during development.
It's often overlooked, but there is no substitute for just going through your site yourself on as many browsers as you can.
It's often overlooked, but there is no substitute for just going through your site yourself on as many browsers as you can.
- Messages
- 1,165
- Reaction score
- 27
- Points
- 48
Developing cross browser compatible sites is a mixture of following standards and having some experience. You newer know what could go wrong with IE The best way of making it easy is useing jQuery, Prototype or some other JavaScript Library. They are mostly compatible with IE6+ and all other browsers +jQuery is compatible with CSS3.
The best way of making it easy is useing jQuery, Prototype or some other JavaScript Library. They are mostly compatible with IE6+ and all other browsers +jQuery is compatible with CSS3.
- Messages
- 1,165
- Reaction score
- 27
- Points
- 48
In terms of JavaScript cross browser compatibility yes, but that won't fix IE6 bugs like PNG transparency or stuff like that.
jQuery is a perfect way of doing your JavaScript coding cos you don't have to worry that much about cross browser compatibility while writing your code and that's a good start for overall cross browser development.
jQuery is a perfect way of doing your JavaScript coding cos you don't have to worry that much about cross browser compatibility while writing your code and that's a good start for overall cross browser development.
Amen. Best way to do it. There are no shortcuts, people!
Expanding on what everyone else has said:
Once you've designed & built your page according to the standards and following best practices (such as writing semantic HTML), it's time to test. You can use Browsershots to view your website in browsers you may not have installed. Using your own machine is both faster and gives you more control. Install MultiIE or IE Collection on a Windows box to get multiple versions of IE.
Quirksmode has great information on cross browser compatibilty. A List Apart and Position Is Everything also have high-quality information.
There are a couple browser extensions/applications to help you debug pages. For FF, use Firebug for JS and CSS debugging. For IE, try the IE Developer Toolbar to debug CSS and use Visual Web Developer Express to debug JS. For Safari, just enable the developer menu (though it won't help much with JS debugging). Chrome and Opera similarly have built-in debugging tools. Eric Pascarello started a tutorial on JS debugging in Chrome, and the Opera developer site has an article by Hallvord Steen on debugging JS in Opera.
Once you've designed & built your page according to the standards and following best practices (such as writing semantic HTML), it's time to test. You can use Browsershots to view your website in browsers you may not have installed. Using your own machine is both faster and gives you more control. Install MultiIE or IE Collection on a Windows box to get multiple versions of IE.
Quirksmode has great information on cross browser compatibilty. A List Apart and Position Is Everything also have high-quality information.
There are a couple browser extensions/applications to help you debug pages. For FF, use Firebug for JS and CSS debugging. For IE, try the IE Developer Toolbar to debug CSS and use Visual Web Developer Express to debug JS. For Safari, just enable the developer menu (though it won't help much with JS debugging). Chrome and Opera similarly have built-in debugging tools. Eric Pascarello started a tutorial on JS debugging in Chrome, and the Opera developer site has an article by Hallvord Steen on debugging JS in Opera.
freecrm
New Member
- Messages
- 629
- Reaction score
- 0
- Points
- 0
Can I throw in http://browsershots.org here??
This site will trawl through a URL you specify and return screenshots from multiple browsers without you having to do anything else.
Oh - and Neil - love your comment about quirks in IE6 or lower just being supid!! LOL. The number of times my menu bar has broken on either IE6 or FF alternately has driven me mad!
Leviathon - didn't know about jQuery - thanks for that.
This site will trawl through a URL you specify and return screenshots from multiple browsers without you having to do anything else.
Oh - and Neil - love your comment about quirks in IE6 or lower just being supid!! LOL. The number of times my menu bar has broken on either IE6 or FF alternately has driven me mad!
Leviathon - didn't know about jQuery - thanks for that.
Last edited: