The goal is to harness the benefits that make the technology powerful from a design standpoint: less code, increased accessibility, and easier maintenance, to name a few.
Dan Cederholm from Bulletproof Web Design (page vii)
Cascading Style Sheets (CSS) allow for the designer to separate the content from the design. A CSS-based design allows the designer to create a site with much less code than a site with an identical look that has been designed with tables. While tables are appropriate in some situations, a design that primarily uses CSS to control the layout has several advantages:
- The decreased amount of code allows for faster downloads.
- The decreased amount of code allows search engines to easily access the true content of a page, ideally resulting in higher search engine rankings. Search engines rank pages based on their content. With table-based design the page will contain substantial coding that does not relate to the content. CSS-based pages will have minimal extra markup which makes it easier for the search engines to find the content. If excessive coding prevents the search engines from finding the content, the pages ranking will suffer. In addition, CSS-based design allows the website designer to position the most valuable content ahead of less meaningful content, whereas tables present content in the order that it is displayed on the page. Content higher in the code will generally have more influence on search engine rankings.
- CSS-based design is easier to modify than table-based design. If a designer wants to make significant changes to the layout of a page designed with tables, starting over may be the only option. CSS makes it easier to perform routine updates as well as significant layout changes.
- CSS-based design allows a website to be more accessible across various browsers, as well as to those with disabilities using screenreaders and other devices.
If you are interested in creating a new website or having your current website re-designed, please see the packages that are available from Vandelay Website Design.
8 comments from readers
1 Seven Things Your Business’s Website Must Have << Vandelay Website Design Mar 4, 2007 at 5:43 pm
[…] Excessive use of Flash and JavaScript can prevent search engines from getting to the content of your site. Using CSS-based design allows the search engines to find the content faster and easier. CSS-based design uses code that is much less cluttered. For a full explanation of the benefits of CSS-based design, please see our article “Why Use CSS-Based Design?”. […]
2 Extensive CSS List: 134 Top CSS Resources << Vandelay Website Design Jul 12, 2007 at 5:05 pm
[…] Why use CSS-based design? - http://www.vandelaydesign.com/blog/css/why-use-css-based-design/ […]
3 Designing Pages to Load Quickly << Vandelay Website Design Jul 24, 2007 at 7:31 pm
[…] Table-based design uses more coding than CSS-based design and therefore a page that uses table-based design will usually have a longer loading time. CSS allows the designer to separate the content of the page from the design and ultimately use less code to create the same appearance. […]
4 Braintrove.com Jan 2, 2008 at 12:08 pm
CSS is definitely the way to go. Tables have their place, but they do render slower. Thanks for sharing your ideas.
5 css web templates Jan 23, 2008 at 6:40 pm
CSS is definitely the way to go.i like the templates design with css!
6 Rusty Mar 14, 2008 at 9:52 am
CSS is the future!
7 diş beyazlatma Mar 22, 2008 at 12:34 am
thanks
8 cssmake Jul 10, 2008 at 4:39 pm
good information