Do You Reset Your Web Design?
They've been around for a while now: reset style sheets. They're becoming more commonplace among web designers, and even Yahoo is using a reset stylesheet of their own in their development. There are a few different viewpoints and opinions on the use of reset stylesheets, though. Do you reset?
For those that don't know, a default reset stylesheet is a .css file that you use in your HTML documents. The file has CSS rules that effectively neutralize a browser's default rendering of HTML elements and positioning. It sets all margins and padding to 0 and removes text decoration, size, and weight from HTML tags that normally have these by default, like the
To use a reset stylesheet, you link it in your header like any other stylesheet. Then, when you're writing your own CSS, you can choose exactly how each element is to look. You can turn the bold text back on for the headers, and set the exact amount of padding you want, for example. Set your font faces and spacing however you like. The idea behind this extra work is that when a browser is reset to this zeroed-out state, you can specify exactly what you want your elements to look like, and practically all browsers will have an easier time rendering your design as you intended it rather than how the browser's defaults want to display it. The reset stylesheet removes the browser's defaults, so you don't have to worry about them.
If you want to try out a reset stylesheet, you can get Eric Meyer's reset stylesheet here, or you can try out YUI's Reset.
Keep in mind: resetting in web design, like many other things, has its pluses and it has its minuses.
Resetting greatly helps a designer build designs that look most similar (sometimes, identical) cross-browsers.
Because a reset will "zero out" a browser's formatting of your HTML, you get total control in your own CSS to declare exactly what you want, without the worry of whether or not a specific browser is going to tamper with your design.
Reset stylesheets can be modified to suit your tastes. A reset doesn't always have to zero out absolutely everything. Maybe you're comfortable with how the different browsers handle some things, or maybe you have a different idea for what the baseline for most of your projects should be. You can modify a reset stylesheet to suit your needs and create a uniformity amongst your work that is unique to you.
An experienced designer who resets can save time. It's true that learning to use a reset stylesheet can take some time to get used to, but once you've learned the ins and outs of your reset, and have your own modifications that you've built over time, you can pop your reset and modifications into a design and just start designing.
Simply put: your HTML document becomes a blank canvas and you can work with whatever CSS you wish.
The "clean slate" effect takes some getting used to. This adds a bit of a learning curve to your web design, which you're probably already nice and familiar with. Most likely, you've built up your methods and workflow over time, and something as drastic as a reset stylesheet can slow you down again.
Because resetting takes everything down to basics, you have to re-add things that you might think should just be included, like bold text in headers. You'll also need to pay special attention to where exactly you want all your design elements to appear, and how. Things you used to let the browser take care of, you now have to code for. This leaves you writing more CSS than you probably want to, or even need to.
Even through all this extra work when using a reset stylesheet, the reset still doesn't guarantee that your designs will look identical in various browsers. In fact, in some extreme cases, your design may end up looking no different across browsers than if you hadn't used a reset stylesheet. YUI's reset stylesheet, for example, works best with just what they consider "Grade-A" browsers, and some parts of the reset don't affect browsers not on this list. Granted, the Grade A list is the list of browsers we all design for primarily, anyway..
Eric Meyer released his stylesheet, and people picked it up then seemingly immediately split into groups: those who like it, those who hate it, those who don't use it but can see its usefulness, and those who use it if the job calls for it. Want to see some people who fall into these various groups?
Jonathan Snook is one who falls into the "those who don't use it but can see its usefulness" group. He posted on his site his thoughts on reset stylesheets, and why he doesn't use them. In a nutshell, he states that reset style sheets take things overboard, and while he doesn't necessarily have anything against them, they just don't suit his tastes. In his opinion, they require too much work to go about re-declaring things in your own CSS that should just be there, which reset style sheets take away.
Eric Meyer obviously falls into the "those who like it" group. After Jonathan's post above, Eric felt that people were getting the wrong idea about his thoughts on reset stylesheets, so he cleared things up on his site. He never intended reset stylesheets to become a "be-all, end-all" solution to cross-browser compatibility, and in fact, wants and actively encourages users you take his reset and modify to fit their tastes, or even not to use it at all if they don't want to.
Jens Meiert (grouped in "those who hate it") states pretty strongly Why Reset Style Sheets are Bad. Jens says that "novices should not use them, [and] experts would not use them," then goes on to list the reasons why (load time increases and accessibility concerns, among others) and lists alternatives to resetting.
If you'll read through the above links, you'll find that many of the comments on those sites are made by users who fall into the last category: "those who use it if the job calls for it."
When it comes to resetting in my web design, I fall somewhere between "don't use it but can see its usefulness" and "use it if the job calls for it." When I've played with it for my own local pet projects, I found it adding time to the project that I could have avoided. I can see, though, that if I spent some more time with it and made my own tweaks, which is what Eric intended with the idea of a reset sheet anyway, it might speed up my work in the future and help my designs. For right now, though, for anything serious, I won't use it, but I'll still recommend others give it a shot.
It's a tool.
Everyone has their own method of designing and they have their own tools. These tools include your text editor of choice, your operating system of choice, what graphics editors you use, palette generators if you choose to use them, and now, reset stylesheets. If you prefer to draw your design on paper, scan it into Photoshop and add color, then cut the design into divs, that's what you do. If you prefer to mark up the HTML of your site first, then tack on a reset stylesheet and build your CSS before adding your images, great. Everybody does things differently.
I think it's best to view a reset stylesheet as a tool in your toolbox. It's in mine, and while I'm not too good with that tool yet, I know some people can use it masterfully, while others choose not to use it at all. Either way, the craft is yours to do with what you wish, how you wish to do it. I don't think the inclusion or non-inclusion of a reset stylesheet says anything more than, "Hey, this designer used/didn't use a reset stylesheet."
I'd like to encourage users who are thinking of using a reset stylesheet to give it a shot in their next project. Maybe you'll like it, and if you don't, then no harm done; you can always just not use it.
They've been around for a while now: reset style sheets. They're becoming more commonplace among web designers, and even Yahoo is using a reset stylesheet of their own in their development. There are a few different viewpoints and opinions on the use of reset stylesheets, though. Do you reset?
What are reset stylesheets?
For those that don't know, a default reset stylesheet is a .css file that you use in your HTML documents. The file has CSS rules that effectively neutralize a browser's default rendering of HTML elements and positioning. It sets all margins and padding to 0 and removes text decoration, size, and weight from HTML tags that normally have these by default, like the
header tags (h1 - h6), em, and strong.To use a reset stylesheet, you link it in your header like any other stylesheet. Then, when you're writing your own CSS, you can choose exactly how each element is to look. You can turn the bold text back on for the headers, and set the exact amount of padding you want, for example. Set your font faces and spacing however you like. The idea behind this extra work is that when a browser is reset to this zeroed-out state, you can specify exactly what you want your elements to look like, and practically all browsers will have an easier time rendering your design as you intended it rather than how the browser's defaults want to display it. The reset stylesheet removes the browser's defaults, so you don't have to worry about them.
If you want to try out a reset stylesheet, you can get Eric Meyer's reset stylesheet here, or you can try out YUI's Reset.
Keep in mind: resetting in web design, like many other things, has its pluses and it has its minuses.
Reset stylesheet advantages
Resetting greatly helps a designer build designs that look most similar (sometimes, identical) cross-browsers.
Because a reset will "zero out" a browser's formatting of your HTML, you get total control in your own CSS to declare exactly what you want, without the worry of whether or not a specific browser is going to tamper with your design.
Reset stylesheets can be modified to suit your tastes. A reset doesn't always have to zero out absolutely everything. Maybe you're comfortable with how the different browsers handle some things, or maybe you have a different idea for what the baseline for most of your projects should be. You can modify a reset stylesheet to suit your needs and create a uniformity amongst your work that is unique to you.
An experienced designer who resets can save time. It's true that learning to use a reset stylesheet can take some time to get used to, but once you've learned the ins and outs of your reset, and have your own modifications that you've built over time, you can pop your reset and modifications into a design and just start designing.
Simply put: your HTML document becomes a blank canvas and you can work with whatever CSS you wish.
Reset stylesheet disadvantages
The "clean slate" effect takes some getting used to. This adds a bit of a learning curve to your web design, which you're probably already nice and familiar with. Most likely, you've built up your methods and workflow over time, and something as drastic as a reset stylesheet can slow you down again.
Because resetting takes everything down to basics, you have to re-add things that you might think should just be included, like bold text in headers. You'll also need to pay special attention to where exactly you want all your design elements to appear, and how. Things you used to let the browser take care of, you now have to code for. This leaves you writing more CSS than you probably want to, or even need to.
Even through all this extra work when using a reset stylesheet, the reset still doesn't guarantee that your designs will look identical in various browsers. In fact, in some extreme cases, your design may end up looking no different across browsers than if you hadn't used a reset stylesheet. YUI's reset stylesheet, for example, works best with just what they consider "Grade-A" browsers, and some parts of the reset don't affect browsers not on this list. Granted, the Grade A list is the list of browsers we all design for primarily, anyway..
Differing points of view on reset stylesheets
Eric Meyer released his stylesheet, and people picked it up then seemingly immediately split into groups: those who like it, those who hate it, those who don't use it but can see its usefulness, and those who use it if the job calls for it. Want to see some people who fall into these various groups?
Jonathan Snook is one who falls into the "those who don't use it but can see its usefulness" group. He posted on his site his thoughts on reset stylesheets, and why he doesn't use them. In a nutshell, he states that reset style sheets take things overboard, and while he doesn't necessarily have anything against them, they just don't suit his tastes. In his opinion, they require too much work to go about re-declaring things in your own CSS that should just be there, which reset style sheets take away.
Eric Meyer obviously falls into the "those who like it" group. After Jonathan's post above, Eric felt that people were getting the wrong idea about his thoughts on reset stylesheets, so he cleared things up on his site. He never intended reset stylesheets to become a "be-all, end-all" solution to cross-browser compatibility, and in fact, wants and actively encourages users you take his reset and modify to fit their tastes, or even not to use it at all if they don't want to.
Jens Meiert (grouped in "those who hate it") states pretty strongly Why Reset Style Sheets are Bad. Jens says that "novices should not use them, [and] experts would not use them," then goes on to list the reasons why (load time increases and accessibility concerns, among others) and lists alternatives to resetting.
If you'll read through the above links, you'll find that many of the comments on those sites are made by users who fall into the last category: "those who use it if the job calls for it."
What do I think?
When it comes to resetting in my web design, I fall somewhere between "don't use it but can see its usefulness" and "use it if the job calls for it." When I've played with it for my own local pet projects, I found it adding time to the project that I could have avoided. I can see, though, that if I spent some more time with it and made my own tweaks, which is what Eric intended with the idea of a reset sheet anyway, it might speed up my work in the future and help my designs. For right now, though, for anything serious, I won't use it, but I'll still recommend others give it a shot.
It's a tool.
Everyone has their own method of designing and they have their own tools. These tools include your text editor of choice, your operating system of choice, what graphics editors you use, palette generators if you choose to use them, and now, reset stylesheets. If you prefer to draw your design on paper, scan it into Photoshop and add color, then cut the design into divs, that's what you do. If you prefer to mark up the HTML of your site first, then tack on a reset stylesheet and build your CSS before adding your images, great. Everybody does things differently.
I think it's best to view a reset stylesheet as a tool in your toolbox. It's in mine, and while I'm not too good with that tool yet, I know some people can use it masterfully, while others choose not to use it at all. Either way, the craft is yours to do with what you wish, how you wish to do it. I don't think the inclusion or non-inclusion of a reset stylesheet says anything more than, "Hey, this designer used/didn't use a reset stylesheet."
I'd like to encourage users who are thinking of using a reset stylesheet to give it a shot in their next project. Maybe you'll like it, and if you don't, then no harm done; you can always just not use it.
No comments:
Post a Comment