PreMade Webdesign and Drupal

Question

I'm terribly new to web development. I'm trying to make a pretty simple site with a friend. My friend has taken the time to design the layout for our site, and we have things looking how we want in a static HTML page.

What I'd like to do now is move over to a Content Management System like Drupal but keep the same design that we have all ready laid out.

Since I'm completely new to this field, I'm looking for some best-practices advice as to how to make this leap.

It's apparent to me that I could probably edit some existing Drupal Theme to make it give me the layout that I want, but is that the path I should go down?

Thanks!

Update: Also, is it more than just replacing my style.css with their style.css?

Update 2: The end goal is for people to be able to log in and create news entries, very similar to a blog that will then appear on the front page. There will be other items on the left- and right- but they don't need to be directly accessed by anyone, really. They'll stay pretty static.

Answer 1

Pour your heart and soul into the Drupal Theming Guide for the next few days. Theming, like most things, is best done if followed by a gratuitous amount of time in the documentation.

Answer 2

The Zen theme is sort of a meta-theme that's designed to be fully standards compliant and make pretty much every aspect of theming readily customizable, with lots of informative commenting. It's the best place to start if you want to develop your own theme. Even if you find a theme that looks a lot like the one you want to create, it's probably still better to start with zen because it's extremely well laid out and instructive. That being said, I've never built a theme from scratch, but it sure looks like a lot of work.

Update

In general the best approach will likely end up being to use your designer's HTML and CSS as a reference, and to edit the Zen-based templates and CSS files to recreate that appearance. It's a bit magical.

You will end up breaking the styles used in your designer's layout into chunks that are part of various template files. The mostly-static stuff on the side columns will become what Drupal calls "blocks"; you'll likely use the top part of the page to refine the HTML for the header section of the main page template; and you'll use the central part to add any necessary tags to the content section of the main page template.

I tend to make liberal use of the Firebug extension for Firefox, or the developer tools built into Chrome. These tools let you quickly locate a given CSS element that you want to change, and edit it to see how the change will look. At first though it's probably better to just read through the whole CSS file to get a feel for how it works. Again, Zen's CSS is very easy to digest.

Answer 3

Start with either Zen or Framework themes. They provide good starting points for working with the CSS to adapt to your design.

This helps too:

http://drupal.org/theme-guide

Whatever you do, don't take Garland theme as how a good drupal theme is done. I went down that path when I first started Drupal...