I have often argued that CSS reset files will end up causing more problems than they solve. Indeed, I am not convinced they solve a real problem.
The problem seems to be that each browser I support does not apply the same default styling to some elements that I may use in my website.
The solution proposed by CSS reset files is to create a base line set of CSS rules which will on first inspection solve this problem. However, I am not sure I agree that the problem is as stated above.
I believe the problem is that each website I code looks and behaves differently and does not use the same set of default styles as other websites I have developed.
The solution I propose is resetting only the CSS styles I actually need in order to make the website look correct in as few styles as possible. Only then will I be interested in the difference between browsers. I would still use the * reset myself as I find that generally is useful and makes a fairly large difference when designing my CSS. I would not employ any more of a reset than that.
As an example, my website may not use any level 3 headings. In that instance, my CSS code will not try and select any 3rd level headings at all. If later during development I need to use a level 3 heading, I will use the tag and add the relevant CSS code. I have always employed this approach and it has so far never let me down.
For more details on my approach to structuring CSS, I suggest reading this post. Of course ideas change over time, but it is still relevant.
I always believe in code being as lightweight as possible, not purely for speed of download but for ease of maintenance and the retention of my own sanity!
The other point raised by the post I mention above is that of producing cross-browser pixel perfect layouts. This is a topic that probably deserves its own post if not a series of posts, however, I rarely strive for pixel perfection. I just do not believe it is that important any more. I would argue that users are becoming aware that websites will look very slightly different on different platforms. I definitely did not perfectly explain my position in my previous post about browser support so I will clarify it here.
In that post, for level 1 browsers (the only relevant browsers in this discussion) I state:
All features of the website are fully functional. All content is available. The web pages will match the designs provided completely. The web pages will look the same across all browsers at this level.
What I should have said was:
All features of the website are fully functional. All content is available. The web pages will match the designs provided completely with the exception of system entities such as form fields and rendered fonts which may cause a layout to differ slightly. The web pages will look the same across all browsers at this level within the constraints of the different rendering methods for each platform.
That more fully expresses how I feel about pixel perfection. Sometimes it can be done, sometimes it cannot. We should educate our clients that pixel perfection is not always important.
Posts
5 comments:
So you seem to have changed your mind since you wrote the post on Structured CSS?
Thank you for pointing this out. I did not express myself clearly enough and I have altered the post accordingly. I do still follow the rules I set for myself in my post on structured CSS and I do still use the * global reset. I would hardly describe that as a CSS reset file, but more of a single line helper!
Cool, thanks for clarifying!
How do you deal with clients that want the dite pixel perfect and rendering exactly the same (pixel for pixel) in IE FF and Safari?
Thanks for your question. I would demonstrate that achieving pixel perfection will add an additional cost which is highly unlikely to be recouped but can actually be quite great.
This can be done by showing a series of HTML pages which are not pixel perfect across all browsers and those which are and showing how little noticeable difference there is. I would then inform the client of the difference in development time between the pages.
From that demonstration as well as the difference in costs, it is likely that most clients would not be impressed.
I would also show the client how well known websites on the internet and successful competitors of the specific client are not pixel perfect.
When I have had the opportunity to do this, most clients are open to the ideas they are presented with.
It is also very important to get buy-in from the client service department at your organisation who are in a good position to assist with convincing the client that pixel perfection cross browser is not only expensive, but sometimes not even desireable.
Post a Comment