Good resources for cross browser ASP.NET website development

Question

Does anyone know of any good resources for learning about cross-browser development in ASP.NET? Specifically, what causes a page to look different in FF/Chrome/IE, what are the gotchas when developing, how can this issue be addressed in a new project etc.

Answer 1

There's really not a specific resource I've found for that type of information. Generally I've found the information as I encounter the errors. But the first step is learning at least a high level overview of the rendering engines used by the different browsers. They all have their own particular "quirks", thus why a site like http://www.quirksmode.org/ exists.

Another thing related to the different engines is understanding the box model of development and how CSS is treated differently with it in each browser (and the different versions of the browsers). If you need to be extremely worried about pixel perfect matching between the browsers, you're going to have tons of fun.

Related to that, another thing is to look in CSS Reset Sheets. This gets the environment between the different browsers fairly similar. This makes development easier, but still not foolproof from messing up layout.

Answer 2

A good tool for cross-browser websites is Microsofts SuperPreview. This is still in beta, but so far looks like it will be a great help with web development.

Hope that helps!

Answer 3

This really should be more a concern of HTML markup and CSS than ASP.NET specifically. That will help your search.

For me this has been an issue of learning the hard way, along with a lot of Google searches.

Quirksmode.org is a good reference as Agent_9191 suggested and there are other more specialized & detailed references scattered throughout the web.

However, if you try to read and understand all the incompatibilities between browsers it's easy to be overwhelmed. So often times I really need specific examples to learn from.

For that, I really like alistapart.com. There is a ton of good stuff on that site when it comes to creating layouts in a cross-browser compatible way.

Answer 4

Usually you won't get any problems with ASP.net and cross-browser compatibility issues if you just use the standard normal server controls ASP.net gives you. When the problems start is (as CD said) when you're doing something more "advanced" like Ajax calls using the ASP.net Ajax Control toolkit or jQuery or whatever and you still have the requirement to be backwards compatible till IE6 (which causes most of the problems!).

What I experienced, cross-browser issues arise when

• you're using a lot of client-side code like JavaScript (Ajax calls etc...). In such cases it is worth to look for high-level libraries like jQuery for doing most of the things.
• you're dealing with CSS stylesheets for doing your page design and layout, which you should do with CSS and not inline styles!! With CSS it's a matter of learning by doing. You'll get experiences on what will work fine on most browsers and what will probably give you problems.

Generally, just for ASP.net, it is extremely important to have the page/control/custom server controls lifecycle in mind. You should have a good idea about that, but there is plenty information around on the web. Most issues you'll experience with the ASP.net ViewState will be due to incorrect handling of the according control's lifecycle (i.e. attaching dynamic elements to early/late, reading the ViewState in the OnInit of your page and wondering why your values are empty etc...)

Answer 5

For the ASP.NET specific side, the most important tip I can think of is to avoid the more complex ASP.NET controls as much as possible. The more markup the framework generates, the more stuff you will need to unwind. And honestly, one can do everything one would need to do in ASP.NET using repeaters and user controls at the end of the day. Which is what one had to do back in the 1.1 days to get anything resembling decent markup.

Now, if you can't avoid the more complex controls, I would also check out the Css Friendly Control Adapters. They can help slim down some of the other stuff.