CSS layouts and proper use of CSS are at the root of web standards. While there are many in the community constantly beating the drum for wide-spread CSS use and overall compliance to web standards, it is important to understand the benefits so you can decide to follow this design path yourself. Sooner or later, you'll need to convince your boss, colleagues or client why a CSS-based approach is the right way to go for a new or redesigned site. Although it involves technology, it's not really a technological decision-it's a practical, business decision. There are a great many advantages to the web standards design, but let's look at the top three: portability, speed and maintenance.
Better portability
One of the primary tenets of web standards is the separation of content from presentation. A key benefit of this separation is the ability to reshape the content to fit the media. You can, for example, take a site that looks great on the computer screen and reconfigure it for hard copy printer output with a CSS style sheet. With the change of just a few style rules, you can hide areas not pertinent to the page, like a footer of links, or expand a column of text to better fit the printer margins.
There are even Dreamweaver extensions, such as Eric Meyer's CSS Sculptor, which automatically create separate style sheets for both screen and print. Most importantly, the portability doesn't stop there. As handheld device technology proliferates, through the iPhone and other devices, cell phone browsing is much more of a reality today. Through a separate CSS style sheet, your sites can look their best no matter the media.
Increased download speed
CSS brings with it a "real dollars and cents" cost benefit. Most developers find that the average page weight of a CSS-based layout is half that of a table-based one. Not only is the code much more readable, and thus easier to update, but the markup is substantially less.
Compare character count of a CSS layout vs. a table based layout and you'll find that the CSS approach approximately 50% smaller. Naturally, the download times for a CSS code snippet or table-based code snippet would be essentially the same, but if you look at completely developed pages, a notable difference is evident. With major sites-or any site experiencing high traffic-there are actual, significant savings for bandwidth costs. Moreover, designers typically find that the faster download times result in an increased number and length of page visits, which again, can result in a notable increase in revenue, especially if you consider banner and search engine ad placement.
Easier maintenance
As noted above, the code for a CSS-based site is much easier to read and, therefore, update. Faster changes mean less time which translates into more time designers can spend on other projects, another real, bottom-line benefit. When external style sheets are used, site-wide changes can occur almost instantaneously and even, if appropriate, be user-driven.
|