Design first in HTML/CSS and then to drupal fast?

1. Yes, Drupal has it's own style sheet found in Misc/Drupal.css. You can of course override it with your own additions to the included classes and IDs.

2. Because - I think - Drupal packs so much functionality that it simply wouldn't work without any basic styling. But, as written above, you can override it in your own stylesheet. Just view the source and you'll see what Drupal is generating.

3. It's a theming engine that is used to render themes better. It is included in the Drupal distro, but you can use themes without any theming engine or another theming engine like Xtemplate. Look in the handbook.

4. Don't really understand what you mean. You have to understand that Drupal is a highly flexible and complex CMS with a lot of built in functionality. It fully supports CSS to a degree that the core itself needs CSS to display what it does properly.

(5.) If this is your goal, I suggest you look at ExpressionEngine (http://www.pmachine.com) which works exactly like you want. It does not do all the things Drupal does, but is easier to handle for designers and for straight up blogs and corporate sites. You just drop in the php where you want it. It does cost a bit though.

/ Ayza

Servus.

I can see your confusion, and it's not only you who is confused at first. I hope I can shine some light on the topics:

First, no piece of CSS can style any HTML without knowing the proper classes and id's. You can of course style standard HTML tags, and it's the same with Drupal. As Drupal is generating the code, you have to look up the classes it generates by default to style the classes you're interested in. There's "styles.css" which gets you directly to the point. Make a copy (better safe than sorry thing :) and modify styles.css to your liking.

As I have no idea how familiar you are with CSS, I can only point you to some of the very basic stuff you may want to look up: if there is an HTML and a CSS already, there are perfect examples on this site how to strip out all the content from HTML to get a skeleton to start from. The bare bones are named classes which reflect the structure of your page. Now fill in the proper PHP statements and your layout comes alive.

Let's assume you have

<div id="header">
      <img class="myLogoImageClass" src="logo.png" alt="My Logo" />
   </div>

You strip this down to

<div id="header">
   </div>

Next you look up the page.tpl.php of let's say Bluemarine (in the themes folder). There you'll find what Drupal variables are used to send the different parts of your page to the final page. You need some very basic PHP code here to get some "flesh" on the bare bones. Let's assume you want your logo be shown in the header section of your page, you may come up with something like this:

<div id="header">
     <?php if ($logo): ?>
                <img class="myLogoImageClass" src="/<?php print ($logo) ?>" 
                 alt="my logo" /></a>
      <?php endif; ?>
      </div>

Pretty much the same as before, if you aren't afraid about the php snippets in between your code. But they're needed to get the proper content from the datebase to your page. Think of it being the glue between content and container.

It's that simple, really. All you have to do is match the names in use.

From your writing, I'd say you should re-think the whole webpage thing first:
CSS is a nice thing, for sure. But in fact it's only adding eye-candy to content. As long as you don't have any message you want to present, there's no need to discuss the way how the stuff should be presented to the audience. Content rulez, to cite a popular slogan, and search engines are interested in content only...

So if you want to deploy any software for managing content without having to hand-tune every single page you create, you have to classify your content first, put it into the proper nodes as Drupal calls these atomic chunks of content, and then you decide where to present what chunk where and how -- that's where the CSS comes in. Starting with the CSS is like tayloring a suit and later asking for the right person to wear it...

The Drupal folks were really smart inventing that structure: Their PHP code just happens, and put into the proper sections of your page.tpl.php the sections will be embedded to your site structure and your CSS. The programmers don't have to care about the looks of your page, they can stick with programming efficient code. Our part "on the other side of the screen" is just to take what they deliver, have a look on the tag they put on that piece of information (they call it a variable, like $logo) and embed it in our layout. That's the smartest approach to the problem I know. All it takes to become familiar is to get into the themes folder, copy a theme of your liking, renaming that new folder 'myTheme' and engaging that theme in 'administer::themes'. From then on you can tweak the page.tpl.php and screen.css to your likings... Once you got that, you will have less trouble to get into more advanced concepts.

Your final conclusion about when to start with what is somewhat mood. Clearly, you have content first, then navigation and usability, and finally you make the stuff look good. If there is no block of marble, you can't craft a sculpture. You can do sketches and drawings, but you can't sculpt anything without content.

I do my design sketches in Illustrator without having to touch content. Once I'm satisfied with the looks in Illustrator, I can define the regions of my page and start building a working draft. That working draft defines a lot of CSS classes not yet built, and later I'll add a meaning for these names doing the CSS.

Have a look at www.csszengarden.com -- the whole project is built on GIVEN html and designers are allowed to submit only the CSS. They don't tweak the content to the presentation, but adjust the presentation to the given content. That's the way design works, making the best (or most appropriate) from any content.

Drupal is pretty much in synch of this way of doing sites. Drupal's support for CSS is out of question -- Drupal is just delivering content to your backdoor and you have to make it look good in the shopping window. That's the whole point of doing things with CSS, and in this sense Drupal does a perfect job. It simply delivers.

Of course you won't use Drupal if you want a perfectly handcrafted page -- Drupal or CMSes in general deal with classes of content, presented the same on various pages. That's great for maintaining content, and having content added by less educated folks. Even a secretary can add content to a properly built CMS. As a web designer from the early days of the web I can remember my clients calling me to ask for a new page on their site. With Drupal, these days are gone and I can concentrate on what I really want to do: care about presentation. As a designer, I take the responsibility to make my client's content look as good as possible, but I don't want to deal with basic stuff like copying html code and entering new content into the various p tagged sections of that page any more. On the other hand, I have to sacrifice some of the freedom I had before -- if content doesn't fit my design, I have to give design a second thought. But not having to worry about the underlying code is worth it.

Hope you'll discover yourself,

Norbert

---
form follows function