how to achieve a cross browser compatible webdesign ?

swifer07

New Member
Messages
7
Reaction score
0
Points
0
ei guys do you know a way on how will you make your webdesign to become cross browser compatible? plz answer...:cool:
 

leafypiggy

Manager of Pens and Office Supplies
Staff member
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.
 

Anna

I am just me
Staff member
Messages
11,733
Reaction score
578
Points
113
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.

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.
 

leafypiggy

Manager of Pens and Office Supplies
Staff member
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.

:p
 

Anna

I am just me
Staff member
Messages
11,733
Reaction score
578
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.
 

leafypiggy

Manager of Pens and Office Supplies
Staff member
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.
 

farscapeone

Community Advocate
Community Support
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.
 

swifer07

New Member
Messages
7
Reaction score
0
Points
0
is that mean to avoid many instances of error about design for cross browser issue one must use jquery? is that right mr. liviathon?
 

farscapeone

Community Advocate
Community Support
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.
 

vperlin

New Member
Messages
30
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.

Amen. Best way to do it. There are no shortcuts, people!
 

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
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.
 

ramreeko

New Member
Messages
6
Reaction score
0
Points
0
How can we make CSS3 coded rounded corners compatible in Webkit and Mozilla at the same time ?
 

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.
 
Last edited:
Top