/    Sign up×
Community /Pin to ProfileBookmark

HTML table page layout + CSS = OK?

Hi everybody!
I am volunteering to make a new webpage for a friend. I want this page to look cool, so I’m using some new techniques I haven’t used before. They involve using tables to arrange the page. I know using tables for that purpose is frowned apon. Would it make it right if I used CSS to do all the depreciated stuff? Height=”100%” bordercolor=”#000000″ border=”1″, but all done with CSS. The table abomination would still be there, just with CSS.

to post a comment
HTML

11 Comments(s)

Copy linkTweet thisAlerts:
@BonRougeJun 20.2005 — It's not actually a crime to lay out your pages with a table and if you do take out all the deprecated attributes and replace them with CSS, it will greatly reduce your html and so pages will load faester. That's a good thing. You're free to do what you like as far as how you layout your page goes, but I'd seriously recommend [i]not[i/] using a table... For me, one of the biggest problems with tables is being able to read the code. I get confused with those tr's and td's all over the place and I can't see what's going on.... What can I say? There are a bunch of reasons which you've probably heard before. I don't think we need yet another pro-/anti- tables thread, so I'll just repeat what I said - you're free to do what you want (to a certain extent - there are accessibility laws in some countries) but I recommend not using a table for the main layout of your page.
Copy linkTweet thisAlerts:
@lonogodJun 20.2005 — Cleared
Copy linkTweet thisAlerts:
@Jeff_MottJun 20.2005 — The real reason you shouldn't be using tables for layout is because HTML is a [i]markup[/i] language. HTML is designed to represent the [i]structure[/i] of a document, not its presentation. For example, the H1, H2, ..., H6 elements are available to describe the topic of a section. The fact that most visual browsers render these elements in bigger and bolder text is a side-effect. The problem comes when people write code for the purpose of achieving the side-effect rather than the element's true purpose. The same is true for tables. They are included in HTML as a means to structure [i]tabular[/i] data; the kind of information that would logically fit into an excel sheet, for instance.

Ideally, you should write HTML code with [b]no[/b] regard for how it will display. Don't even open the page in the browser. This should help you focus on the page's proper structure rather than its appearence. [i]Now[/i] you can open the page in a browser and proceed to add any necessary styling information (i.e., CSS).

When you become more accustomed to using CSS I'm sure you will find it much more powerful than anything you could have done by misusing HTML elements. As far as I know, everyone who has taken the time to truly learn CSS has never gone back.

In addition, following these methods means that the actual HTML documents can (and should) remain unchanged even when your site's visual design gets completely revamped. After all, the page's structure has nothing to do with its visual appearence. If you have coded your pages correctly than your CSS files will be the only ones that need to be modified. This helps keep the site much more maintainable for future changes.
Copy linkTweet thisAlerts:
@lonogodJun 20.2005 — Cleared
Copy linkTweet thisAlerts:
@Jeff_MottJun 20.2005 — [i]lonogod[/i]

Don't think people are going to take your word for anything without at least giving your credibility. I graduated from high school when I was 12 years old and have been building my resume to one that isn't even matched by the president of the school I teach at. I am the Department Chair at Middle Georgia Technical College and also own my own Web Design Company. I think I've proven my point about my credentials on the subject...now how about you Jeff Mott?[/quote]
I think the fact that the sole inventor of HTML and of the World Wide Web, Tim Berners-Lee, as well as the group that continues to develop those technologies (headed by Berners-Lee) agrees with what I said is more than enough to validate my claims.

Feel free to refer to the [url=http://www.w3.org/TR/1999/REC-html401-19991224/]HTML 4.01 Specification[/url]

Perhaps you'd like to pass your credentials along to the inventor of HTML as your way of proving to him to you must know HTML better than him.
Copy linkTweet thisAlerts:
@lonogodJun 20.2005 — Cleared
Copy linkTweet thisAlerts:
@deraJun 20.2005 — hmm y argue, table = tabular data not layout, css2 = layout, things work better when you use them for what they are intended to.

for example

you could put a left shoe on your right foot, you can still walk but its not right and it causes problems this is the same with tables.
Copy linkTweet thisAlerts:
@Sunny_GauthorJun 20.2005 — If you have coded your pages correctly than your CSS files will be the only ones that need to be modified. This helps keep the site much more maintainable for future changes.[/QUOTE]

There's one little thing you should know.... I didn't use external style sheets. The CSS is exactly where the depreciated are supposed to go. I hope that does not change the "goodness" of the page.
Copy linkTweet thisAlerts:
@BonRougeJun 20.2005 — There's one little thing you should know.... I didn't use external style sheets. The CSS is exactly where the depreciated are supposed to go. I hope that does not change the "goodness" of the page.[/QUOTE]
In my humble opinion - it does.
Copy linkTweet thisAlerts:
@Sunny_GauthorJun 21.2005 — I trust it shouldn't change the page in anyway, except for the CSS part.
Copy linkTweet thisAlerts:
@BonRougeJun 21.2005 — No - it'll just change the 'goodness' of it. The page will be less 'good'. It will be lacking in 'goodosity'. Dr Good will come and put the patient to sleep. (I think you get the idea).
×

Success!

Help @Sunny_G spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...