Why people are changing CSS based website?
As a web designer i used to design websites with the use of tables. Now the scenario has been changed, even my clients want CSS based websites, why clients are asking for a CSS based website, what is the exact advantage of doing a web page with the use of complete css and div tags.
http://www.csszengarden.com
look at the different style sheets being pulled in.
you can redesign the looks of the page without migrating the content(which on large sites can take months)
also it can make the site more semantic in nature which has several advantages; SEO, accessibility, more real relevance in searches
look at the different style sheets being pulled in.
you can redesign the looks of the page without migrating the content(which on large sites can take months)
also it can make the site more semantic in nature which has several advantages; SEO, accessibility, more real relevance in searches
| jomillergo wrote: |
| ...what is the exact advantage of doing a web page with the use of complete css and div tags. |
I believe there is no definite advantage for css or a downside for tables. People are still designing websites in tables or use both table tags and div tags, whichever suits their project better.
While designing a page in css appears to be easier and allows for a much more diversified layout with a better degree of control over how it is displayed, people find themselves sometimes writing fairly complicated css in order to do something that's trivial with tables. There are also a lot of bugs in css which require a good amount of effort and time to find and fix, time and effort that would perhaps have been better spent writing good old table tags.
What I'm trying to point out is that there is no right and wrong way to design a website, no old vs new improved way. It ultimately boils down to what you need to achieve in terms of functionality, loading time, search engine friendliness and why not? even good looks. I think all clients should understand that between css and tables there are a lot of shades of grey.
Its alot easier to write a clean website that works across all browser using css. With tables you have to include lots of extra tags and then have potentially tables inside tables or merged cells.
Also alot easier to update a css website as tables become a nightmare to update on a complicated website.
Also alot easier to update a css website as tables become a nightmare to update on a complicated website.
| schoolwebdesign wrote: |
| Also alot easier to update a css website as tables become a nightmare to update on a complicated website. |
Agreed. While development with tables might sometimes be faster and easier, developing with CSS makes updating and maintaining a site far, far faster and easier.
css is my choice too, for all my sites, but we all have to accept the fact that tables are not going away any time soon.
a lot of websites are still designed with tables and even the W3c Web Accessibility Guidelines recognize that designers will continue to use table for layout – and so include information about how they can be implemented in the most accessible way.
the choice is up to us
a lot of websites are still designed with tables and even the W3c Web Accessibility Guidelines recognize that designers will continue to use table for layout – and so include information about how they can be implemented in the most accessible way.
the choice is up to us
| eloiseg886 wrote: |
| css is my choice too, for all my sites, but we all have to accept the fact that tables are not going away any time soon.
a lot of websites are still designed with tables and even the W3c Web Accessibility Guidelines recognize that designers will continue to use table for layout – and so include information about how they can be implemented in the most accessible way. the choice is up to us |
The W3c Web Accessibility Guidelines say NOT to use tables for layout. It should only be for content that is present in a table eg a time table
| schoolwebdesign wrote: |
| The W3c Web Accessibility Guidelines say NOT to use tables for layout. It should only be for content that is present in a table eg a time table |
Agreed!
Good discussion folks!
| schoolwebdesign wrote: |
| The W3c Web Accessibility Guidelines say NOT to use tables for layout. It should only be for content that is present in a table eg a time table |
May I point out that I never said that W3c WAG encourages the use of tables, but merely recognize that designers, despite recommendations for css and web standards, will always do what they want. It's just a fact they are acknowledging.
Add to that that although css is easy to learn and makes websites search engine friendly, it can get tricky sometimes, there are things that are not so easy to grasp (don't forget the box model). Not everyone is willing to spend hours even days researching why a sneaky little thing can mess up the entire layout, so, in frustration, they go back to tables, as a last sure fix. Also, there still are many professionals that, while not endorsing tables, they don't reject them outright either. More, there are many websites built in tables that do very well in SERPs.
I see this css vs tables debate much like a democracy: everyone can design their website as they please, as long as they don't hurt other sites. There should always be options, don't you think?
I think you have missed the whole point about tables and accessibility. Its not about designers, its about the end user/visitor. We build websites using css and use tables for some content because its more accessible for the website visitor.
Here is a great summary of why everyone switched to CSS layouts instead of tables:
http://rondam.blogspot.com/2009/02/on-semantics-of-html.html?showComment=1298637986011#c7024769282544101040
As to the people here in this thread claiming CSS makes your layout work better across browsers, are you insane? Tables have always been supported in even the oldest of browsers, and always will be. CSS however, differs dramatically in how it is rendered from browser to browser. Writing browser-specific CSS is messy in my opinion.
The approach I always take is create a table skeleton, a very basic structure of the site. The rest is done in DIVs.
There is NOTHING wrong with using tables for layout. As long as you use a null SUMMARY attribute for every layout table, it is invisible to users visiting on assistive technology like JAWS.
Tables are EXCELLENT at liquid layouts, something 100% div based sites are not.
http://rondam.blogspot.com/2009/02/on-semantics-of-html.html?showComment=1298637986011#c7024769282544101040
| Quote: |
| I think we should perhaps specify exactly what HTML and CSS successfully accomplish and what they don't. HTML is good at logically (or "semantically") representing hypertext and CSS is good at styling flowed HTML elements. CSS is awful at expressing layout; so awful, in fact, that I think such attempts should be considered just as "hackish" as using table-based layouts.
As we all know, when Tim Berners-Lee invented the web in 1993, he simply wanted to share with others on the Internet marked up hypertext documents. He defined a set of tags that reasonably reflected what he thought should be in a hypertext document. Clearly he left some things off, but HTML 0.1 worked. HTML quickly evolved to include those elements. This is so true that even Google Docs uses HTML as its internal representation of word-processing documents, and the tag set is basically HTML 3.02. Reader's Digest version: HTML is really, really, really good at expressing linked text documents. HTML, however, was ugly with the default renderings. Plus, adding "font" tags everywhere cluttered the markup and made change nearly impossible. Thus, CSS was created as a way to make formatting text documents easier and more modular. The basic idea behind the original CSS was that each element would be rendered in an almost linear, flow-like fashion, just like in documents. CSS concerned itself with inline style and block, much like any good document editing software. CSS also allowed users to define how the flow should behave around "boxes" - this is where we got the wonderful 'float' and 'clear' properties. For these problems, CSS was a really, really good solution at adding modular and fairly granular style to hypertext documents. For reasons I will never understand, the CSS designers didn't quit while they were ahead, but instead kept going. Trying to make CSS a panacea of problem solving, they introduced a new set of flimsy position properties and other layout properties that are, quite frankly, bizarre. Likewise, web designers saw the power of CSS at accomplishing tasks at which CSS is really, really good and made the fallacious assumption that CSS must therefore be good at layout as well. The omniscient, benevolent CSS designers SHOULD have come up with a layout language, but instead added a bunch of crap to CSS that IMHO weakened it. HTML is today powerful enough to describe all web applications' features needs to be described in these applications. Unfortunately, CSS is beyond broken with respect to layout. "Misusing" HTML elements is sometimes the only solution. However, I don't think CSS was *originally* intended to be the panacea as it is treated today. Someone who uses {margin:auto;} is just as guilty of using "hacks" as someone who uses tables for design in my book. Hacking is necessarily about pushing the envelope to achieve what you want with what you have instead of waiting for a perfectly designed set of rules to fall from heaven. Google Maps and Gmail, which were truly revolutionary web apps when they came out, pushed the envelope and did all sorts of hackish things in their day, like using a hidden iframe to preserve back-button behavior. The processes for holding history evolved, and so Google no longer has to hack to achieve these same requirements - but they are certainly hacking in other ways to continue to push the envelope. In time, I am sure we will develop new systems to accomplish layout more effectively. But we will never get there if we keep defending CSS as the Holy Grail of Layout. Although I find CSS as the lesser of two evils in my design work, I am highly sympathetic to the author's arguments. If more people like him had the guts to stand up and say CSS was bad at doing layout, maybe we would get something better than CSS. There is a reason we don't use Babbage's difference engine today - it sucks compared to what we have now. |
As to the people here in this thread claiming CSS makes your layout work better across browsers, are you insane? Tables have always been supported in even the oldest of browsers, and always will be. CSS however, differs dramatically in how it is rendered from browser to browser. Writing browser-specific CSS is messy in my opinion.
The approach I always take is create a table skeleton, a very basic structure of the site. The rest is done in DIVs.
There is NOTHING wrong with using tables for layout. As long as you use a null SUMMARY attribute for every layout table, it is invisible to users visiting on assistive technology like JAWS.
Tables are EXCELLENT at liquid layouts, something 100% div based sites are not.
CSS2 defines display: table-cell which is supported by all modern browsers, fwiw.
Also, there are endless copy-and-paste examples of CSS layout available for free. Robust, tried-and-tested code with any number of columns, any source order, any mix of fixed and flexible measurements.
If you're still finding CSS layout difficult, you just need to Google a bit more.
Also, there are endless copy-and-paste examples of CSS layout available for free. Robust, tried-and-tested code with any number of columns, any source order, any mix of fixed and flexible measurements.
If you're still finding CSS layout difficult, you just need to Google a bit more.
In what way is the <b> tag "very good for your SEO work"?!
(LOL.)
(LOL.)
CSS is the only way to go. Tables do not do well in a wide variety of circumstances.
The links I'm about to give may not be as accessible as they should be, but they demonstrate the power of CSS -
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=standard
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=cattleya
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=dragonfly
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=yosemite
Those are all the same page, but with different layouts. By using CSS and divs for layout, it's easy to present the content in many different layout schemes.
Tables are absolutely horrid if the person viewing your content is not using a screen size you designed for, and tables can also be difficult for search engines to figure out what parts of your page are important.
Tables are for tabular data, not for layout. Using them for layout was a hack, a hack that is no longer needed.
[edit]Hi DOMBlogger and welcome to the forum! We don't usually allow new members to post links until they've submitted a certain amount of posts. However, in this case I'm making an exception as your comments and links are very much on topic. Gary Miller - mod[/edit]
The links I'm about to give may not be as accessible as they should be, but they demonstrate the power of CSS -
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=standard
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=cattleya
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=dragonfly
http://www.domblogger.net/Documentation/XMLAuthoring?ptemp=yosemite
Those are all the same page, but with different layouts. By using CSS and divs for layout, it's easy to present the content in many different layout schemes.
Tables are absolutely horrid if the person viewing your content is not using a screen size you designed for, and tables can also be difficult for search engines to figure out what parts of your page are important.
Tables are for tabular data, not for layout. Using them for layout was a hack, a hack that is no longer needed.
[edit]Hi DOMBlogger and welcome to the forum! We don't usually allow new members to post links until they've submitted a certain amount of posts. However, in this case I'm making an exception as your comments and links are very much on topic. Gary Miller - mod[/edit]
| Ben Millard wrote: |
| In what way is the <b> tag "very good for your SEO work"?! (LOL.) |
It has been demonstrated that google gives more weight to words that are wrapped in a <b> or <strong> node. When using <strong> is semantically inappropriate, <b> will give you the extra SEO without being semantically incorrect.
For example, if you are blogging and mention a hollywood stars name, wrapping the name in a <b> node may bring you better hits when people search for that stars name.



