Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

Because the separation of design and content is a fundamental way design works. From a tech standpoint, that's exactly what stylesheets are designed to do.

From a traditional standpoint, that's why copywriters are different people from designers.
 
don't normally post but felt the need after reading this post.

the op posted a question asking for a solution that can help him manage a bunch of flat HTML files and exclude CSS; then when the responses informed him that those sorts of practices were inanely stupid and had been dropped in the 90s he spat his dummy out.

this guy is not willing to listen to decent advice - he is just arrogant moron who is looking for some software that can accommodate the uselessly outdated skills he has somehow learnt over the years.

well good luck with coda/regex. see how that goes ey? hey, why don't you use vim - it's free and you've already got it installed :)

Not sure where you work but where I work I don't get to choose my projects, they are handed to me. So, with that in mind it is possible that the company that actually owns the pages (every just assumed it was the OP that designed/owned them) may actually be content with them and don't want to spend man hours trying to change them as it would be a fairly large undertaking. Man hours = money! Did you ever think that he may have simply been told to support it as is?

So, rather than continually beat the OP up (who has decided to let the the thread die anyway) people should post helpful items and get off of your coding high horse. I support a ton of applications I didn't write and that barley function, and in the real world (which I am guessing most here are nothing but keyboard warriors that read HTML for dummies) we can't always do what is right. If I had to recode all of those old apps it would take me forever. I guess I am lame for having to install older versions of visual studio to support them eh? :rolleyes:
 
Because the separation of design and content is a fundamental way design works. From a tech standpoint, that's exactly what stylesheets are designed to do.

From a traditional standpoint, that's why copywriters are different people from designers.
Stylesheets control the visual presentation of the content. "Visual presentation" does not equal "design." The primary function of design is to create something useful.

The only way you can create something useful is if there is clear organization and clear hierarchy present. That doesn't happen on a stylesheet. In web design, the hierarchy and the structure are established in the the HTML. Prior to that, it happens in the CMS at the hand of the content creator.

When you decide that a set of information is a definition list, you've made a design decision. When you decide that something is a block quote, you've made a design decision. You've decided that the information being presented should be treated in a manner that is consistent with other similar types of information.

And you can't separate the visual design of a site from the content of the site. The visual design is content. Color is content. Typefaces are content. Proportion. Scale. Shape. All of those things are content.

It's an extremely simpleminded view of design to say "it's what stuff looks like."

The purpose of stylesheets is not to separate design from content, it is to separate the presentation/experience layer from the content structure. Both of those things contribute to the design, and both of those things contribute to the content. They can't be separated.

But according to you, I have no idea what I'm talking about.
 
Last edited:
Stylesheets control the visual presentation of the content. "Visual presentation" does not equal "design." The primary function of design is to create something useful.

The only way you can create something useful is if there is clear organization and clear hierarchy present. That doesn't happen on a stylesheet. In web design, the hierarchy and the structure are established in the the HTML. Prior to that, it happens in the CMS at the hand of the content creator.

When you decide that a set of information is a definition list, you've made a design decision. When you decide that something is a block quote, you've made a design decision. You've decided that the information being presented should be treated in a manner that is consistent with other similar types of information.

And you can't separate the visual design of a site from the content of the site. The visual design is content. Color is content. Typefaces are content. Proportion. Scale. Shape. All of those things are content.

It's an extremely simpleminded view of design to say "it's what stuff looks like."

The purpose of stylesheets is not to separate design from content, it is to separate the presentation/experience layer from the content structure. Both of those things contribute to the design, and both of those things contribute to the content. They can't be separated.

But according to you, I have no idea what I'm talking about.

We have very different ideas of what design is. Color / typeface / scale / visual design is most definitely not content, in my world. Neither academically nor professionally would I ever hear anyone making that statement. The same with an ordered list being part of design.

Different horses for courses, I suppose. but don't assume that your definitions are anywhere near consensus.
 
Why are you using a table for this data in the first place? Tables are meant for tabular data, not for positioning.

Because using a table is significantly better than a bunch of   references all over the page when certain elements must appear in a very specific spot on the page according to the customer's requirements. If I need to line up field elements in perfect columns and rows, across and down, guess what? That's called a table.


Ignoring the styling considerations of having too many fonts / sizes on a page, I don't think you fully understand how to use CSS.

Believe me. After having fought Dreamweaver for years, I know full well about CSS and where to use it and not use it.

Looking at the following:

Code:
<html>
<head>
<body>
<FORM method="post">
Type Here: <INPUT type="text" id="txtInput1">
<INPUT type="submit" value="submit" id="btnSubmit">
</FORM>
</body>
</html>

That's a valid snippet of the simplest form I can think of. If I want to bold the "Type Here", I would do this:

Code:
<B>Type Here:</B>

Why? Because it works. What you're proposing is that I do this:

Code:
<html>
<head>
<style type="text/css">
div 
{
font-weight:bold;
}
</style>
</head>

<body>
<div id="bold">
Type Here:
</div>
</body>
</html>

or some nonsense to do the same thing. So instead of 7 characters, you suggest I have basically 8 extra lines of code. I would do that IF I had multiple lines or sections that I was going to bold. But that's pointless if I'm only bolding those two words. I might as well use the HTML tag, it's faster and easier to deal with.

If I had to bold one line and italicize one line, in my world it would be:

Code:
<B>Type Here:</B>
<BR>
<I>Initial Here:</I>

Simple, effective. In CSS, not so much.

Code:
<html>
<head>
<style type="text/css">
.ital 
{
font-style:italics;
}
.bold
font-weight:bold;
</style>
</head>

<body>
<div id="bold">
Type Here:
</div>
<BR>
<div id="ital">
Initial Here:
</div>
</body>
</html>

or some such. Way too much code to do simple formatting on single regions. It's possible I wrote it wrong, I'm typing off the top of my head, but the point is made. I'm not even counting DTD or anything else that one must pay attention to if using anything other than simple code for simple tasks. It'd be like using C# to write a 30-line script to call out to time.nist.gov to get the current time, format it into a US-based order, and apply it into an HTML field, when a 4 line JavaScript can do the same thing.

I state again, pay attention this time.

If the formatting that I am applying needs to be applied across a substantial part of the page, or a number of pages, CSS makes sense. If the format only applies to one section of one page, there's no sense in making a style just for that section when you could just use formatting tags.
 
Because using a table is significantly better than a bunch of   references all over the page when certain elements must appear in a very specific spot on the page according to the customer's requirements. If I need to line up field elements in perfect columns and rows, across and down, guess what? That's called a table.

No, that's called positioning. Which CSS handles very well. &nsbp;? Is this 1998? You really think that non-breaking spaces or tables are the either-or of preferred methods for positioning items on pages?


Looking at the following:

Code:
<html>
<head>
<body>
<FORM method="post">
Type Here: <INPUT type="text" id="txtInput1">
<INPUT type="submit" value="submit" id="btnSubmit">
</FORM>
</body>
</html>

That's a valid snippet of the simplest form I can think of. If I want to bold the "Type Here", I would do this:
That's actually not a valid form, and part of the reason why you're having difficulty.

Forms need a block level element before the inputs. A div, ul, or fieldset is usually used. And the "type here" should be contained in a label, not just floating in the aether.

Code:
<B>Type Here:</B>

Why? Because it works. What you're proposing is that I do this:

Code:
<html>
<head>
<style type="text/css">
div 
{
font-weight:bold;
}
</style>
</head>

<body>
<div id="bold">
Type Here:
</div>
</body>
</html>

Actually, no, what I'm suggesting is that you use correct semantic markup on your HTML, then correctly apply a style to that markup.

Put the labels in label tags, then apply a style to your labels in CSS. Done. No need for classes, ids, or the like.

It's possible I wrote it wrong, I'm typing off the top of my head, but the point is made. I'm not even counting DTD or anything else that one must pay attention to if using anything other than simple code for simple tasks.

You did write it wrong. And this is absolutely basic, first fifteen minutes of class CSS. You don't understand CSS. That's fine, but don't try to make excuses about why you're doing it wrong. You're not familiar with modern web technology. It's okay. But to try and convince us (or yourself) of anything different is not helping anyone.

There's also no issues with DTDs in anything we're talking about here.

I state again, pay attention this time.

If the formatting that I am applying needs to be applied across a substantial part of the page, or a number of pages, CSS makes sense. If the format only applies to one section of one page, there's no sense in making a style just for that section when you could just use formatting tags.

Utter hogwash. Good code is good code is good code. HTML shouldn't imply any kind of presentation. It's a content markup language. CSS is where you apply presentation to that content. You're welcome to pretend that users with accessibility issues don't exist, but now you're also pretending that users don't view pages on phones, tablets, etc. Thankfully, HTML 5 is forcing content creators into semantic markup, come hell or high water. FONT is no longer supported, and B and I no longer imply bold text or italic text.
 
No, that's called positioning. Which CSS handles very well. &nsbp;? Is this 1998? You really think that non-breaking spaces or tables are the either-or of preferred methods for positioning items on pages?

You are so right -- a single pixel, transparent GIF is the way to go!
 
We have very different ideas of what design is. Color / typeface / scale / visual design is most definitely not content, in my world. Neither academically nor professionally would I ever hear anyone making that statement. The same with an ordered list being part of design.

Different horses for courses, I suppose. but don't assume that your definitions are anywhere near consensus.
Your opinion of design is based on what you read in CSS For Dummies. The idea of "separating content from design" was formulated so that the separation of HTML and CSS could be sold to the masses.

My opinion is based on 15 years of research and practice. It's based on books from Palladio's I Quattro Libri dell'Architettura to Josef Müller-Brockmann's Grid Systems in Graphic Design and countless other works that influenced the environments in which we all live. It's not based on books that are written so that mommy bloggers can feel better about calling themselves designers.

Would you really tell Corbusier that the content of his buildings have no consequence on his design? Would you tell Jan Tschichold that his typefaces were designed with no consideration for the text they expressed? Would you tell Dieter Rams that the function of the products he designed played no part in their design?

You can't call an architect a designer without also calling a structural engineer a designer.

The function of a product and the structure of the pieces of that product are paramount in their design. If you feel otherwise, you have an elementary understanding of design whose only function is to be easily digestible.

It's one thing for you to disagree with me, it's another thing for you to take one sentence and assume that I don't "have any idea what [I'm] talking about." It's one thing to have an opinion, it's something else to be ignorant of the opinions of others.
 
Your opinion of design is based on what you read in CSS For Dummies. The idea of "separating content from design" was formulated so that the separation of HTML and CSS could be sold to the masses.

My opinion is based on 15 years of research and practice. It's based on books from Palladio's I Quattro Libri dell'Architettura to Josef Müller-Brockmann's Grid Systems in Graphic Design and countless other works that influenced the environments in which we all live. It's not based on books that are written so that mommy bloggers can feel better about calling themselves designers.

You're barking up the wrong tree if you're trying to "out experience" me.

The function of a product and the structure of the pieces of that product are paramount in their design. If you feel otherwise, you have an elementary understanding of design whose only function is to be easily digestible.

Your academic view on this disregards the real world. A collection of data is the same content, regardless of the manner of display. Content informs design, certainly. But content is not design.

Take a block of lorem ipsum. That's content. Style it up in a multitude of different ways. Not just typesetting and color. Think out of the box. Any kind of presentation you want. That's design. Changing the design hasn't changed the content.

It's one thing for you to disagree with me, it's another thing for you to take one sentence and assume that I don't "have any idea what [I'm] talking about." It's one thing to have an opinion, it's something else to be ignorant of the opinions of others.

Pot, kettle.

"If you think you can separate content from design, you have a horribly misguided definition of design."

Sound familiar?

Oh, and uprating your own posts: classy!
 
You're barking up the wrong tree if you're trying to "out experience" me.



Your academic view on this disregards the real world. A collection of data is the same content, regardless of the manner of display. Content informs design, certainly. But content is not design.

Take a block of lorem ipsum. That's content. Style it up in a multitude of different ways. Not just typesetting and color. Think out of the box. Any kind of presentation you want. That's design. Changing the design hasn't changed the content.



Pot, kettle.

"If you think you can separate content from design, you have a horribly misguided definition of design."

Sound familiar?

Oh, and uprating your own posts: classy!
At what point did I say that content is design? I said that the two can not be separated. Do you understand the difference?

You're the one that interjected into a conversation and stated that I had no idea what I was talking about. I can call an opinion misguided without assuming that the person no basis for that opinion.

I'm not trying to "out experience" you, either. I don't care how long you've been doing things wrong. You questioned whether I had any idea what I was talking about, and I defended myself. You were the one that questioned my credentials. Your sad collection of experience is inconsequential.

You also called my opinion "academic," but earlier you said, "Neither academically nor professionally would I ever hear anyone making that statement" in regards to what I said. Is my opinion academic or is it not? You seem to be confused.

And I edited my post because of a typo. What does that have to do with class?
 
At what point did I say that content is design? I said that the two can not be separated. Do you understand the difference?

I know exactly what you said. That's the part that's totally wrong. Content and design can be easily separated. Here's a fun example. Turn off your style sheets. Voila. Design removed from content.

I'm not trying to "out experience" you, either. I don't care how long you've been doing things wrong. You questioned whether I had any idea what I was talking about, and I defended myself. You were the one that questioned my credentials. Your sad collection of experience is inconsequential.

Hahaha. Seem to have hit a nerve, eh!? You can believe what you want about my experience.

You also called my opinion "academic," but earlier you said, "Neither academically nor professionally would I ever hear anyone making that statement" in regards to what I said. Is my opinion academic or is it not? You seem to be confused.

In my first usage of the word, I was talking about my experience in academia. In my second use of the world, it was used a derogatory, "you don't have any real world experience with what you're spouting off about", manner.

And I edited my post because of a typo. What does that have to do with class?

Not talking about editing. Talking about clicking the +1 on your own posts.
 
Dreamweaver

If you wrote your websites in Dreamweaver, you can simply tell Dreamweaver to convert the embedded styles to an external stylesheet (CSS Styles > Convert Inline CSS to Rule) and then edit the sites with Coda or even TextWrangler. Very easy.
 
That's actually not a valid form...

Yes, it is. Read.

http://www.w3schools.com/html/html_forms.asp


Forms need a block level element before the inputs.

They don't "Need" anything but what I wrote. Now, one possible way of writing the form might include a block level element, but it is NOT required by any means.


A div, ul, or fieldset is usually used. And the "type here" should be contained in a label, not just floating in the aether.

You need neither of those things. They are NOT required.

Now I see your flaw. You're in this tunnel vision that YOUR way is the only way. When the reality is, there are multiple ways of writing code; thus the different standards that are present. You assume that CSS is the only way to write code because it's the way you prefer it be done. Guess what? The web doesn't revolve around you.

Nobody is forced to write HTML5, nobody is forced to write even HTML 4. People write what they want to write. If I don't feel like writing for mobile phones, I don't. If I don't feel like writing true XHTML, I don't. Read Carefully: There is NO requirement for what I choose to write my code in. I could generate the whole thing from a server-side script if I'm so paranoid. Realistically, the forms I create sit inside an application and are used only for that application, not to the web. CSS is overkill to collect 3 pieces of data on a form that doesn't need to look pretty.

You love CSS: we get it. Go ahead and use it. However, plain old HTML isn't wrong, and until the browsers decide to remove support for those tags (they won't, too many websites still making use of them), they are correct and acceptable. Maybe not in your world, but in the rest of the world, they are. Get over yourself.
 

w3schools is a horrible site. It's filled with errors. I wouldn't recommend using that as a source.

Here's the w3c reference:
http://www.w3.org/TR/html4/interact/forms.html#h-17.3

Forms MUST contain either a script tag or a block level element, not including the element form. Input elements, select elements, and the like are NOT block level elements.

If you're going to use the word "valid", understand what that means.

They don't "Need" anything but what I wrote. Now, one possible way of writing the form might include a block level element, but it is NOT required by any means.

Again, if you're going to use the word "valid", understand what it means. Your form is not valid without adhering to the standard. The standard is defined in the link I provided above. Will your form work? Maybe. Nobody knows. If it does, it's due to generous coding on behalf of user-agent programmers. It's not due to any kind of adherence to validity.


Now I see your flaw. You're in this tunnel vision that YOUR way is the only way. When the reality is, there are multiple ways of writing code; thus the different standards that are present.

No, there are two ways of writing code. Valid code which will always work, or invalid code that will kind-of-sometimes-usually work, thank god for buggy user agents.
 
Last edited:
Why? Because it works. What you're proposing is that I do this:

Code:
<html>
<head>
<style type="text/css">
div 
{
font-weight:bold;
}
</style>
</head>

<body>
<div id="bold">
Type Here:
</div>
</body>
</html>

or some nonsense to do the same thing.

Well, I hope that's not what he's proposing. Because that is nonsense, and totally mis-using CSS.

How about applying some sensible class (not ID), like, I dunno, maybe "field_heading", or if you want to be terse "fh"? And then use that for all your field headings?

For that matter, you can do this one without ANY IDs or classes. First of all, use the label tag correctly. Let's forget any silly argument about whether it's "required". It's a good idea. There are plenty of good reasons beyond styling - for example, it helps provide accessibility for people with handicaps.

Now you can just style all your labels, and you don't need an ID or class.

If you just want to make some ad-hoc word stand-out, it's more appropriate to use <em> today than <b>. You can style <em> then and make all your stand-outs change to a different style.

If you have different KIND of standouts throughout your pages, then you can start using classes.

----------

Would you really tell Corbusier that the content of his buildings have no consequence on his design? .

Building content = "kitchen, living room, conference room, office, etc. etc. etc.".

Well, of course content has consequences on design. But should design rule content? Does he get to say whether the building gets a kitchen or not?

Actually... (switching designers) I lived across the street from these at one time:

http://www.trulia.com/property/3059796000-1318-Joliet-Pl-Detroit-MI-48207

Man, those things have tiny little useless kitchens! That's what happens when designers start mucking with content! :)
 
Would you really tell Corbusier that the content of his buildings have no consequence on his design?

fwiw his name is Le Corbusier

only bothered to correct you as you seem to be a fan of his and its nice to know these things.

and before some art history nerd tries to call me out, I am aware that his legal/birth name is Charles-Édouard Jeanneret
 
For what it's worth, i used Adobe GoLive for years in the 90s and never found an app that was more handy, practical, easy and intuitive.
That was before Adobe bought DW and dumped GoLive. But it still works, and would seem to fit perfectly for the OPs situation.
If you can still find it out there, last version being GoLive 9, could be worth a try? Not as a move toward the future, but as a way to keep up with old sites without rebuilding everything. :eek:
 
Growing out of "Old-School"

I've been reading through the thread, and find I am agreeing with both sides of the discussion. I am a Graphic and Web designer with a small business clientele and about 60-70% of my total volume is web design over print.

I have been trying to learn modern standards, and I an absolutely sure that HTML4, 5 and CSS3 is absolutely the way to go. New sites, I am making an effort to build them to current standards, SO much less hassle. But over the years, I do have some older legacy sites that are rather Old-school with table layout, and <font-face> galore. And a PAIN IN THE A** to update.

I have one client with a large, ever expanding OLD site that I have been begging to let her have me rebuild the site in PHP/XHTML4/CSS3... for my own sanity. But the terribly labor intensive prospect of rebuilding and migrating all the content is, daunting. And of course, client is balking at the cost of a full rebuild, even tho' it will save money long term. It IS a dilemma.

And modern versions of Dreamweaver DO ruthlessly police sites... but that's great for modern sites and I don't mind it.. but very much a pain in the A** for legacy sites, leaving a crazed trail of page specific CSS Styles, Spans and Classes on individual pages, and a major chore to coordinate. I do wish that DW did have a "legacy" mode... i.e. leave the underlying code the hell alone.

You can do better editing legacy if you edit in the code view, even in split view where you can see the results. DW tends to leave direct HTML code edits alone, but will ruthlessly "enforce" edits done in the Design view. However I do wish that the spry widgets sucked less. Sometimes I will open files in a pure text editor to get "under the hood". TextWrangler is good, BBEdit is even better.

Apparently, DW treats people who do most of their edits in Design Mode as drooling children who need their hands held, but decided that pros and manly men edit CODE. Oh well, it's what it is.

WYSIWYG is nice, but seriously, if you are going to be a web pro, you need to learn some code, much as that makes my visually oriented Designer's brain overheat.
 
Last edited:
html wysiwyg solution

Why not try to get hold of a copy of GoLive 9? It works on Intel, is a bit buggy but not as cumbersome as Dreamweaver. It will try and move you towards CSS, it's true ( <span> styles rather than font tags) but you'll be able to hand code and see what your page looks like.
 
That was before Adobe bought DW and dumped GoLive.

FWIW, Adobe bought DreamWeaver from Macromedia. Macromedia got much of DW from Elemental Software/MediaShare and intially set-up a development team with ex-ES people here in San Diego. (And then bought ES.)

I worked for MediaShare around 1994. They were doing CDROM catalog publishing for big fish using Macromedia tools. My boss knew I had an interested in this newfangled web stuff, so one day he comes to me and asks if I can write something to "publish for the web". So, one seed of DW was this thing called "PBWeb". ("ProductBase for Web). The first big site we did with PBWeb was the 3M product catalog, or at least part of it. Do you know how many kinds of specialized adhesive tapes there are?

That was sooooooo long ago though. People are still using DW?

I got like .001 share of Macromedia...

I love the subtle "error" on the DW Wikipedia page:

"Dreamweaver ills available for both Mac and Windows operating systems. "
 
Why are you using a table for this data in the first place? Tables are meant for tabular data, not for positioning.




Ignoring the styling considerations of having too many fonts / sizes on a page, I don't think you fully understand how to use CSS.

Even in the worse case scenario where literally every block of text is using a different style, it's not _more_ work to do it with CSS. It's just replacing inline font styling with an ID, then applying the style where it belongs, in the CSS.

The reality, where you have patterns of styling (like a standard word document, for example -- headers, paragraph/body text, and different modes of emphasis), you use CSS classes and drastically reduce the amount of work for creation and maintenance.

Some of us remember those old days when CSS was new and positioning was horrible. The only real alternative was tables and layout much like a newspapers and magazines did.

With modern browsers and newer versions of CSS that is no longer the case... until one starts working with FlexBuilder sdk 3.5. We hope to get to sdk 4.5 soon but the changes required to a large and profitable application make that problematic.

Sadly the OP has given up on this thread. I liked the suggestions for moving to CSS classes and the like. But any large site, and in my book a site with a large number of pages is a large site, becomes an issue in going through and changing.

Someone rightly pointed out it could be a client issue where the client is happy enough and does not have or want to expend money for what is considered technical debt. We have that at our shop. It eventually will cave in on all parties, it is just a matter of when.

Later,
 
“We don’t have good language to talk about this kind of thing,” Mr. Jobs replied. “In most people’s vocabularies, design means veneer. It’s interior decorating. It’s the fabric of the curtains and the sofa. But to me, nothing could be further from the meaning of design. Design is the fundamental soul of a man-made creation that ends up expressing itself in successive outer layers of the product or service. The iMac is not just the color or translucence or the shape of the shell. The essence of the iMac is to be the finest possible consumer computer in which each element plays together. ... That is the furthest thing from veneer. It was at the core of the product the day we started. This is what customers pay us for — to sweat all these details so it’s easy and pleasant for them to use our computers. We’re supposed to be really good at this. That doesn’t mean we don’t listen to customers, but it’s hard for them to tell you what they want when they’ve never seen anything remotely like it.”
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.